(항해25일차) 220330 리액트 주특기 13일차

CRUD는 각각 create, road, update, delete 를 말하는 것으로 데이터 처리의 가장 기본적인 요소이다. 

이번 주차에 계속 사용한 리덕스는 CRUD에 사용되는 데이터(state) 관리를 위한 라이브러리였다.

결국 state를 잘 다룰 수 있어야 한다는 사실을 또 한번 느낄 수 있었다.  

하지만 리덕스 또한 상태관리를 위한 도구일 뿐 데이터를 저장하지는 않는다. 

데이터를 저장하는 곳은 서버인데 리덕스가 서버는 아니기 때문이다. 

 

그래서 오늘 그 서버의 역할을 대신할 수 있는 파이어베이스를 사용해

새롭게 생성되는 데이터를 저장하고 그 외의 나머지 기능 또한 구현할 수 있도록 했다. 

액션 함수가 리듀서에 CRUD 동작을 디스패치할 때 중간에 잠깐 파이어베이스를 거쳐간다.

사실 생각해보면 매우 간단한 과정이지만, 실제로 중간을 연결하는 코드를 짜는 것이 쉽지는 않았다. 

리덕스에 아직 익숙해지지 않은 상태에서 중간에 새로운 과정이 또 들어온다는 점이나

비동기 통신을 처음으로 접해본 것도 어려움을 느끼게 하는 원인이었다.

 

하지만 여러 어려움 중 가장 컸던 부분은 바로 내가 직접 작성한 나의 코드였다. 

컴포넌트를 옮길 때 마다 자꾸 바뀌는 변수이름의 형태나, 어쩔 때는 index를 어쩔 때는 id를 매개변수로 넘기고,

심지어 덕스구조의 파일 안에서 각각 액션과 관련된 함수도 뒤죽박죽으로 적었다. 

처음 작성할 때는 이런 번거로운 일이 생길지 전혀 몰랐다. 

결국 그 모든걸 고치고 새롭게 쓰면서 시간이 몇 배는 더 걸린 것 같다. 

소위 클린코딩이라고 하는 개념의 중요성을 실감할 수 있었다. 

그래서 다음 프로젝트는 이런 부분을 최대한 신경써서 작성해보려고 한다.(잘 될지는 모르겠지만)

 

파이어베이스까지 다뤄보면서 이번 주차에서 구현했던 CRUD기능이 돌아가는 과정이나

서버와 클라이언트가 어떤 식으로 연결되는지 어렴풋이 알 수 있었던 것은 큰 수확이다.

왜 서버에서 id와 데이터를 함께 받아와야 하는지, useEffect는 어느 시점에 사용해야 되며 왜 굳이 써야 하는지,

또 가장 오랫동안 시간을 들였던 useState로 데이터를 다루는 방법까지..

직접 코드를 작성해보면서 어렵지만 조금씩은 와닿는 부분들이 있었다.

이제 진짜 마지막, CSS작업만 거치면 배포할 수 있는 프로젝트가 만들어진다.