[좌충우돌 산악회 홈페이지 만들기 #1] 필요한 것들을 나열해보자

1. 잡담

음... 막상 산악회 홈페이지를 만들겠다고 다짐은 했는데 시작하려니 생각해볼 것들이 너무 많다.

 

첫 번째로, 나는 프론트쪽 분야에 문외한이다. 할 수 있는 건 자바스크립트를 곁들인 HTML 정도..? 그렇다고 백엔드를 어느 정도 할 수 있는 수준도 아니다. ㅎㅎ

 

두 번째로, 백엔드 단 API를 모두 만들고 나서 프론트 작업을 시작해야할 지, 프론트부터 모두 만들고 나서 백엔드를 만들어야할 지, 아니면 두 개 모두 병행해야할 지 고민이다. 뭐 이건 내 나름대로 진행하는거니 백엔드 단을 어느 정도 개발하고 프론트 작업을 진행해봐야할 것 같다.

 

세 번째는 DB 테이블도 짜고, 필요한 API 명세도 뽑고, 화면 설계도 하고, 뭐 유저 Authentication이라던가, Authorization 등등의 적용 방법, 무엇보다 백엔드와 프론트에서 어떤 프레임워크를 사용할 지를 먼저 정해야하는데, 아직 정해진게 아무 것도 없다.

 

사실 어디가서 이런 말하면 두들겨 맞겠지만, 재미로 만드는 만큼 만들어야 할 사항에 대해서 간단히 글로 메모만 하고, ERD나 API 명세, 화면 설계와 같은 것들은 패스를 해야겠다.

 

나중에 분명 후회하고 모든 프로젝트를 갈아 엎어야 할 수도 있지만, 그건 그때의 내가 값진 경험의 비용으로서 후불로 지불한다고 생각하고 진행해봐야겠다. 모든 설계도는 내 머리 속에 있다 ㅎㅎ..

 

일단 내가 생각한 기술 스택은 다음과 같다.

 

DB - RDB <- GraphQL도 써보고 싶긴 한데, 나중에 해보자...

Front-end - Next.js

Back-end - Nest.js

Dev-ops - 미정 <- 나중에 차차 생각해보자

 

원래 백엔드 같은 경우는 회사에서는 Spring Boot로 개발을 했었는데, Spring이랑 비슷하면서 Node.js의 Express 혹은 Fastifiy를 활용할 수 있는 Nest.js에 너무 관심이 끌렸다.

 

무엇보다 Typescript를 활용하며, 개발자에게 있어서 자유도가 상당히 높던 Express와는 달리 정형화된 개발 프로세스를 차용했다는 점이 너무 궁금하고 써보고 싶었다(사실 Spring과 비슷하다는 점이....).

 

프론트로 Next.js를 채택한 이유는 사실 없다... 사실 해본 적도 그렇게 없고, CSR인 React와는 달리 SSR도 된다고 하고.. SEO도 된다고 하고.. 뭐 재미 삼아서 시도해보는 것이니 경험해보아서 나쁠건 없다고 생각한다.

 

계속 개발하면서 공식 도큐먼트를 읽으며 이해한 내용을 차근차근 작성하고, 실패해보고, 그렇게 지식을 체득하다보면 뭔가 향후 나의 커리어에 대한 방향성이라던가, 내가 몰랐던 다양한 것들에 대해 식견을 넓힐 수 있는 좋은 계기가 되지 않을까 생각한다.

 

나는 상기한 Next.js나 Nest.js를 제대로 시도해본 적은 없다. 말 그대로 맨땅에 헤딩이다. 뭐 그래서 좌충우돌이라고 하는게 더 맞겠다.

 

2. 필요한 기능

이 부분은 지난 번에 남한산성 갔다가 여자친구와 동동주 한 잔을 하고 내려와서 카페에서 이야기 한 내용이다.

 

1. 회원가입(일반 회원가입, 카카오 및 네이버 OAuth2 회원가입 - 가능하다면 사비로 본인인증 모듈도 적용...) 및 로그인

2. Today 방문자(User Access History)

3. 게시판(공지, 일정-달력, 자유, 사진, 등산 후기, 중고 장터, 등산 구인)

4. 회비 입금 안내 (ㅋㅋㅋ)

5. Change Log (관리자만 작성 가능)

6. 마이 페이지 (본인 등급, 작성 게시글 및 댓글, 완주한 산)

7. 명산 위치(블랙야크 등반할 산 버킷 리스트라고 보면 됨)

 

대충 이 정도인데, 언뜻봐서는 그냥 네이버 카페를 베이스로 해서 기능 몇 개 더 추가한 사이트 같다. 

지금까지 말한 건 유저 관점에서의 페이지고, 관리자 페이지도 따로 만들어야 할 듯 싶다.

 

아마 관리자 페이지는

1. 회원 정보 관리(등급, 작성 게시글 및 댓글, 회원 추가 및 삭제 등)

2. 가입 / 탈퇴 / 총 회원 수

3. Change Log 작성 기능

 

이 정도로 가볍게 구현하면 되지 않을까 싶다.

당연히 만들다보면 지금 글로 적지 않은 기능들이 즉석으로 구현될 수도 있고 아무튼 그렇다.

 

마치 내가 개발자이면서, 고객같은 느낌으로 극단적인 애자일 프로세스를 적용한 개발이라고 하는게 좀 더 맞을 수도 있겠다.

 

3. 개발 순서

음... 백엔드부터 구현을 하고 모두 완료되면 프론트 개발하며 차근차근 API를 연동하고, 연동하다가 이상한 것 있으면 백엔드 수정하고.. 하는 방식으로 구현해봐야겠다.

 

일단 앞으로 백엔드에서 구현할 사항은 간단히 적으면 다음과 같겠다.

 

- ORM 연동 및 예제 Controller, Service 개발 및 테스트

- Swagger Open API 적용

- Request 및 Response Interceptor 개발

- Passport Local 및 JWT 인증 적용 (Authentication)

- 인가 로직 구현 (Authorization - 유저 및 관리자 페이지)

- API 구현

 

음.. 물론 이것 말고도 다른 것들이 있겠지만, 무지성 개발 하다보면 알게될 것 같다.

 

프론트는 내가 잘 모르니 때가 되면 그때 다루고, DevOps 같은 경우도 하면서 무지성 헤딩 해봐야겠다.