아고라스테이츠 서버연결/CRUD 구현

2023. 2. 15. 21:32구현 결과물

드디어 .. 4일간의 대장정이 끝이났다.

무슨 CRUD하는데에 4일이 걸리냐고 비웃을 수 있지만, 1달전에 바닐라자바스크립트로 구현 된 아고라스테이츠의 코드도 이해못하고 남의 걸 보고 타이핑 하기 바빴던 내가, 리액트로 리팩토링을했고, 서버를 만들어서 서버에 연결했으며,CRUD구현에 결국 성공했다.

프론트엔드 개발자로써 최소한의 백엔드 소양이라고 생각하기에 유난히 내손으로 끝내고 싶었던 것 같다.


구현화면

자꾸 뭔가를 꾸미려고 하는 나에게 불호령을 내렸다.  내가쓰고 내가 울었다.
기본적인 CRUD를 구현완료했다. 개인적으로 수정이 어려웠다.
서버와의 요청/응답도 성공적으로 잘 되고 있는걸 볼 수 있다.

서버 터미널에 400 or 500응답이 오는 건 참을 수 있었다.

하지만 .. 프리플라이트 요청만 오는건 참기 힘들었다.후우후우

 

개인적으로 서버의 트래픽도 고려한 나름 뿌듯한 모먼트


느낀 점

사실 뭐 대단한거나 기발한 프로젝트를 한 것도 아니고 CRUD 하나 구현한걸로 왜 이렇게 호들갑 떠나 싶기도 하겠지만...

나에겐 굉장히 큰 의미가 있는 4일이었다.

구현이 되면 되는대로, 안되면 안되는대로 다음 커리큘럼을 일단 따라가는게 맞는건지.. 남들 이시간에 알고리즘 공부하던데 나혼자 삽을 푸고 있는건 아닐까 ? 나는 프론트엔드를 할건데 왜 서버를 다뤄야해? 왜 서버도 만져야해? 라며 끊임없이 의심하고 불안했던 시간들이 눈녹듯 사라졌다.

그리고 CRUD를 끝내고 나는 고민에서 나오는 호기심과 그걸 내손으로 해결했을 때 느껴지는 쾌감을 알게된 계기였다.

퍼블리셔로 종사하다가 부트캠프에 오게 된 동기분이 계신데 , 그 분과 둘이서 서로의 문제점을 보완해주며 결국 구현에 성공했다!!  내친김에 같이 간단한 미니프로젝트를 기획했다. 하루만에 뚝딱!! 

아마 주말에 시간을 내서 만들어 볼까 한다.

프로젝트와는 별개로 로그인 기능까지 한번 구현해볼까 한다.

무엇보다 바닐라자바스크립트  => 리액트로 리팩토링하면서 붕 떠있던 state & props의 개념을 확실히 잡고 간 느낌이라 굉장히 뿌듯하다. 

빨리 첫 미니프로젝트를 시작하고싶다.


배운 점

  • 리덕스를 배우기 전까진 상태관리가 꽤나 번거롭다. 컴포넌트를 몇개나 거쳐서 props를 내렸는지 모르겠다.
  • 코드가 길어질수록 축약 가능한건 축약하고, 주석등으로 가독성을 높이는게 좋다.
  • 함수명, state명 ,변수명 등은 보다 직관적이고 의도를 알 수 있게 짓는게 중요하다고 느꼈다.
  • Delete요청은 body에 실어 보내는 것 보다, params에 넣어 보는게 시맨틱하다?
  • 400번대 에러는 내잘못이고, 요청이 안가는건 내잘못이다.
  • 이미 서버에서 데이터를 받은경우, 응답으로 또 모든데이터를 받을 필요는 없다. 필요한 데이터만 필터해서 보내주는게 바람직하다.