Category: node.js

6편에선 저희 프로젝트의 핵심기능을 모두 완료하였고, 성능을 최적화하는 방법도 가볍게 배웠습니다. 이번 편에서는 (마지막 편입니다! 야호~) 유저 검색기능을 구현해보겠습니다. 강좌 후반부에서는 제가 핵심코드만 제공해드릴테니, 한번 여러분이 직접 구현해보세요.   25. 유저 검색기능 구현하기 – 담벼락 우리가 구현 할 기능은 이렇게…

5편에서는 메모를 수정하고 삭제하는 기능을 구현해보았습니다. 이번 편에서는, 별 주기 기능을 구현해보겠습니다. 이 작업은 수정 기능과 매우 비슷하므로 쉽게 구현 하실 수 있을겁니다. 23. 별 주기 기능 서버 – 별주기 API 구현하기 (server/routes/memo.js) /* TOGGLES STAR OF MEMO: POST /api/memo/star/:id…

  4편에서는, 메모를 쓰고 읽는 기능을 구현했습니다. 지금까지 잘 따라와주셨다면, 이번 코드랩의 목표를 이미 달성 한 셈입니다. 여러분들은 React 컴포넌트를 다루는 방법을 어느정도 숙지하였고, Redux 데이터 흐름 구조에도 익숙해졌으며, 서버와 커뮤니케이션 하는 방법 또한 배웠습니다. 저희가 지금까지 해왔던 지식과 방식을…

3편에서는 계정인증 부분을 완료했었습니다. 어떤가요? 조금 복잡했나요? 이 파일 수정하고.. 저 파일 수정하고, 조금 정신없었을 수도 있지만, 결국엔 비슷한 동작이 계속해서 반복되기 때문에 몇번 해보면 쉬워진답니다. 이런 동작이 반복되죠 action type 만들기 action creator 만들기 reducer 만들기 컴포넌트에서 사용 이번…

2편에서는, 클라이언트 사이드의 초기 구조를 대충 잡았죠, 이번 편에서는 Redux 구조를 설정하도록 하겠습니다. 계속해서 컴포넌트를 뚝딱뚝딱 만들어봅시다.   11. Authentication 컴포넌트 만들기 Login 과 Register 라우트는 상당히 비슷하기 때문에, Authentication 이라는 컴포넌트를 만들어서 같이 사용하도록 하겠습니다. CodePen Link: 로그인 페이지: …

1편에서 우리는 기본적인 Backend 를 완성하였습니다. 우리가 만든 Backend 를 기반으로 React 어플리케이션을 만들어봅시다!   6. webpack 설정 추가 및 클라이언트사이드에서 필요한 모듈 설치 webpack 에 resolve 설정 추가하기 (webpack.config.js & webpack.dev.config.js) var path = require('path'); /* .. 코드 생략…