본문 바로가기

Vue5

Nuxt.js Toast Ui Editor 적용 Toast Ui Editor 적용하기 프로젝트를 진행하다 Nuxt.js에서 텍스트에디터를 사용할 일이 생겨서 이번엔 Nuxt.js에 Toast Ui Editor를 적용하는 방법에 대해 글을 써보려 합니다. 처음엔 Toast Ui Editor가 아닌 Quill Editor나 Summernote를 사용해서 진행해 볼까라고 생각하여 Quill Editor와 Summernote 모두 사용해보았습니다. 3가지 텍스트에디터 모두 사용해보았으나 Toast Ui Editor가 저는 가장 편리하고 기능도 괜찮다고 느꼈습니다. (nhn 만세!!) Quill Editor의 경우 심플하지만 모든 기능을 다 직접 구현해야 하는 번거러움이 있었고 Summernote는 자세히는 써보지 않았지만 저는 딱히 매력을 느끼지 못했습니다... 2021. 4. 26.
Nuxt.js 에서 Props 사용하기 Nuxt.js에서 Props 사용하기 props는 부모 컴포넌트에서 자식 컴포넌트로 데이터를 전달할 때 사용하는 사용자 지정 특성입니다. 자식 컴포넌트는 props 옵션을 사용하여 전달받을 것으로 기대되는 데이터를 명시적으로 선언해야합니다. Nuxt.js에서 Vue.js처럼 props를 사용할 시점이 있습니다. Nuxt.js에서 props 사용은 Vue.js와 크게 다른점이 없기 때문에 무리없이 사용이 가능합니다. Props 표기법 HTML 속성은 대소문자를 구별하지 않습니다. 모든 대문자를 소문자로 인식합니다. props를 사용할 때, HTML에서는kebab-case(article-data)를 사용하는 것을 권장합니다. Javascript에서는camelCase(articleData)를 사용하는 것을 권.. 2021. 4. 15.
Nuxt.js 에서 Vuex Store 사용하기 원래는 이 블로그 용도를 개발 공부하면서 기록할 겸, 알고 있는 내용도 잊지 않게 기록의 용도로 사용하자 라고 생각을 했었는데, 조회수가 1이 생기는 것을 보고 다른 사람도 볼 수 있는데 반말을 쓰는 건 조금 아닌 것 같아 앞으로는 이 부분은 지양하면서 기록을 해보려고 합니다. 최근에는 Dart와 Flutter 공부를 집중적으로 하는 중이라 Nuxt는 알고 있거나 알아야 할 내용들에 조금 소홀하고 있긴 하지만 Nuxt는 몸으로 겪어본 만큼 계속 포스팅을 해야겠다 라는 생각이 드네요. Nuxt에서 Vuex를 사용하는 방법에 대해 작성하려고 합니다. 아마 Vue를 경험하신 분이면 크게 어려운 점은 없을거라 생각이 듭니다. Store 이 store 디렉토리에는 Vuex Store 파일들을 포함합니다. 또한 T.. 2021. 4. 15.
Vue.js Computed, Methods, Watch 비교 Vue.js Computed, Methods, Watch 비교 Nuxt.js로 개발을 하거나 공부를 할 때, Vue의 개념은 필수적입니다. 저는 Nuxt로 개발을 시작할 당시 Vue.js로 딱히 프로젝트를 진행해보지도 않았고, 개념정도만 알고 있는 그 정도였습니다. (약간 몸으로 부딪히며 배우는 스타일..) 그래서 Nuxt로 처음 프로젝트를 진행할 때, 중간 중간 Vue.js 개념도 다시 살펴보고 같이 공부하면서 진행했습니다. 물론 처음 Nuxt.js 기술검토할 때 Vue.js와 어떤 점이 다른지, 어떤 점이 편해졌는지 등은 공부했습니다. (Nuxt.js는 자료가 너무 부족하여 굉장히 힘들었습니다...) 이번엔 Vue.js의 비슷하지만 다른 3가지 개념을 포스팅 하려고 합니다. 혹시나 알고 계신 것과 다.. 2021. 4. 9.
728x90
반응형