함께 성장하는 프로독학러

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 지금까지 만든 어플리케이션의 성능을 개선해 보도록 하겠습니다. *본 튜토리얼은 Velopert 님의 'React.js Codelab 2016' 을 기반으로 되었습니다.(여러 모듈들의 버전업에 따라 작성방법이 조금씩 달라진 코드를 버전에 맞게 수정하고, 제가 튜토리얼을 따라함에 있어 이해가 쉽지 않았던 부분에 설명을 추가하는 방식으로 진행합니다.)* Velopert 님의 원본 튜토리얼을 보고싶으신 분들은 아래의 링크를 참고해 주세요. 1. 성능 개선 현재 모든 기능을 구현이 완료된 상태입니다. 하지만 테스트를 하면서 어플리케이션이 조금 버벅거린다는 느낌을 받진 않으셨나요?아직 느끼지 못하셨을 수도 있습니다. 그렇다면 스크롤을 마지막 메모가 로딩될 때까지 내..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 추가적인 기능인 별점주기, 담벼락 기능, 유저 검색 기능을 구현해 보도록 하겠습니다.(담벼락은 특정유저가 작성한 글만을 보여주는 페이지를 의미합니다) *본 튜토리얼은 Velopert 님의 'React.js Codelab 2016' 을 기반으로 되었습니다.(여러 모듈들의 버전업에 따라 작성방법이 조금씩 달라진 코드를 버전에 맞게 수정하고, 제가 튜토리얼을 따라함에 있어 이해가 쉽지 않았던 부분에 설명을 추가하는 방식으로 진행합니다.)* Velopert 님의 원본 튜토리얼을 보고싶으신 분들은 아래의 링크를 참고해 주세요. 1. 별점 기능 별점 기능은 마음에 드는 메모에 별점을 주거나 빼는 기능입니다. 별점은 최대 한 번 줄 수 있으며 준 별점을 다시 회수 할..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 메모에 관련된 기능들 중 Update 와 Delete 를 구현해 보도록 하겠습니다.메모의 기능들을 CRUD 라고도 하는데요, 이는 Create, Retrieve, Update, Delete 의 줄임말으로, 쓰기, 읽기, 수정하기, 삭제하기입니다.(이 중 셋, 네 번째인 Update, Delete 를 구현하도록 하겠습니다) *본 튜토리얼은 Velopert 님의 'React.js Codelab 2016' 을 기반으로 되었습니다.(여러 모듈들의 버전업에 따라 작성방법이 조금씩 달라진 코드를 버전에 맞게 수정하고, 제가 튜토리얼을 따라함에 있어 이해가 쉽지 않았던 부분에 설명을 추가하는 방식으로 진행합니다.)* Velopert 님의 원본 튜토리얼을 보고싶으신 분..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 메모에 관련된 기능들 중 Retrieve 를 구현해 보도록 하겠습니다.메모의 기능들을 CRUD 라고도 하는데요, 이는 Create, Retrieve, Update, Delete 의 줄임말으로, 쓰기, 읽기, 수정하기, 삭제하기입니다.(이 중 두 번째인 Retrieve 를 구현하도록 하겠습니다) *본 튜토리얼은 Velopert 님의 'React.js Codelab 2016' 을 기반으로 되었습니다.(여러 모듈들의 버전업에 따라 작성방법이 조금씩 달라진 코드를 버전에 맞게 수정하고, 제가 튜토리얼을 따라함에 있어 이해가 쉽지 않았던 부분에 설명을 추가하는 방식으로 진행합니다.)* Velopert 님의 원본 튜토리얼을 보고싶으신 분들은 아래의 링크를 참고해 주..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 메모에 관련된 기능들 중 Create 를 구현해 보도록 하겠습니다.메모의 기능들을 CRUD 라고도 하는데요, 이는 Create, Retrieve, Update, Delete 의 줄임말으로, 쓰기, 읽기, 수정하기, 삭제하기입니다.(이 중 첫번째인 Create 를 구현하도록 하겠습니다) *본 튜토리얼은 Velopert 님의 'React.js Codelab 2016' 을 기반으로 되었습니다.(여러 모듈들의 버전업에 따라 작성방법이 조금씩 달라진 코드를 버전에 맞게 수정하고, 제가 튜토리얼을 따라함에 있어 이해가 쉽지 않았던 부분에 설명을 추가하는 방식으로 진행합니다.)* Velopert 님의 원본 튜토리얼을 보고싶으신 분들은 아래의 링크를 참고해 주세요. 0..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 저번 포스팅에 이어 인증(로그인, 로그아웃, 로그인 확인)을 구현해보도록 하겠습니다.(인증에는 회원가입, 로그인, 로그아웃, 로그인 확인의 4가지 기능이 있습니다) *본 튜토리얼은 Velopert 님의 'React.js Codelab 2016' 을 기반으로 되었습니다.(여러 모듈들의 버전업에 따라 작성방법이 조금씩 달라진 코드를 버전에 맞게 수정하고, 제가 튜토리얼을 따라함에 있어 이해가 쉽지 않았던 부분에 설명을 추가하는 방식으로 진행합니다.)* Velopert 님의 원본 튜토리얼을 보고싶으신 분들은 아래의 링크를 참고해 주세요. 0. intro - 쿠키와 세션 인증 기능을 구현하는데 있어서 중요한 개념은 쿠키와 세션입니다.간단히 두 개념이 어떤차이가 ..

안녕하세요, 프로독학러 입니다. 이번 포스팅에서는 인증의 기능 중 회원가입을 구현해 보도록 하겠습니다. (인증에는 회원가입, 로그인, 로그아웃, 로그인 확인의 4가지 기능이 있습니다) *본 튜토리얼은 Velopert 님의 'React.js Codelab 2016' 을 기반으로 되었습니다.(여러 모듈들의 버전업에 따라 작성방법이 조금씩 달라진 코드를 버전에 맞게 수정하고, 제가 튜토리얼을 따라함에 있어 이해가 쉽지 않았던 부분에 설명을 추가하는 방식으로 진행합니다.)* Velopert 님의 원본 튜토리얼을 보고싶으신 분들은 아래의 링크를 참고해 주세요. 1. BACK-END 환경설정 기능을 구현하기에 앞서 BACK-END 에 필요한 파일을 먼저 생성해 보도록 하겠습니다.account 라우터, api 루트 ..

안녕하세요, 프로독학러 입니다. 저번 포스팅에서는 Memo app 을 제작하기 위한 기본 개념들에 대해서 알아보았는데요, 이번 포스팅에서는 설치부터 본격적으로 진행해 보도록 하겠습니다. *본 튜토리얼은 Velopert 님의 'React.js Codelab 2016' 을 기반으로 되었습니다.(여러 모듈들의 버전업에 따라 작성방법이 조금씩 달라진 코드를 버전에 맞게 수정하고, 제가 튜토리얼을 따라함에 있어 이해가 쉽지 않았던 부분에 설명을 추가하는 방식으로 진행합니다.)* Velopert 님의 원본 튜토리얼을 보고싶으신 분들은 아래의 링크를 참고해 주세요. 1. React.js 설치 우리가 만들게 될 Memo app 은 React.js 를 기반으로 한 SPA(Single Page Application) 입니..

안녕하세요, 프로독학러 입니다. 이번에 진행할 튜토리얼은 'Memo 어플리케이션 만들기' 입니다. 1. intro 본 튜토리얼은 Velopert 님의 'React.js Codelab 2016' 을 기반으로 작성될 예정입니다.여러 모듈들의 버전업에 따라 작성방법이 조금씩 달라진 코드를 버전에 맞게 수정하고, 제가 튜토리얼을 따라함에 있어 이해가 쉽지 않았던 부분에 설명을 추가하는 방식으로 진행할 예정입니다.* Velopert 님의 원본 튜토리얼을 보고싶으신 분들은 아래의 링크를 참고해 주세요. 2. require Memo 어플리케이션은 여러가지 언어들을 이용하여 만드는 하나의 서비스입니다. 아래의 리스트 중 모르는 언어나 부족한 부분이 있다면 해당 언어를 숙지하신 후 튜토리얼을 따라오시는 것도 좋습니다. ..