Next.js로 나만의 블로그 만들기

12월 6일자로 네이버 부스트캠프 9기를 수료하고 백수의 삶으로 돌아오게 되었다. 수료 후에도 여러 일정이 있어서 바쁘게 보내고 있지만 부캠 기간 중간에 만들고 싶어서 프로젝트 세팅 정도만 해둔 프로젝트를 꺼내서 다시 해보고 싶어졌다.

나만의 블로그..?

부캠에서도 개인 블로그를 만들어서 사용하시는 분을 여럿 보기도 했고 프론트엔드 개발자로서 하나 만들어보면 좋을 것 같다는 생각이 계속 들었다.

물론 블로그를 많이 운영하고 있긴 하지만 내가 만들어보는 것도 좋은 경험이 될 것 같아서 만들어보기로 했다.

토이프로젝트 느낌이지만 SEO도 챙겨보고 싶다고 생각했기에 Next.js 프레임워크를 선택했다.

image

처음에는 이렇게 글을 쓰려고 만든다기 보다는 내가 해왔던 프로젝트를 나열하면서 보여주는 포트폴리오를 만드려고 했다. 하지만 나는

디자인에는 재능이 없기 때문에 포트폴리오만 만들기에는 아쉬울 것 같았다.

그래서 블로그 기능을 추가해보기로 결정했다.

처음에는 mongodb를 사용해서 데이터를 저장하기로 계획했었다. 그런데 최근에 있었던 네트워킹 데이에서 DB를 사용하지 않고 md 파일 형식으로 저장하고 관리해도 좋다는 조언이 있었다.

고민을 좀 해봤는데 이미 DB 세팅을 다 해둔 상태여서 버리기 아까운 것도 있고... ㅎ 추후에 바꿔도 좋을 것 같다고 생각이 들어서 mongodb atlas를 사용해서 블로그를 만들어보기로 했다.

하지만 해당 조언 덕분에 markdown 문법으로 작성하기로 결정하는데 도움이 되었다. 이 글도 md 문법으로 작성 중이다..!!!

개인 블로그라서 커스터마이징의 가능성이 무궁무진한데 일단은 아래 기능들을 먼저 구현해보고 싶다.

SEO 지원 (next를 선택한 이유기도 하다. 페이지별 metadata를 어떻게 설정해야할지 공부해봐야 할 것 같다.)
포트폴리오 기능
- 이건 아예 UI도 계획을 안해놔서 좀 생각을 해봐야할 것 같지만 일단은 초기 기획이니까...
새글 구독 기능?
- Footer에 허울뿐인 구독 UI가 있다. 이걸 활용해서 새 글이 올라오면 메일로 알림을 보내주는 것을 상상해보고 있다. 근데 뭔가 비용이 들 것 같은 느낌이다..!
블로그 관련 CRUD 강화
내 소개 강화
검색 기능
- AI 검색 이런거 해볼까..? 로컬 AI 모델이 얼마나 가벼운지 모르겠지만 각이 보이면 해보고 싶다.
디자인 강화
CLS 최적화

image