본문 바로가기

전체 글

(13)
React에서 Redux를 이해하며 사용해보기 1편 count state를 Redux로 관리하는 간단한 예제를 만들어보며 Redux에 대한 학습을 해보자. 이 포스트는 react가 앱에 미리 설치된 환경이라는 가정 하에 진행한다. (create-react-app 사용함) npm 설치 (react-redux) Redux는 바닐라 자바스크립트에서도 동작하지만. react에서의 Redux를 사용하기 위해서는 따로 react-redux도 함께 설치해주어야 한다. npm install redux react-redux 먼저, store가 필요합니다! 먼저 state들을 저장할 store를 만들어야 한다. 그리고 그에 인자로 부여할 reducer함수도 함께 정의해야 한다. store란 무엇이며 reducer란 무엇일까? 차근차근 하나씩 이해해보자. store란? Re..
[React 일기앱 버그] 로그인 후 로그인 유저의 정보를 읽어올 수 없는 문제 해결 일기 쓰기 사이트에 로그인할 시 일기장을 생성할 수 없는 에러가 발생했다. 사실은 몇몇 유저가 “로그인 후 일기가 안 써져요”라는 버그를 지적해주셨으나 메시지에 답장을 보내려고 하면 새로고침 하니 작동합니다! 지금은 잘 써져요.라고 해주셨기 때문에 애초에 왜 이런 문제가 발생하는 걸까? 에 대한 질문을 던지지 않은 채로 그저 안일하게 넘겨왔었다. (바보) 나는 최근까지 이 버그의 원인을 눈치채지 못하고 이곳저곳에 이 버그가 난 포트폴리오를 들고 면접을 보러 다녔다. 그러다 한 곳에서 면접을 보는 도중 “포트폴리오 사이트를 이용해봤는데 이러한 버그가 있었다” 라는 피드백을 (감사히도) 받을 수 있었고, 그 자리에서 버그사항을 메모했다. 면접관분께서는 “로그인 후 로그인 된 유저의 정보를 앱이 제대로 읽어오..
React와 Node.js + MongoDB로 쇼핑몰을 만들어보며... 이번엔 React와 Node.js를 사용하여 쇼핑몰을 만들었다. 약 2주에 걸친 개발 기간 동안 느낀 점을 기록하기 위해 회고글을 남긴다. 프로젝트 소개: 모퉁이 꿈 다락방 (https://corner-dream-atelier.herokuapp.com/)달러구트 꿈 백화점이라는 책에서 영감을 받아 만든 꿈을 팔고 살 수 있는 쇼핑몰이다. '통신판매에 도전하는 요정들의 스타트업'이라는 지존 오타쿠 같은 컨셉을 잡고 만들었다 으하하. 간단히 아래와 같은 기능들이 있다. 1. 상품 조회 2. 상품 구매 3. 상품 생성 4. 카트에서 삭제 5. 카트에서 결제 6. 구매한 상품정보 조회 강의에 나온 기능에서 +@로 개선할 부분은 개선하고, 추가할 부분은 추가하는 식으로 진행하며 나만의 프로젝트로 점점 바꾸어나갔다..