이 글을 진행하기 전에 먼저 작성해야하는 내용이 있습니다.Nuxt에 관하여 논할 레벨이 아니지만, 제가 기대했던 방향과는 달리 실제 사용경험에서 느꼈던 부분을 이야기해보려합니다. 지금도 역시 제가 Nuxt를 잘 이해하지 못하고, 쓸 줄 몰랐기 때문이라고 생각하고 있습니다 : )Nuxt!?아, 그러고보니 Nuxt가 무엇인지부터 시작해야겠군요. Nuxt는 Vuejs 기반으로 만들어진 SSR(Server Side Rendering) 오픈소스 프로젝트입니다.홈페이지의 설명을 덧붙이자면, Vuejs 프로젝트를 진행할 때 서버부분을 미리 구성하여 보다 나은 UI 렌더링을 제공하고, static(정적) 페이지를 만들어내는 기능들을 포함하고 있다고 합니다.또한 프레임워크의 레벨로서 비동기 데이터, 미들웨어, 레이아웃등..

프로그래밍/웹관련 2018. 5. 13. 23:01

이전 포스팅에서 Vuejs를 왜 쓰면 좋고, 다른 비슷한 프레임워크들이 어떤 것들이 있고, 어떤 차이점들이 있는지 알아보았습니다. Vuejs가 정말 쉽게 동작한다라는 것도 어느정도 인지하셨을 것 같습니다 : ) 그러면 실제로 Vuejs를 처음에 시작하게 되면 어떤 것들을 먼저 해야하고, 내가 적용하는 것이 틀린방법은 아닌지 이야기를 시작해보려 합니다. 시작하기전에 제가 설명드리는 방법이 정답은 아니라는 것을 미리 말씀드립니다. 그러나 정말 아무 것도 모르는 상황에서 이러한 방법으로 시작했을 때 나름 도움이 될 것 이라고 생각됩니다.브라우저에서 바로 적용하기Vuejs는 브라우저에서 바로 적용해서 사용하실 수 있습니다. 기존 프로젝트에 추가로 적용되더라도 전혀 충돌없이 함께 사용할 수 있기 때문에 부담없이 ..

프로그래밍/웹관련 2017. 5. 8. 18:56

이 전 포스팅들 중에서 Vuejs관련해서 작성한 것들이 몇몇 있었는데, 알고보니 정작 중요한 것을 올리지 않았습니다. Vuejs가 어떤 것인지, 그리고 어디에 사용하면 적절한지의 대한 설명이 부족했던 것 같습니다. 그래서 이번 포스팅에서는 Vuejs의 관하여 주절주절 떠들어볼까합니다. 해당 글은 공식 메뉴얼에 설명되어 있는 것도 언급하겠지만 개인적인 의견도 포함되어 있을 수도 있기 때문에 “아, 이러한 의견도 있구나” 정도로 가볍게 읽어주시면 감사할 것 같습니다 : )Vue.js가 무엇일까요?공식홈페이지에서 내용을 가져와보면,Vue (/vju:/ 로 발음하며, view와 발음이 같습니다). 사용자 인터페이스를 만들기 위한 진보적인 프레임워크라고 합니다. 다른 Front-end 프레임워크와는 달리 강제적인..

프로그래밍/웹관련 2017. 5. 6. 17:59

서론javascript가 어떤 것인지 잘 모르시는 분들을 위해 간단하게 설명부터 먼저 진행하도록 하겠습니다.자바스크립트(JavaScript)는 객체 기반의 스크립트 프로그래밍 언어이다. 이 언어는 웹브라우저 내에서 주로 사용하며, 다른 응용 프로그램의 내장 객체에도 접근할 수 있는 기능을 가지고 있다. 또한 Node.js와 같은 런타임 환경과 같이 서버 사이드 네트워크 프로그래밍에도 사용되고 있다. 자바스크립트는 본래 넷스케이프 커뮤니케이션즈 코퍼레이션의 브렌던 에이크(Brendan Eich)가 처음에는 모카(Mocha)라는 이름으로, 나중에는 라이브스크립트(LiveScript)라는 이름으로 개발하였으며, 최종적으로 자바스크립트가 되었다. 자바스크립트가 썬 마이크로시스템즈의 자바와 구문(syntax)이 ..

프로그래밍/팁관련 2017. 4. 7. 22:30

국내에서도 Vue.js를 사용하는 비율이 점점 높아져가는 것 같습니다. Angularjs, Reactjs보다 진입장벽이 낮고, HTML/CSS와 기본 JavaScript만 다룰줄 알더라도 쉽게 사용할 수 있다는 장점이 있습니다. 또한 vue-cli라는 툴을 이용하여 기본적인 vue 골격을 만들어 웹팩(webpack)까지 통합세트로 운영할 수 있다보니, 고민없이 사용해야한다라는 생각이 점점 강해지는 것 같습니다. 분명 처음에는 가볍게 시작을 하면서, 분명 사용하기도 편합니다. 그런데 이 전에 사용했었던 jQuery, Bootstrap. 그리고 그 외의 많은 라이브러리들을 어떻게 추가해야하는지 헷갈릴 수도 있을 것 같습니다. 이는 웹팩이 같이 포함되어 있으면서 외부 라이브러리들을 어떻게 추가하는게 맞는 것인..

프로그래밍/웹관련 2017. 3. 2. 14:23

Vue.$nextTick요즘 갑작스럽게 인기가 많아진 Front-end Framekwork인 Vue.js의 대해서 이야기해볼까합니다. Vue.js가 무엇인지 말하기에는 공식문서 한글화도 잘 되어있고, 국내 Vue.js커뮤니티에서도 현재 활발하게 여러가지 주제를 가지고 이야기를 하고 있기에 따로 설명하지는 않겠습니다. Vue.js를 어느정도 사용하고 있다가 데이터와 UI를 건드리는 상황에서 간헐적으로 DOM을 못찾는 상황을 겪어보셨을지 모르겠습니다. 겪지 않으셨더라도 언제가는 겪게 될 일이죠. (저는 이미 이 일을 겪게 되었습니다.)네트워크 요청을 하던가, 어떤 데이터를 vue._data에 삽입하자마자 삽입 후에 갱신될 UI의 대해서 DOM을 탐색하여 처리할려고 하면 해당 DOM을 못찾아서 콘솔화면에 빨간..

프로그래밍/웹관련 2017. 1. 19. 21:33