clone toy projects/node_express_sns 썸네일형 리스트형 프로젝트 구조 갖추기 이번 프로젝트는 NodeBird 서비스와 데이터베이스를 공유합니다. 다른 서비스가 NodeBird의 데이터나 서비스를 이용할 수 있도록 창구를 만드는 것이 목표로, 프론트 쪽은 거의 루즈하지 않습니다. 우리는 다른 서비스에 NodeBird 서비스의 게시글, 해시태그, 사용자 정보를 JSON 형식으로 제공할 것입니다. 단, 인증을 받은 사용자에게만 일정량 안에서 API를 호출할 수 있도록 허용할 것입니다. package.json NodeBird에서 config, models, passport 폴더와 그 내용물들을 모두 복사해서 nodebird-api 폴더에 붙여넣습니다. routes 폴더에 서는 auth.js와 middlewares.js 만 그대로 사용합니다. 마지막으로 .env 파일을 복사합니다. 다른 .. 더보기 API 서버 이해 NodeBird 앱의 REST API 서버를 만들어보겠습니다. 노드는 자바스크립트 문법을 사용하므로 웹 API 서버에서 데이터를 전달할 때 사용하는 JSON을 100% 활용하기에 좋습니다. API 서버는 프론트엔드와 분리되어 운영되므로 모바일 서버로도 사용할 수 있습니다. 노드를 모바일 서버로 사용하려면 이번 장과 같이 서버를 REST API 구조로 구성하면 됩니다. 사용자 인증, 사용량 제한 등의 기능을 구현하여 NodeBird의 웹 API 서버를 만들어봅시다. 이번 장을 위해 NodeBird 앱에 게시글을 다양하게 올려 두세요. 웹 API는 다른 웹 서비스의 기능을 사용하거나 자원을 가져올 수 있는 창구입니다. "API를 열었다" 또는 "만들었다"라는 표현은 다른 프로그램에서 현재 기능을 사용할 수 .. 더보기 팔로잉과 해시태그 다른 사용자를 팔로우 하는 기능을 만들기 위해 routes/user.js와 controllers/user.js를 작성합니다. POST /user/:id/follow 라우터입니다. :id 부분이 req.params.id가 됩니다. 먼저 팔로우할 사용자를 데이터베이스에서 조회한 후, Sequelize에서 추가한 addFollowing 메서드로 현재 로그인한 사용자와의 관계를 지정합니다. 팔로잉 관계가 생겼으므로 req.user에도 팔로워와 팔로잉 목록을 저장합니다. 앞으로 사용자 정보를 불러올 때는 팔로워와 팔로잉 목록도 같이 불러오게 됩니다. req.user를 바꾸려면 deserializeUser를 아래와 같이 조작해야 합니다 세션에 저장된 아이디로 사용자 정보를 조회할 때 팔로잉 목록과 팔로워 목록도 같.. 더보기 multer 패키지로 이미지 업로드 구현하기 npm install multer 이미지를 어떻게 저장할 것인지는 서비스의 특성에 따라 달라집니다. NodeBird 서비스는 input 태그를 통해 이미지를 선택할 때 바로 업로드를 진행하고, 업로드된 사진 주소를 다시 클라이언트에 알릴 것입니다. 게시글을 저장할 때는 데이터베이스에 직접 이미지 데이터를 넣는 대신 이미지 경로만 저장합니다. 이미지는 서버 디스크에 저장됩니다. 그럼 post 라우터와 컨트롤러를 작성해보겠습니다. POST /post/img 라우터에서는 이미지 하나를 업로드 받은 뒤 이미지의 저장 경로를 클라이언트로 응답합니다. static 미들웨어가 /img 경로의 정적 파일을 제공하므로 클라이언트에서 업로드한 이미지에 접근할 수 있습니다. POST /post 라우터는 게시글 업로드를 처리.. 더보기 Passport 모듈로 로그인 구현하기[카카오] 카카오 로그인이란 로그인 인증 과정을 카오에 맡기는 것을 뜻합니다. clientID는 카카오에서 발급해주는 아이디입니다. callbackURL은 카카오로부터 인증 결과를 받을 라우터 주소입니다. 먼저 기존에 카카오를 통해 회원가입한 사용자가 있는지 조회합니다. 있다면 이미 회원가입되어 있는 경우이므로 사용자 정보와 함께 done 함수를 호출하고 전략을 종료합니다. 카카오를 통해 회원가입한 사용자가 없다면 회원가입을 진행합니다. 카카오에서는 인증 후 callbackURL에 적힌 주소로 access Token, refreshToken과 profile(사용자 정보)을 보냅니다. profile 객체에서 원하는 정보를 꺼내와 회원가입을 하면 됩니다. 사용자를 생성한 뒤 done 함수를 호출합니다. 이제 카카오 로.. 더보기 Passport 모듈로 로그인 구현하기[로컬] 세션과 쿠키 처리 등 복잡한 작업이 많으므로 검증된 모듈을 사용하는 것이 좋습니다. 바로 Passport를 사용하는 것입니다. 이 모듈은 이름처럼 우리의 서비스를 사용할 수 있게 해주는 여권과 같은 역할을 합니다. 요즘에는 서비스에 로그인할 때 아이디와 비밀번호를 사용하지 않고 구글, 페이스북, 카카오톡 같은 기존의 SNS 서비스 계정으로 로그인하기도 합니다. 이 또한 Passport를 사용해서 해결할 수 있습니다. $ npm i passport passport-local passport-kakao bcrypt passport 관련 모듈들 설치 app.js에 passport연결 passport.initialize 미들웨어는 요청 (req 객체)에 Passport 설정을 심고, passport.sessio.. 더보기 데이터베이스 세팅하기 사용자 테이블,게시글테이블, 해시태그 테이블이 필요하다. 소셜 로그인을 했을 경우 provider과 snsId를 저장한다. provider의 EUM 이라는 속성은 넣을 수 있는 값을 제한하는 데이터형식 종류는 local, kakao이며 이를 어겼을때는 에러가 발생한다. 게시글의 내용과 이미지 경로를 저장 게시글 등록자의 아이디를 담은 컬럼은 나중에 관계를 설정 할 때 시퀄라이즈가 알아서 생성한다. 태그 이름을 저장( 태그로 검색을 하기 위해) 모델의 index.js 작성 같은 모델끼리도 N : M 관계를 가질 수 있다. 같은 테이블 간 N:M 관계에서는 모델 이름과 컬럼 이름을 따로 정해야 한다. 모델 이름이 UserUser일수는 없으니까. through 옵션을 사용하여 생성할 모델 이름을 Follow로.. 더보기 프로젝트 구조 갖추기 '노드의 교과서'를 토대로 진행 사용자와 게시물 간, 게시물과 해시태그 간의 관계가 중요하므로 관계현 데이터 베이스 사용. npm install cookie-parser dotenv mysql2 express-session npm install morgan nunjucks sequelize sequelize-cli npm install -D nodemon 필요 패키지 다운 npx sequelize init 위 명령어 입력해서 config, migrations, models, seeders 폴더 생성 .env 에 COOKIE_SERCRET 작성 app.js 작성 page 라우터 작성 및 컨트롤러 작성 /profile /join / 총 3개의 페이지로 구성 및 템플릿 엔진에서 사용할 4개의 변수 res.lo.. 더보기 이전 1 2 3 다음
