🚀 들어가며 드디어 기대했던 마지막 프로젝트를 진행했다. 마지막 프로젝트는 백엔드 개발자와 협업하는 팀 프로젝트였고, 프론트엔드 개발자 뿐만 아니라 백엔드 개발자와 소통하면서 정말 많이 배우고 성장할 수 있었다. 이번 팀 프로젝트 기간 동안의 경험들을 회고해보려 한다. ✅ 프로젝트 기간(1.29 ~ 3.25) 동안의 경험들 😧 한 달 전의 나 이미 구현된 API으로 프로젝트를 진행한 경험밖에 없었다. 😎 현재의 나 백엔드 개발자들과의 협업으로 기획부터 프로덕트 배포까지의 전반적인 프로젝트 싸이클을 경험할 수 있었다. 아직 API 개발이 완료되지 않은 시점에서 MSW를 활용하여 API 모킹하는 것을 경험할 수 있었다. 백엔드와의 협업을 통해 프론트엔드 개발에 필요한 API를 설계하고 받은 데이터를 가공하는..
🚀 들어가며 프로필 수정 페이지를 개발하던 중 예상하지 못하던 문제가 발생했다. useQuery 훅을 통해 get 요청으로 받아온 데이터가 일시적으로 undefined였고, undefined의 프로퍼티에 접근하려니 당연히 에러가 발생했다. useQuery의 isLoading 변수를 활용해서 데이터가 불러오기 전까지 로딩 상태를 표시해주려 했지만, 이 방법으로는 해결되지 않았다. 팀원과 문제를 해결하던 중, useQuery 대신 useSuspenseQuery 훅을 사용했고 문제를 해결할 수 있었다. useQuery와 useSuspenseQuery의 차이점에 대해 알아보자 이전에 ✅ 문제해결 ▪︎ 문제의 시작 처음에는 아래와 같이 useQuery 훅을 활용하여 데이터를 받아오는 코드를 작성했다. 하지만 us..
🚀 들어가며 팀 프로젝트에서 프로필 수정 페이지 작업 중 있던 일이었다. 프로필 수정 페이지에서 프로필을 수정하고 저장 버튼을 눌렀을 때, 프로필 페이지로 이동시켜주어야 했고 새로 수정한 프로필 정보가 화면에 렌더링되어야 했다. 하지만 뜻대로 되지 않았고 이전의 프로필 정보가 렌더링되었다. 그리고 새로고침을 한 번한 이후에야 정상적으로 변경된 프로필 정보가 렌더링되었다. ✅ 해결해보기 위의 사진처럼 좌측의 프로필 수정 페이지의 변경내용 저장 버튼을 누르면 input 필드에 입력된 내용들을 body에 담아서 api 요청을 보내게 된다. api 요청이 성공하면 alert 창을 띄우고 프로필 페이지로 navigate 되게 된다. 프로필 페이지로 navigate 되고 나서 바뀐 프로필 정보를 api 요청을 통해..
🚀 들어가며 이번 주 멘토님과의 커피챗 시간에 유익한 질문이 나왔다. React에서 제공하는 Context API가 있음에도 다른 상태 관리 라이브러리가 필요한 이유와 어떤 경우에 둘을 사용해야할지에 대한 질문이었다. 많은 개발자들이 상태 관리 라이브러리를 사용하고는 있지만 Context API와 무엇이 다른지에 대해 깊게 고민하지 않았을 것이다. 나 또한 그랬다. 그저 상태 관리 라이브러리를 사용하는 것이 무조건적으로 옳다고만 생각했었다. 이번 포스팅에서는 Context API와 상태 관리 라이브러리의 차이점에 대해서 다뤄보려고 한다. ✅ 01. Context API Context – React A JavaScript library for building user interfaces ko.legacy...
🚀 들어가며 개발자에게 협업 능력이란 개발 능력만큼이나 중요한 요소이다. 내가 프로그래머스 데브코스에 지원했을 때 지원서에도, 면접에서도 강조했던 것이 '협업 능력을 중요하게 생각한다. 협업 잘하는 개발자가 되고 싶다.'는 것이었다. 다양한 분야의 사람들과 협업하는 것은 자신이 있었다. 대학시절에는 2년 반동안 온라인 쇼핑몰을 운영하면서 많은 거래처 사장님들과 항상 소통했었고, 이후에는 1년 반동안 IT 솔루션 영업직으로 근무하며 개발자, 구매 담당자 등 다양한 부서의 사람들과 커뮤니케이션을 했다. 프로그래머스 데브코스에서도 협업 능력을 극대화하려는 노력들을 해왔고, 꾸준함과 더불어 내가 자랑할 수 있는 나의 장점 중 하나가 된 것 같다. ✅ 협업 잘하는 개발자는 어떤 모습일까? ▪︎ 풍부한 경험 풍부한..
🚀 들어가며 GitHub를 가입하고 잔디를 심기 시작한지 드디어 1년이 지났다. '1년 365일 1일 1커밋하기'는 내가 개발자의 꿈을 가지기 시작한 후 처음으로 가진 목표였다. 1년간 하루도 빠짐없이 잔디를 심으며 그 과정이 마냥 순탄치만은 않았다. 이번 포스팅에서는 지난 1년동안 내가 얼만큼 성장했고, 또 무엇을 했는지 간단하게 회고하기로 했다. ✅ 01. 퇴사를 결심하다 대학 재학시절 2년 반동안 개인 쇼핑몰을 운영했던 경험을 살려 IT 회사의 솔루션 영업직으로 취업할 수 있게 되었고, 그 곳에서 내 첫 직장 생활이 시작되었다. 첫 직장에서의 경험은 나에게 굉장한 경험이었다. 하나하나 새로웠고, 영업직으로서 사람들을 응대하면서 겪었던 그 순간들은 어디에서도 쉽게 할 수 없는 소중한 경험이 되었다. ..
🚀 들어가며 이번 한 달간은 예비 프론트엔드 주니어 개발자들과 팀 프로젝트를 진행했다. 정말 많이 배우고 성장할 수 있었던 기간이었고, 내가 데브코스를 지원한 이유 중 하나인 '협업을 잘하는 개발자'에 한 걸음 더 가까워질 수 있었던 경험이었다. 한 달간의 경험들을 짧게 회고해보려 한다. ✅ 한 달 (12.26 ~ 1.23) 동안의 경험들 😧 한 달 전의 나 프로젝트 경험이 없어서 프로젝트 요구사항 분석, 설계, 구현, 테스트 과정을 꼭 제대로 경험해보고 싶었다. 😎 현재의 나 팀 프로젝트에 적극적으로 참여하며 프로젝트의 요구사항 분석, 설계, 구현, 테스트 과정을 경험할 수 있었다. ✅ 팀 프로젝트 looky 패션에 관심 있는 lookys들을 위한 SNS 서비스. looky looky.kr 드디어..
🚀 들어가며 벌써 프로그래머스 데브코스가 시작한지 절반이 지났다. 시간이 너무 빠르다는 생각이 든다. 그동안 데브코스에서 강의 수강, 스터디 등을 진행하면서 정말 많이 성장했다는 느낌이 들지만 한편으로는 모든 커리큘럼을 다 소화하지 못한다는 생각에 항상 아쉬운 마음이 든다. 그래도 이번 한 달은 내가 평소에 배우고 싶어했던 리액트를 공부하면서 정말 빠르게 성장하고 있다는 것을 느낄 수 있었다. 이번 한 달 회고를 통해 내가 이전보다 얼마나 성장했는지 체크하고 앞으로의 계획을 세워보려고 한다. ✅ 한 달 (11.23 ~ 12.25) 동안의 경험들 😧 한 달 전의 나 리액트를 통해 간단한 TodoList App 정도만 겨우 만들 수 있었다. 리액트에 타입스크립트를 사용해본 적이 없었다. 프로젝트 초기 세팅..