👟 프로젝트 HEUREAM 👟 : 한정판 거래 플랫폼 사이트 KREAM을 직접 만들어본 프로젝트 

프로젝트 기간 : 2021.03.29 ~ 2021 04.09
프로젝트 인원 : 프론트엔드 3명, 백엔드 2명

맡은 부분 : 상품 상세페이지(프론트엔드)

 

이번 프로젝트에서는 지난번과 달리 함수형 컴포넌트, hook, styled-component 등 새로운 스택을 배우며 진행되었다. 

지난번 프로젝트에서 너무 기능 구현에 집착하여 코드의 질에 대해 아쉬움이 있었기에 이번에는 조급하게 하지 않고

좀 더 react에 익숙해지며 새로 배운 스택을 자연스럽게 적용하려고 하였다. 

 

그러기 위해 프로젝트가 시작한 후에도 3일 정도는 혼자서 실습을 하고 공식문서를 읽고, 여러 자료를 찾아보며  

새롭게 배운 스택을 제대로 익히기 위한 시간으로 사용하였다.

(내가 구현하지 못한 기능보다 무서운 건 내가 사용하는 기술을 제대로 이해하지 못하고 사용하는 것이라고 생각하기 때문에...🤔)

 

일단 결과물! 👀

 

 

이번 프로젝트에서 나만의 챌린지(?)는 반복적인 코드를 최소화시키는 것이었다.

결과는 음... 50% 정도 성공인 것 같다.

컴포넌트 재사용은 처음 의도한대로 되었지만, 재사용함에 있어서 따라오는 로직들을 클린하게 작성하지 못한것 같다.

 

일단 컴포넌트 재사용 측면에서는 1차 프로젝트를 통해 경험해보았기에

이번에는 컴포넌트 설계 측면에서 조금 나아졌다고 생각한다

 

화면의 모든 버튼, 메뉴탭, 모달 창, 표를 별도의 컴포넌트로 선언하여 재사용하였다.

 

 

component 구조

 

컴포넌트 재사용을 위해 여러 조건들이 생겨났는데 그중 내가 한 치명적인 실수에 대해 리뷰를 받게 되었다.


 

코드
리뷰내용

 

메뉴 탭에서 선택된 항목을 구별하기 위해 로직을 짜던 중 무의식적으로 DOM트리에 직접적으로 접근했다..! 🙉

(심지어 저 케이스는 useRef가 필요하지도 않았다....ㅎ)

 

그래서 로직을 수정하고 보니 오히려 코드의 라인수는 줄어들었다. ㅎㅎ

 

 

 


이번 케이스를 통해 코드 리뷰가 나에게 얼마나 큰 도움이 되는지 몸소 깨닫게 되었다. 👍


2021.03.26 - [개발/Wecode] - TIL #16 (feat. 1차 프로젝트 KLUSH 회고)

 

TIL #16 1차 프로젝트 회고(part1. KLUSH )

🧼 프로젝트 KLUSH 🧼 : 영국의 화장품 회사 LUSH KOREA를 직접 만들어본 프로젝트 프로젝트 기간 : 2021.03.15 ~ 2021 03.26 프로젝트 인원 : 프론트엔드 3명, 백엔드 3명 맡은 부분 : 상품 리스트 페이지,

jwookj.tistory.com

 

📣 1차 프로젝트에 비해 성장한 부분!

1차 프로젝트 회고에서 내가 느낀 프로젝트에서의 아쉬운 점을 세 가지 꼽았었다.

  1. 소통
  2. 개인 실력
  3. 블로그

흠....

일단 3번은 못 지켰다. 

남자답게 못 지켰다. ㅎㅎㅎ.....🔫

 

새로운 스택에 좀 더 적응하고 제대로 쓰고 싶다는 생각이 들어서일까 뭔가 계속 미루게 되었다. 

그러고 보니 1주일이 지나있었다....

 

다시 한번 다짐하고 자극이 되는 계기가 되었다. 

블로그 작성에 대해 좀 더 진지하게 임해야겠다고 생각이 됐다.🤔

 

1번은 굉장히 많이 노력했다. 

굉장히 많이 노력했고 노력한 결과는 좋다고 생각한다!! 🤩

물론 다른 팀원들도 나와 비슷한 생각이었기 때문에 같이 열심히 노력했기에 좋은 결과로 이어졌다고 생각한다! 😆

 

 

트렐로

 

서로가 공유할 내용을 트렐로를 통해 실시간으로 공유하였고, 서로 소통할 것이 생기면 주저하지 않고 소통을 시도했다. 

 

2번의 아쉬운 점 또한 많이 개선되었다고 생각한다. 

나는 이번에는 기능의 구현보다는 코드의 질에 대해 먼저 생각했고 고민했다. 

그 결과는 1차 프로젝트보다는 좀 더 맥락이 있고 체계적인 코드를 짠 것 같다고 생각한다. 

물론 아직 멀었지만 내가 성장하고 있다는 것은 확실하다고 생각한다! 😄


 

📣  2차 프로젝트 아쉬운 점

  1. 개인 실력
  2. 경험

2차 프로젝트에서는 외부적인 요인보다는 현재 나의 기량에 대해 아쉬운 점을 느낀 프로젝트였던 것 같다.

 

🙉 개인 실력에 대해서는 프로젝트를 할 때마다 느끼는 것 같다.

 

하지만 이번 프로젝트에서는 유독, 기본적인 cs에 대한 지식이 있었다면 내가 개발을 하는데에 있어서 무언가를 결정해야 할 때,

'도움을 줄 수 있는 잣대가 되지 않았을까 '라는 생각이 많이 들었다.

 

개발자는 서비스를 위한 소프트웨어를 개발할 때, 항상 극단적인 상황을 고려해야 한다고 생각한다. (단시간에 요청이 갑자기 몰리는 경우 등..) 

이러한 부분에서 고민을 할 때, 문제점을 예상하더라도 해결책을 결정하는 부분에서 답을 잘 찾지 못한 것 같다.

 

예를 들면 이번 프로젝트에서 내가 맡은 상품 상세페이지에서 모달 창을 클릭할 경우,

클릭한 버튼에 따라 서로 다른 정보들을 보여주어야 하고 모달창 내에서도 서로 다른 기능을 수행할 수 있어야 했다.

 

이 경우 각 모달 창마다 버튼이 클릭될 때마다 백엔드 측으로 API요청을 보내는 것이 좋을지, 아니면 모든 정보를 처음에 받아와서

클릭이 될 경우 정리된 데이터를 보여주는 것이 좋을지 헷갈렸다. 

 

이번 프로젝트에서 우리는 처음 페이지가 로딩될 경우 모든 데이터를 전부 받아와서 클라이언트 측에서 정리된 정보를 보여주도록 설계하였다.

 

그리고 프로젝트가 끝난 후에 상세 데이터를 맡은 우리 팀 백엔드 분과 잠깐 이야기를 해보았는데,

우리 둘 다 만들어 놓고 보니 클라이언트 측에서 모든 데이터를 한 번에 정리하여 보여주는 것이 좀 비효율적인 것 같아서

다음에는 따로 API 요청을 보내도록 하는 것이 좋겠다고 생각이 모아졌다.

 

이러한 부분들 때문에 '나에게 좀 더 기본적인 cs지식이 갖추어져 있었다면 선택을 할 때 시행착오를 줄일 수 있지 않았을까 ' 하는 생각이 들게 되었다.

 

🙊 경험이 부족하다.

 

사실 너무 당연한 말이긴 하다. 

당연히 경험이 부족한 게 맞고, 이러한 프로젝트들을 통해 계속해서 쌓아나가야 한다고 생각한다. 

하지만 부족한 건 부족한 거고 아쉬운 건 아쉬운 거니까...😭

 

이 부분은 위에서 말한 예시에서도 어느 정도 일맥상통하는 부분이 있다. 

경험을 통해 선택에 대한 결과를 어느 정도 예측할 수 있다면 선택에 있어서 좀 더 수월할 것이고,

또한 잘못된 선택을 하더라도 무엇이 잘못되었는지 알기가 수월해질 것 같다는 생각이 들었다.  

 

이 부분은 사실 절대적인 시간과 노력이 필요하기 때문에 현재 내가 공부하는 방향보다는,

어떠한 마음가짐을 가지고 임할 것인지가 중요하다고 생각한다. 


두 번째 프로젝트를 진행하면서 많은 생각이 들었다. 

취업에 대한 걱정도 있고, 내가 과연 잘 공부하고 있는지에 대한 불안감과 아직 부족하다는 조급함도 있었다. 

 

하지만 이러한 생각의 끝은 결국 '고민할 시간에 공부해라'로 끝난다는 것을 알기 때문에 깊게 고민하지 않으려고 한다.

지금의 내 상황에서는 무엇을 어떻게 공부하든 잃을 것이 없고, 결국 그러한 고민들은 쓸데없는 핑계로 이어지기 때문에 

현재 나의 상태를 점검하는 차원으로만 가져가려고 한다. 

 

나에게 무엇이 부족한지 알게 된 것만 해도 얻어가는 것이 있다고 생각한다. 

부족한 것을 모르는 게 문제가 되지, 무엇이 부족한지 알면 그때부턴 채우면 되기 때문에 💪 

 

이번 프로젝트를 통해 내가 느낀 부족한 점을 개선해 보려고 한다. 

  • 기본이 되는 기술을 익혀야 좋은 개발자로 거듭날 수 있다.
  • 경험이 부족한 만큼 도전을 두려워하지 말자, 결국은 나에게도 득이 되고 나를 뽑는 회사에도 득이 되는 일이다.

 다음 주부터 시작되는 기업 협업 과정에서도 내가 개선될 수 있는 아쉬운 점을 찾았으면 한다. 😁


 

+ Recent posts