1. 초기목표 :
내가 진짜 원하는 기능들을 모두 넣어서 실제로 활용할 수 있는 프로젝트 만들기, 실제로 사용자들이 이용할 수 있을정도의 완성도를 원했다..!
사용하고자 한 기능들 :
로그인 구현, storage 사용, API 호출
vercel로 배포해보기 (netlify로 지난 바닐라자바스크립트 배포를 해서 이번엔 vercel로 진행해보고 싶었다.)
2. 실제 일어난 일 :
사용한 기능
firebase를 이용한 로그인 정보 저장, Firestore database에 사용자들이 남긴 게시판 내용 저장 후 호출,
firebase로 배포를 진행
3. 계획과 실제 결과의 차이 :
React를 배울때 수업시간에 진행한 프로젝트는 로딩이 굉장히 빨랐다.사실 SPA라는 특성상 원래..다 그렇게 빠른 줄 알았지만
그렇지 않았다.
사이트 두 개를 레퍼런스로 삼고, 속도와 UI들을 많이 참고했다.
너무 배낀듯한 느낌을 피하기위해 디자인은 최대한 커스터마이징을 했는데, 다른사람들이 본다면 어설프다고 생각 할 것 같다..
기능면에서는 로딩 속도가 레퍼런스 사이트들 보다 현저히 느렸다.
Loading 페이지를 설정할 때만 해도
"아~ 이렇게 내 마음에 쏙드는 스피너를 넣어서 뭐하나 , 웹사이트가 빨라서 로딩 페이지 보여줄 시간이 없을텐데"
라는 어이없는 생각을 했다.
지금 원티드 프리온보딩 프론트엔드 챌린지를 하고 있는데
거기서 연사님이 랜더링 속도를 측정하는 방법을 알려주셨다.
그 방법을 써서 렌더링 속도를 어서...개선시켜야지..
그리고 컴포넌트, 커스텀 훅을 만들때
이걸 재사용성이 있는 부분만 커스텀 훅으로 생성해야하는지
아니면 기능을 담당하는 함수들은 모두 커스텀 훅으로 생성해야하는지 도통 감을 잡을 수 없었다.
평소에 유투브강의를 해주시는 선생님들의 깃허브, 깃허브 검색에서 star가 많은 순으로 검색을해서 어떤식으로 구성이 되어있나 봤더니
조금씩 달랐다.. 아마 이런부분도 컨벤션으로 따르는 기준이 있는건가 궁금증만 생기고 말았다..(커피챗때 여쭤 볼 목록에 추가..)
그리고 props로 전달, 매개변수로 전달, context API를 통해 전달하는 것들 중에 뭐를 언제 제대로 써야하는지 개념이 확실하게 잡히진 않았다는걸 깨달았다. 그래서 아무리 자식컴포넌트를 업데이트해도 부모컴포넌트에는 전혀 영향이 가지 않아서 애를 먹었다.
또한 배포를 분명히 이번엔 Vercel로 해봐야지.. 라는 막연한 생각을 갖고 있었는데
firebase에도 Hosting기능이 있어서 다른 클라우드 플랫폼을 사용하는 것보다는 과정이 좀 더 수월하겠다는 생각이 들어서 firebase로 진행했다.
역시나...
바닐라스크립트 프로젝트 배포때 netlify와 미운정 고운정 다 들었지만 이번에는 비교적 쉽게 배포가 되었다.
Firebase와 Vercel의 차이점이 궁금해져서 GPT에게 물어봤더니
그리고 이번에 firebase를 사용하며 느낀점은 위의 GPT가 한 설명과 같게 Firebase의 공식문서는 참 친절하다는 것이다.
stackflow에서 답을 찾은 다른 오류들과는 달리 firebase는 공식문서로 충분했다. 야호!
아무튼 생각보다는 수월했어서 굉장히 신났던 배포과정!
4. 지속해야할 부분 :
선배님들의 코드를 더 잘 볼 것!!!!!!!!!!!!!!
지금처럼 프로젝트를 계속 진행하며 기능 구현에 더욱 익숙해질 것 이다.
5.개선해야할 부분 :
피드백이 필요! 내가 잘 하고 있는지 아닌지 객관적인 평가가 필요하다.
선배님들에게 피드백을 받고 나의 코드를 더 갈고닦아야 비로소 취업시장에 내놓을 수 있을 듯 하다.
'진지한 회고' 카테고리의 다른 글
| 리액트 프로젝트 중간점검 (0) | 2023.03.22 |
|---|---|
| 바닐라 자바스크립트 프로젝트 드디어 완성 (0) | 2023.03.07 |
| 강의들을 모두 끝냈다! (0) | 2023.01.17 |
