[항해99 - 8주차] 클론코딩

⚓ 항해99 - 8주차 회고록 (클론코딩)

 

비슷하구만그램

 

실전프로젝트 진행 전 마지막 프로젝트인 '클론코딩' 주차가 방금 막 끝났다.

이번 주도 밤샘의 연속으로 지금이 무슨 요일인지 종종 헷갈린다.

프로젝트 후반으로 갈수록 백엔드 분들과 대화할 일이 많아서

함께 대화하고 코드를 맞춰가는데 시간이 꽤 걸렸고,

모두가 시간을 많이 들인만큼 결과물도 처음 목표했던 대로 잘 나왔다.

 

이번 프로젝트를 진행하면서 생긴 프론트엔드의 주요 키워드는

[소셜로그인/ 모달/ FormData] 3개가 있다.

 

 

✅ 키워드 및 이슈

1. 소셜로그인

프로젝트 첫날 소셜로그인 얘기가 나왔을 땐 "소셜로그인은 도대체 어떻게 하는 거지....?"

정말 감이 1도 안 오고, 모두가 처음이라 많이 헤맸다.

소셜 로그인 프로세스를 전혀 몰랐던 것이다.

물론 땅을 깊게 파고 들어간 수많은 삽질 끝에 완성했고

진행하면서 느낀 점은 소셜로그인은 프론트엔드와 백엔드의 협업이 필요한 영역이다 라는 것이다.

방법은 아래의 글을 참고하면 된다.

https://iotrue.tistory.com/entry/%EB%A6%AC%EC%95%A1%ED%8A%B8-%EC%B9%B4%EC%B9%B4%EC%98%A4-%EB%A1%9C%EA%B7%B8%EC%9D%B8-%EB%A6%AC%EC%95%A1%ED%8A%B8-%EC%86%8C%EC%85%9C%EB%A1%9C%EA%B7%B8%EC%9D%B8

리액트 카카오 로그인 (프론트 소셜 로그인)

 

2. 모달

이번 프로젝트에서 모달은 2가지 방법으로 구현됐다.

나는 모달을 직접 구현했고, 우리 조의 K님은 react-modal 라이브러리를 사용해서 구현했다.

우리 프로젝트는 CRUD 기능을 페이지 이동이 아닌 메인페이지 modal 안에서 이루어지게끔 기획이 되었고,

프론트엔드에서는 그로인한 이슈가 있었는데 한마디로 '스코프의 제한'이 문제였다.

라이브러리 모달을 예로 들자면 모달 컴포넌트 밖 컴포넌트에 모달 open 버튼이 있어서

해당 상태를 나타내는 true, false 값을 리듀서를 통해 전역으로 빼서 사용했고,

게시글의 정보, 상세 정보, 댓글 등의 데이터 값을 해당 데이터들이 필요할 때마다 받아와야 했는데

CRUD의 모든 기능들이 main 한 페이지 내의 컴포넌트가 다른 modal에서 작동되기 때문에

필요한 데이터를 리듀서 전역 객체로 전달하거나 백엔드와 데이터 조율을 하는 등 신경 쓸 일이 많았다.

여기서 2차 3차 기능까지 추가한다면, 더 복잡해질 것 같다.

리액트 모달 구현 글도 포스팅 대기 중인 내용 중 하나다! 포스팅 하고 싶은 건 정말 많다

 

3. FormData(이미지 전송)

처음엔 이미지 전송도 텍스트처럼 json 형식으로 전달하면 되는 건가?

라고 생각했는데, 아니었다.

FormData 객체를 따로 만들어야 했고, 서버로 전달할 땐 content-type도 명시를 해줘야했다.

FormData 전송 방법은 자료는 만들어 두었으니 곧 포스팅 예정이다!

 

2023.02.08 추가

https://iotrue.tistory.com/entry/formdata-react-file-upload-%EB%A6%AC%EC%95%A1%ED%8A%B8-%EC%9D%B4%EB%AF%B8%EC%A7%80-%EC%97%85%EB%A1%9C%EB%93%9C

 

 

그렇게 완성한 프로젝트!

 

뿌듯한 비슷하구만그램

 

✅ 아쉬운 점

이번 프로젝트에서 아쉬운 점은

코드 모듈화와 클린코드 작성이다.

이 부분은 많이 공부하고 연습하면서 보완할 것이다! 꼭!

 

❗  정리하며

역시 개발의 세계는 넓고, 삽질 끝에 얻은 지식은 기억에 오래 남는다.

후..........🤣

이번 프로젝트도 모두 다 같이 하나라도 더 개발하기 위해 함께 밤을 새어가며 만들었다.

실전 프로젝트 전에 하나라도 더 경험하고자 하는 마음도 있었을 것이다.

그리고 이제 내일이면, 아니 몇 시간 뒤면 대망의 '실전 프로젝트'가 시작된다.

벌써 2023년 2월이고, 벌써 항해의 마지막 프로젝트라니.

시간 정~말 빠르다.

앞으로 6주동안 우리 조, 우리 기수 그리고 나 모두 지치지 않고 잘 끝내길 바란다!

항해를 시작하며 다짐한 나의 목표

포트폴리오/ 개발 지식/ 그리고 사람!

모두 다 얻을 수 있도록 매순간 열심히 해야겠다!

 

 

새해 다짐을 2월에 다시 또 해본다!