개발 기록 남기기✍️

[패스트캠퍼스] 프론트엔드 부트캠프 12주차 후기✨(과제 끝!!!) 본문

개발 일기장

[패스트캠퍼스] 프론트엔드 부트캠프 12주차 후기✨(과제 끝!!!)

너해동물원 2023. 3. 5. 19:29

여러분 모두~~~~~!!!!!!

안녕하세요! 밝고 기운찬 3월!!!

드디어 팀 프로젝트 끝났다!!!!!!!!!!!!!! 얄루!!!!!!!!!!!!!!!!!!!

 

⬇️완성된 사이트 보러가기⬇️

https://ottogi-premium.netlify.app/

 

오뚜기몰 프리미엄

 

ottogi-premium.netlify.app

⬇️깃허브 놀러가기⬇️

https://github.com/KDT4-team6/Paldo

 

GitHub - KDT4-team6/Paldo

Contribute to KDT4-team6/Paldo development by creating an account on GitHub.

github.com

 

 

 

 

오뚜기 프리미엄 사이트 소개 사진

 

이번 팀 프로젝트를 하면서 느낀 점은...

머리 아프고 오래 걸리더라도 초기에 프로젝트 구조와 컨벤션을 다 정해놓자

였다.

 

진짜 하는 내내 저 생각 오조오억번 들음.

나중에 리팩토링할 때 그 때 폴더 구조 다시 잡죠~~~ 하다가 막바지 작업 때 다들 땅치고 후회함.

 

다들 개발 팀 프로젝트가 처음인지라.. 폴더 구조를 어떻게 잡아야 할지도 몰랐고 어떻게 프로젝트를 설계, 진행하는지도 몰랐다.

게다가 바닐라 자바스크립트로 프로젝트를 진행하기 떄문에 더더욱 몰랐다!

(리액트 같은 경우에는 리액트 프로젝트를 생성하면 자동으로 폴더 구조가 큼지막하게 나뉜다.)

 

 

조별과제 시작 : 꺄르르 호호호 하하하

다들 처음엔 호기롭게 이런 기능도 넣을까요? 오 좋아요 저런 기능도 넣죠 ^__^

하하하 호호호 꺄르르 아주 화기애애했다. 물론 우리 팀은 끝까지 화기애애한 분위기이긴 했다.

 

근데 우리가 놓친 부분이 있었다..

우리는 나중에 컴포넌트화하기 쉽도록 일단 멀티페이지로 작업을 한 뒤, Navigo라는 라이브러리를 사용해서 

SPA를 구현을 했다.

멀티페이지로 작업을 한 상태이기 때문에 각 페이지마다 클래스가 겹치는 것을 인지하지 못했고.. 나중에 모든 SCSS 파일들을 다 합치고 나니 속성이 중첩되고 중첩되어 레이아웃이 이상하게 변해버렸다.

그 뿐만 아니라, JS 폴더 구조를 명확하게 하지 않았던 터라, 나중에 정리하면서 마주하게 된 우리 프로젝트의 폴더 구조는.... 난장판이였다.

그래서 폴더 구조를 다시 정리하는데... 폴더명이 수정되거나 경로가 바뀌면 import 경로도 자동으로 바뀌었으면 좋겠는데... 그게 안되네..?

그래서 배포 전날 새벽까지 수정... 또 수정을 했다.

 

프로젝트를 어떻게 진행해야할 지 모르겠으면 꼬옥 다른 프로젝트 깃허브를 많이 뒤져보자...! (일찍 볼걸)

 

조별과제 후반부 : 후후후... 이게 또 왜 안되지 후후후후후

저번에도 말했듯이 우리 팀 분위기는 너무 좋았다!! 그래서 싸우거나 마음 상하는 일이 없었다.

다만 자바스크립트한테 맘 상함 ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ

 

다들 응애 나 애기인 상태에서 온몸으로 프로젝트를 마주해보니까 처음에는 문제 하나하나에는 멘붕하다가 마지막에는 다들 맷집이 쎄졌다.

그리고 하나의 사이트를 구현하기 위해선 각 페이지가 다른 페이지와 유기적으로 연결되어있기 떄문에 다른 사람들의 코드를 볼 수밖에 없었는데, 팀원들의 코드를 보면서 인사이트가 넓어지게 되었고 또 혼자였으면 보지 못했을 문제들도 마주하면서 문제 해결 능력이 더 향상된 것 같다.

(정확히 말하면 숨은 에러 찾기 능력이 더 향상된 듯..) 

 

또, 과정 초반부에 들었던 git으로 협업하는 방법을 드디어 제대로 써본 것 같다.

이전에는 으악 충돌 무서워!!!! 였다면 지금은 콧물 한번 쓰윽 닦고 충돌 해결하러 간다.

시간이 더 주어졌다면 코드를 더 리팩토링해보고 싶은데..

리액트 강의가 이미 시작해버렸기 떄문에.. 아쉽게도 여기서 프로젝트를 종료하기로 했다.

나중에 리액트를 어느정도 배우고 나면 지금 만들었던 사이트를 리액트 프로젝트로 리팩토링할 수 있지 않을까?? ㅎㅎㅎㅎ

(보고 계시죠 전국팔도 여러분?)

 

과제에 대한 얘기는 여기서 끝!

 


 

2월 27일부터 리액트 강의가 시작되었다!

바닐라 자바스크립트와 고생고생하다가 마주하게 된 리액트...

 

 

전에 혼자서 리액트 공부할 때는 몰랐는데, 훨씬 더 적은 코드로 동일한 기능 그리고 성능이 더 높은 코드를 작성할 수 있다는 것이 너무 매력적이였다.

그리고 계속 자바스크립트 심화 공부하다가 리액트 기초 배우니까.. 너무.. 재밌어...!!!

부디 이 버프가 리액트 과정 끝까지 유지됐으면 좋겠다.

 

지금 같이 그룹스터디하는 ㅇㅇ님과는 매일 리액트 공식문서 읽기를 하고 있고, 팀 프로젝트 팀원들과도 레포지토리를 만들어서 같이 리액트 공부하기로 했다.

이렇게 좋은 사람들과 함께 으쌰으쌰하면서 공부하면 분명 좋은 시너지가 일어나고, 다들 좋은 개발자가 될거라 믿는다!

이제 나만 잘하면 됨... 나만....

 

프로젝트 끝내고 나서 매일 침대랑 연애하고 있었는데 이제는 다시 정신차리고...! 침대랑 절교해야겠다. 넌 너무 위험해

 

이번 달의 목표는 리액트를 공부하면서 잘 짜여진 사이트를 클론코딩하는 것!

(넷플릭스라던가... 넷플릭스라던가...)

 

4월달에 팀 프로젝트가 다시 시작인데, 그 전까지 내 자신을 잘 다듬어놔야겠다.

 

 

3월도 한번 가보자고!!!!

패캠 4기 렛츠고!!!!!!


사담) 우리 팀 프로젝트 멤버들 넘나 소듕해... 다음에도 같이 팀플하고 싶다 ㅎㅅㅎ