게스트북이 뭔가요❓

🔗 게스트북은 메시지를 남길 수 있는 방명록 웹 서비스다.

개발 계기

2021년도에 졸업 작품을 만들면서 서버를 맡고, 백엔드를 보조했었다.
그때 해소하지 못한 갈증을 해소하기 위해 토이 프로젝트를 하나 해 봐야겠다는 생각을 했고
그래서 '게스트북'을 개발하게 되었다.



1. 프론트엔드 기술을 사용해 무언가를 만들어 본 적이 없음
'포트폴리오 웹 사이트'를 제작하면서 HTML, CSS를 간단하게 사용해 본 경험만 있었다.
동적인 웹 페이지를 만들어 보고 싶다는 생각이 들면서 JavaScript에 대한 궁금증이 커졌다.


2. Springboot에 대해 "다들 이렇게 하라고 하니까 따라 해야지"라는 마인드로 사용했던 아쉬움
백앤드를 보조하는 역할로 프로젝트 중간에 개발에 참여했었기 때문에 Spring 기초부터 공부하며 개발할 수 없었다.

사용한 기술과 이유

• Front-end
  • HTML/CSS
  • Vanila JS
  • Axios (비동기 통신 라이브러리)
    • 자바스크립트 기반의 통신 라이브러리라 환경이 잘 맞을 거라 생각
    • json 형식으로 작성

• Back-end
  • Springboot 2.7.1
  • JPA

• Server
  • AWS EC2 (Ubuntu 20.04)
  • AWS RDS (MariaDB 10.5)
    • 1년간 1기가 무료
    • 몇 분 만에 서버 구축 가능
  • Docker
    • tomcat, jar 가 잘 실행되고 있는지 한눈에 볼 수 있음
    • 배포 설정값(ex. 포트번호)이 변경되어도 쉽게 수정 가능

기능

외부 사용자가 관리자 계정을 만들어 자신의 게스트북을 운영할 수 있는 서비스는 아니다... (나만 쓸 수 있음)
일반 사용자들이 접속해 카드를 작성하고, 작성한 카드를 조회하는 등 CRUD에 초점을 맞추었다.

공통

• 카드 현황 (전체, 확인 완료, 확인 전)

사용자

• 로그인, 회원가입, ID 찾기, PW 찾기
  • LocalStorage 에 로그인한 사용자의 아이디 저장
• 모든 카드 조회
• 내가 쓴 카드 조회
• 아이디 및 내용으로 카드 검색
  • Paging 기능을 통해 필요한 만큼의 데이터만 조회
• 카드 작성
• 카드 수정 (자신이 쓴 것만)
• 카드 삭제 (자신이 쓴 것만)
• 댓글 작성
• 댓글 삭제 (자신이 쓴 것만)

관리자

• 카드 상태 변경 (사이트 상단 오른쪽에 있음)

UI

서버를 계속 열어두려고 했으나 사용량 초과로인해 서버를 닫은 상태이고,
깃허브 리포지토리 리드미 파일에 각 기능 별로 녹화해 gif로 작성해뒀다.
🔗 Github - 게스트북 리포지토리 바로가기

이슈와 해결

개발 도중에 여러 오류를 겪고 열심히 삽질하며 개발했던게 자연스레 공부가 되었다.
그중에서 의미 있는 삽질들을 정리해 포스팅했다.

• Cors Policy로 인한 서버의 요청 거부

• [JPA] DELETE Query 에러 : Statement.executeQuery()

• [JPA] save(), saveAll(), saveAndFlush() 차이

• [Axios] Response.data 출력하기

• [Axios] HTTP GET 요청 (feat. data를 담을 수 없다)

• [Docker] Docker Hub push 실패 : requested access to the resource is denied

아쉬운 점

1. 반응형 웹이 아님
JS 감 잡기에 집중하느라 반응형은 하지 못했다.

2. 구조적이지 못한 JavaScript
기본 문법 강의를 보고 일단 내가 직접 사용해 봐야 감을 잡을 거 같았고,
"내가 계획했던 것들을 구현해야 해!"에 집착한 탓에 js 파일 1개에 모두 때려 넣었다...😅

3. 1인 개발로 인한 좁은 배움의 폭
1인 개발이다 보니 함께 의논할 사람이 없어 코드 리뷰를 하지 못했다.
내가 생각한 로직이 다른 방식으로도 가능하다는 사실을 모르고 지나가야 한다는 점이 참 아쉬웠다.

보통 어떤 문제에 대한 해결 방안을 찾으면 다른 방식의 방안을 또 떠올리기가 쉽지 않다.
팀 프로젝트를 하면 팀원들과 의논하며 더 효율적인 코드를 만들 수 있었을 텐데 혼자 하니까 그게 안돼서 가장 아쉬웠다.

완성❗ 배포 완료🎉

개발하면서 생겼던 궁금증들, 모르는 것들을 모두 적어놓고 하나씩 찾아보고 이해하며 개발했다. "다들 이렇게 하라니까 따라 해야지"라는 생각을 하지 않으려 노력했다.

유독 검색을 많이 해봤던 것은 Springboot 다.
첫 Springboot를 야생형으로 배워 모호했던 개념들을 이번 프로젝트를 통해 제대로 정리한 것 같다.
완벽하게 습득한 것은 아니지만 내 코드를 봤을 때 이건 왜 이렇게 썼고, 어떤 것을 위한 것이고, 어떻게 작동하는 것인지는 이해했다.

개발자들에게 한 번 씩 온다는 번아웃에 대해서도 대비를 해야겠다는 생각을 했다.
개발자라는 직업이 계속 변화하는 시대에 따라가야하는 직업이고 그러려면 계속 배워야하는데 배움에도 체력이 소모된다. 목적에 맞게 체력을 잘 분배해 한 번에 무너지지 않게 조심해야겠다.

나보다 뛰어난 개발자는 엄청 많다. 실력은 계단식으로 오른다라는 말이 있지 않나.
"나는 왜 저들처럼 하지 못할까"라며 자책하지 않고 내 할 일 묵묵히 하다보면 어느새 성장해 있을 거라고 믿는다.