Nuxt.js+Vuetify+Contentful으로 블로그를 만들어 보았다.

개요



블로그 사이트를 만들어 보았습니다.

chobilog

Nuxt.js에서 프로젝트를 만듭니다.
UI 구성 요소는 Vuetify와 아주 조금 Vuesax를 사용했습니다. (병용할 수 있는지의 실험을 겸해. 결과 할 수 있었습니다.)
기사는 Contentful에 마크 다운 설명으로 작성.
API로 가져와 HTML 변환하여 표시하고 있습니다.
배포 대상은 Netlify입니다.

완제품



PC 톱 화면



PC 기사 화면



스마트폰 톱 화면



스마트폰 기사 화면



동기 최근 WordPress에 빠져서 자주 블로그를 쓰고 있습니다만, 너무나 자신을 위해서만 비망록적 일기로 되어 버렸습니다. 웃음 조금은 누군가의 도움이 되는 정보를 나 나름대로 열심히 발신하는 블로그를 따로 만들고 싶다고 생각했습니다. (미경험 엔지니어의 정보는 도움이 되지 않을까 그런 돌입은 하지 말아주세요...웃음) 학습 블로그 작성을 통해 많은 것을 배울 수 있었습니다. - Vue.js의 기초 (데이터 바인딩도 처음으로 구현 & 이해) - Nuxt.js 기초 (SSR) - Markdown 기법 (markdownit 구현) - Font Awesome 구현 - Vuetify 구현 (VUesax와 함께 사용) - 공식 문서(영문에서도 도망치지 않고)를 읽는 소중함 - 블로그 디자인(WordPress의 테마라든지 잘 되어 있다고 생각했습니다.) - ESLint 편리하지만 가끔 방해가 된다(초보자니까요...) - CSS 설계 (편하고 사용하기 쉬웠던 인라인 기술을 그만둔다) - Flexbox 사용 결론 계속해서 이 블로그 사이트는 기사 쓰면서, 추가·미정정해 나갈 예정입니다. 또, 만드는 과정은 나의 일기적 블로그에 쓰고 있으므로 생략했습니다. 걱정! 라고 하는 분은 꼭 들여다 봐 주세요.

다음은 Laravel+Vue.js에서 포트폴리오를 만들고 싶습니다.
Vue.js 처음에는 어려웠지만 지금 매우 즐거운 ◎

좋은 웹페이지 즐겨찾기