본문 바로가기

스파르타코딩클럽166

[TIL] 내일배움캠프 React 과정 2023.02.28 Today I Learned 10시 고객 피드백 관련 발제 2시 디자인 회의 4시 원장님과 취업 상담 아파트 매매 실거래가 API 분석 및 기능 구현 아파트매매 실거래 상세 자료 API 분석하기 개발일지 노션 링크 https://fanatical-marigold-762.notion.site/API-a5d47e7734554e34918701f35625dc61 회고 추가 기능으로 아파트 매매 실거래가 API 가져오는 기능을 맡게 됐다. API를 가져와서 분석 후 필터링하는 것은 처음이기 때문에 굉장히 설렌다! (+ 약간의 두려움..?) 2023. 3. 1.
[TIL] 내일배움캠프 React 과정 2023.02.27 Today I Learned 관리자 페이지 DB 업데이트 로직 수정하기 관리자 페이지 DB 업데이트 로직 수정하기 기존에는 firestore의 DB를 새로 들어온 분양 정보로 전부 교체하는 방식이었는데 이렇게 할 경우 기존에 직접 추가한 좌표나 이미지 데이터까지 삭제되기 때문에 기존 데이터는 유지하면서 새로 들어온 분양 공고 데이터만 넣어주는 방식으로 수정하기로 했다. 일단은 임시로 생성한 데이터로 테스트해서 구현했는데 실제로 새로운 분양 데이터가 들어왔을 때도 정상적으로 작동할지는 지켜봐야 할 거 같다! 관리자 페이지 데이터 업데이트 방식 변경 개발일지 노션 링크 https://citrine-camel-d7e.notion.site/da4b38aa288b4dd6a6396504d1b620e9 TTV & T.. 2023. 2. 27.
[TIL] 내일배움캠프 React 과정 2023.02.26 Today I Learned 기술면접 질문 답변 정리하기 기술면접 질문 답변 정리 노션 링크 https://abrupt-moonflower-b68.notion.site/2-27-4c4521754dfc48ec9dbfdb7d74bb4150 회고 팀원들과 기술면접 질문에 대한 답변을 정리했다. 답변을 작성하기 위해서 자료를 검색해 보기도 하면서 프로젝트에 대해 더 잘 이해할 수 있는 기회가 되었다. +) 일찍 자려다가 갑자기 삘 받아서 이력서 노션 페이지 만들고 이력서 작성법 검색하면서 기본 틀을 잡아놨다. 틈틈이 써 놔야지... 2023. 2. 26.
[TIL] 내일배움캠프 React 과정 2023.02.25 Today I Learned Next.js 공부하기 회고 튜터님한테 추천받아서 팀원들 모두 구매한 그 도서 ㅋㅋㅋ 오늘은 기능 개발보다는 이 책을 읽으면서 Next.js를 공부하는 시간을 가졌다. 읽으면서 나중에 적용해보고 싶은 부분을 노션에 메모해 놓기도 했다. Next.js를 공부하고 싶은 사람이라면 이 책을 매우 추천함! 2023. 2. 26.
[TIL] 내일배움캠프 React 과정 2023.02.24 Today I Learned 중간발표 진행 중간발표 회고록 작성 및 향후 계획 수립 중간발표 자료 https://slime-egret-f03.notion.site/6a0d85cd0dce4bde8f5a88a65bd3fdf6 3주차 회고록 (기술 멘토링 노트) https://brazen-polish-13e.notion.site/3-80b2653686974c9396cd5c7f96f9a74c 회고 중간발표가 드디어 끝났다!! 다른 팀들의 결과물도 확인할 수 있는 자리라 기대했었는데 다들 너무 완성도 있게 구현해서 놀랐다. 다른 팀들 발표랑 피드백도 들으면서 궁금한 키워드들을 몇 개 적어놨는데 주말 동안 한번 검색해 봐야겠다 ㅋㅋ 어제 발표 끝나자마자 회고록 작성하면서 우리 팀이 추가적으로 구현할 리스트들을 정리.. 2023. 2. 25.
[TIL] 내일배움캠프 React 과정 2023.02.23 Today I Learned 중간발표 준비하기 vercel로 배포하기 README.md 작성 회고 내일 중간 발표를 앞두고 오늘은 기능 개발보다는 프로젝트를 전체적으로 정리하는 시간을 가지며 자잘한 에러나 CSS를 수정하고 코드도 전체적으로 주석이나 콘솔로그를 삭제했다 . 그리고 오늘 로고를 받았기 때문에 로고 이미지까지 넣으니까 프로젝트가 훨씬 완성된 느낌이 들었다! 저녁엔 README.md를 작성했는데 작성하면서 주요 기능 정리도 되고 어렵게만 느껴졌던 README와 친숙해질 수 있는 기회라 재밌었다. 그리고 배포 링크 자랑하기! 모바일로 들어가지 마세요 ㅎㅎ https://bunyang-moeumzip.vercel.app/ 2023. 2. 24.
[TIL] 내일배움캠프 React 과정 2023.02.22 Today I Learned 마이페이지 프로필 수정 기능 구현 및 전체적인 코드 리팩토링 오전 9시 반 디자이너님과 디자인 회의 저녁 8시에 원장님께 디자인 반영한 버전으로 최종 시연 Next.js에서 로그인 후 이전 페이지로 이동하기 기존에는 로그인을 했을 때 로딩 페이지로 이동 후 최초 로그인 여부에 따라 회원가입 페이지 혹은 메인 페이지로 이동하도록 구현했다. 그런데 헤더에 로그인 버튼을 클릭해서 로그인 모달에서 로그인을 처리하기 때문에 최초 로그인 유저가 아닐 때 무조건 메인으로 이동하는 게 아니라 기존 페이지로 돌아가도록 구현하고 싶었다. const router = useRouter(); router.back(); 그래서 검색을 해봤더니 Next.js에서 친절하게 그런 기능을 제공해주고 있었다!.. 2023. 2. 23.
[TIL] 내일배움캠프 React 과정 2023.02.21 Today I Learned 마이페이지 UI 구현 및 유저의 관심 카테고리 업데이트 기능 구현 recoil duplicate 에러 해결하기 Expectation Violation: Duplicate atom key "{아톰 키}". This is a FATAL ERROR in production. But it is safe to ignore this warning if it occurred because of hot module replacement. 콘솔에 자꾸 Recoil 관련된 에러 메시지가 떠서 검색해 봤더니 Next.js와 관련하여 발생하는 문제인 거 같았다. RECOIL_DUPLICATE_ATOM_KEY_CHECKING_ENABLED=false 블로그 링크를 참고하여 .env 파일에 상단의 코.. 2023. 2. 23.
[TIL] 내일배움캠프 React 과정 2023.02.20 Today I Learned 오후 3시에 원장님께 기본 기능 시연하고 피드백받기 로그인 모달, 회원가입 페이지 UI 구현 typescript에서 styled-components에 여러 개의 props를 넘길 경우 처음에는 props의 타입을 이렇게 지정해 줬었는데 CategoryBtn 하단으로 새로운 스타일 컴포넌트를 작성해도 폰트 색상이 원래대로 적용이 안 돼서 뭔가 이상한가 하는 생각에 문제를 찾다가 타입 지정을 뭔가 잘못해 준 거 같다는 것을 발견했다. interface CategoryBtnStyledProps { bg: string; text: string; border: string; } export const CategoryBtn = styled.button` padding: 0 17px; h.. 2023. 2. 21.
[TIL] 내일배움캠프 React 과정 2023.02.19 Today I Learned 북마크 기능 구현 전체적인 코드 리팩토링 로딩 화면에 스피너 추가하기 (next.js) import spinner from '../../../assets/spinner.gif'; import Image from 'next/image'; const LoadingSpinner = () => { return ( ); }; export default LoadingSpinner; 따로 라이브러리를 설치하지 않고 로딩 중 이미지를 gif로 폴더에 넣어준 후 import 해서 src에 넣어주는 방법으로 구현했다. 참고 https://loading.io/ https://anerim.tistory.com/221 next/Image 사용할 때 외부 링크 다중으로 지정하기 /** @type {i.. 2023. 2. 20.