어떤 기술을 사용하여 이 사이트를 개발 하였을까?

Seokhyun Jang1/31/2022, 4:43:41 PM

사용한 언어

ES6, Typescript
아쉽게도 이 프로젝트에서 비즈니스 로직을 개발할 정도의 내용은 없어서 Typescript를 적극적으로 활용 하지는 못하였습니다.

사용된 기술스택

Nuxtjs, Nuxt-content, Vuetify, PWA
블로그 기능을 함께하고 있는 이 포트폴리오 웹 사이트는 놀랍게도 백엔드없이 작동합니다.dd MD문서를 파일단위로 읽어 게시글을 구성하고 게시판과 블로그의 역활을 합니다.
현재 이 글 또한 MD문서로 작성되어 있습니다.

디자인과 성능

Vuetify 디자인 웹 프레임워크 위로 글래스모피즘을 적용하였습니다.
또한 Lazy 기법으로 화면에 당장 출력이 되어야하는 이미지나 스크립트만 로드하며, Lighthouse에서 메인화면 기준 다음과 같은 점수를 받았습니다.
앞으로도 성능향상에 도움이 되는 방법들을 연구하고 적용하려 합니다.

프로젝트 배포

Github Action CICD로 Github page에 자동 테스트 배포되고 있습니다.

이 프로젝트 레포지토리로 바로가기

https://github.com/devxian96/PortfolioNuxt

다른글도 읽기