목록분류 전체보기 (59)
개발자를 향해...
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/bQ7gh0/btqXxd99ZuO/2MA48E55QU4rrw1AhCLKXK/img.png)
본 글은 John Ahn 님의 [노드 리액트 기초 강의]를 수강하며 작성하였습니다. #15 리액트란 ? 리액트의 특징 라이브러리로 페이스북에서 만들었다. 모듈과 비슷한 컴포넌트를 사용한다. 여기서 사용하는 컴포넌트는 재사용성이 뛰어나다. (컴포넌트 - 기능을 파일 하나에 모듈화 또는 컴포넌트화 하면 다른 파일에서 이 기능을 호출해서 쓸 수 있다.) Virtual Dom을 사용한다. Virtual Dom은 변화가 생기면 전체 Dom을 리로드하는 Real Dom과 반대로 변화가 일어나는 부분만 로드시킨다. Virtual Dom은 이전 Dom의 snap shot을 저장해 두었다가 jsx가 업데이트 되면 이전 스냅샷과 비교해 바뀐 부분을 찾는다. 이 과정을 diffing이라고 한다. diffing에서 바뀐 부분..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/dKbHmb/btqXrCn4r4e/mGpz6ZSp57ESQFqbinmJWK/img.png)
#11 로그인 기능 with Bcrypt (1) 로그인 기능을 추가하기 위해 우선 로그인 router를 만들어주고 데이터 베이스 안에서 요청된 이메일을 찾고 이메일이 있다면 비밀번호가 입력된 것과 같은지 확인하고 비밀번호까지 같다면 token을 생성해 주도록 해야한다. app.post('/login', (req,res)=>{ //요청 이메일을 데이터베이스에 있는지 확인 User.findOne({email:req.body.email}, (err, userInfo)=>{ if(!userInfo){ return res.json({ loginSuccess: false, message:"해당 이메일이 존재하지 않습니다" }) } }) //이메일이 있으면 비밀번호가 같은지 확인 user.comparePassword..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/bO1axb/btqW4heEiw7/XRFeBBj9D23abSc8Rbe7KK/img.png)
#6 SSH를 이용해 GITHUB 연결 git과 github의 차이 깃은 소스코드를 관리할 수 있는 툴 , 깃헙은 깃을 사용하는 서비스이다. 우선 깃과 우리 노트북이 안전하게 연결될 수 있도록 ssh를 설정한다. 이 사이트로 가서 ssh 키를 생성한다. 그리고 생성한 ssh 키를 깃헙에 add하기 위해 다음 사이트로 가서 과정을 따라한다. ssh키는 생성한 깃헙 레포지토리의 settings에 가서 넣어준다. 그리고 깃의 코드에 나오는 코드를 vscode의 터미널에서 한줄씩 따라 쳐준다. 그러면 다음과 같이 권한 부여가 뜨는데 허락을 누르면 깃이 완료된다. #7 BodyParser & PostMan & 회원 가입 기능 우선 클라이언트와 서버에 대해 설명을 해보면 클라이언트는 브라우저라 할 수 있다. 브라우..
![](http://i1.daumcdn.net/thumb/C150x150.fwebp.q85/?fname=https://blog.kakaocdn.net/dn/doM6w2/btqXb2053dE/6Drzn0N9RiGfLWesAKrvS1/img.png)
본 글은 따라하며 배우는 노드, 리액트 시리즈 - 기본 강의 를 수강하며 작성하였습니다. #2 node js - 자바스크립트를 서버사이드에서 쓸 수 있는 언어. express js - node js를 이용해 웹사이트나 어플리케이션을 쉽게 만들 수 있게 해줌. 원하는 경로에 폴더를 생성하고 폴더로 가서 npm init 을 실행한다. VScode에서 열어보면 패키지 파일이 설치된것을 볼 수 있다. 여기에 express js를 설치하기 위해 터미널을 켜서 npm install express --save를 실행시키면 패키지 파일에 express가 추가된것을 볼 수 있다. index.js파일을 생성하고 다음 코드를 넣어준다. const express=require('express') const app=expre..