프로젝트

dong.log - 프론트엔드 개발, 디자인

개발하며 배운 것을 기록하는 블로그. 개인 프로젝트입니다.

(2022.12 ~ 2023.02)

Link

Github https://github.com/DoHi0512/DoHi0512.github.io

Service https://dohi0512.github.io/

Skills

Gatsby Tailwind GraphQL Github Actions Google Analytics

검색 엔진 최적화

• 페이지 색인 생성을 위한 sitemap.xml 생성
  • gatsby-plugin-sitemap를 이용해 sitemap.xml 생성 자동화.
  • Google Search Console에 sitemap을 제출해 페이지 색인 생성.
• Lighthouse SEO 점수 향상
  • react-helmet 를 이용해 페이지별 meta tag 적용.
  • Gatsby SSR과 meta tag 적용 결과 SEO 점수 82 → 100 향상.

성능 최적화

• 페이지 로딩 속도 향상
  • 기존 img태그에서 GatsbyImage 태그로 변경.
  • 이미지 로딩 속도 기존 4ms ~ 9ms 에서 2ms ~ 5ms로 약 100% 향상.

CI/CD

• 빌드 및 배포 자동화
  • Github Actions를 이용해 빌드부터 배포까지의 과정 자동화.
• Github Issue를 활용해 댓글 시스템 구현
  • Utterances를 사용해 댓글 Issue 생성.
  • Github Actions를 이용해 Issue close 자동화.

**Inkspire - 프론트엔드 개발, 디자인, 총괄**

(2024.04 ~ 2024.10)

프로젝트 소개

Inkspire은 온라인 독후감 서비스입니다.

누구나 자신이 읽은 책의 독후감을 쓰면서 생각을 다시 한번 정리하고, 언제든 자신이 썼던 독후감을 보면서 내용을 떠올릴 수 있으면 좋겠다는 생각에 프로젝트를 만들었습니다.

SEO 최적화에 신경을 쓴 프로젝트입니다. Next.js의 SSR을 활용하여 검색 엔진에 잘 노출되게 하였고, next-sitemap과 robots 설정으로 크롤링 설정을 하여 SEO최적화를 했습니다.