Skip to content
atomsong92 edited this page Feb 13, 2021 · 76 revisions

한번 본 사람은 잊어도, 한번 먹은 음식은 못 잊는다

  • 이 프로젝트는 ~~~~~~~ 해서 ~~~~~~ 한 계기로 시작되었습니다. 레시피 글 작성자는 사진과 조리에 필요한 순서들을 step에 맞게 기록하고, Homemade 서비스를 이용하는 유저는 레시피들을 참고하여 맛있는 집밥을 먹을 수 있습니다.

우리들의 시크릿 레시피 Homemade

기능별 담당자

Front End : 김남인, 김지운

이름 담당 설명
김남인 UX/UI / 레시피 정보 설명설명설명설명
김지운 디자인 / 유저 정보 설명설명설명설명


Back End : 김용재, 송정현

이름 담당 설명
김용재 유저정보 API, 배포 설명설명설명설명
송정현 레시피정보 API, 데이터 설명설명설명설명

시스템 아키텍쳐

https://www.figma.com/file/aUgEHT7VDa7wplHAZmxlNi/Homemade-pages?node-id=0%3A1

메인화면

스크린샷 2021-02-13 오후 4 56 51

금주의 인기레시피 확인

스크린샷 2021-02-13 오후 4 56 57

로그인 / 로그아웃

스크린샷 2021-02-13 오후 4 57 19

회원가입

스크린샷 2021-02-13 오후 4 57 41

레시피 작성

  1. 레시피 정보 작성
스크린샷 2021-02-13 오후 4 59 09
  1. 순서(step)별 이미지 & 설명 등록
스크린샷 2021-02-13 오후 4 59 19

마이페이지

  1. 내 정보 보기
스크린샷 2021-02-13 오후 4 59 19 : 내 정보와 내가 올린 레시피를 확인할 수 있는 페이지로 구성
  1. 내 정보 수정
스크린샷 2021-02-13 오후 4 59 19

이곳에선 나의 계정 정보에 대해 변경이 가능합니다.

  1. 내 레시피 보기
스크린샷 2021-02-13 오후 4 59 19

내가 작성한 레시피 목록을 볼 수 있습니다.

이전 슬라이드, 다음 슬라이드 버튼으로 목록들을 확인할 수 있습니다.




스키마

스키마 dbdiagram 링크

스크린샷 2021-02-13 오후 4 38 35
1 (hasMany) N (belongsTo)
users contents
users comments
users labals
contents comments
contents images
categories contents
N (belongsToMany) N (belongsToMany)
users labels
labels users
N (belongsTo) N
user_label users
user_label label

API API 문서

스크린샷 2021-02-13 오후 6 31 10
GET API명 설명 엔드포인트
GET user info 유저 정보 GET, 마이페이지 데이터 전달용 users/userinfo
GET my recipes 내가 작성한 레시피 보기 users/myrecipes
GET recipes 검색어 & 카테고리별 레시피 분류, 결과얻기 recipes/recipes
GET recipe 레시피 클릭했을 때의 레시피 정보(상세정보 GET) recipes/recipe
GET check email email 중복 여부 판단 users/checkemail
POST API명 설명 엔드포인트
POST sign in 로그인, 엑세스 토큰 발급 users/singin
POST sign out 로그아웃 users/singout
POST sign up 회원가입 users/signup
POST content 레시피 글 작성 recipes/content
POST comment 레시피 글의 댓글 작성 recipes/comment
PATCH API명 설명 엔드포인트
PATCH update userinfo 회원 정보 변경 users/uuserinfo
PATCH update content 레시피 글 수정 users/ucontent
PATCH update comment 회원가입 users/ucomment
PATCH update password 레시피 글 작성 users/upassword

기술 스택

Front End


  • Framework
이름 내용
리액트 ~~~~ 에 사용
리액트 훅스 ~~~~ 에 사용


  • Library
이름 내용
axios ~~~~ 에 사용
styled_componets ~~~~ 에 사용


  • Tools
스크린샷 2020-03-09 오후 5 33 39
이름 내용
figma ~~~~ 에 사용
  • Deploy
스크린샷 2020-03-09 오후 5 33 39 스크린샷 2020-03-09 오후 5 33 39
이름 내용
AWS S3 ~~~~ 에 사용
AWS ROUTE 53 ~~~~ 에 사용

Back End

  • Framework
이름 내용
Node js 비동기 활용 퍼포먼스 증가 목적
Express 라우팅, Node js 효율적인 사용 목적


  • Database
이름 사용 이유
Mysql 무료로 사용가능하기 때문
Mysql 널리 알려진 표준 SQL 형식을 사용


  • Library
스크린샷 2020-03-09 오후 5 33 39 스크린샷 2020-03-09 오후 5 33 39 스크린샷 2020-03-09 오후 5 33 39
이름 내용
Sequelize database 관계 설정, ORM형식으로 DB CRUD 목적
Multer S3 레시피 이미지 S3 이미지 버켓에 저장목적
crypto 유저 비밀번호 암호화 저장 목적


  • Deploy
스크린샷 2020-03-09 오후 5 33 39 스크린샷 2020-03-09 오후 5 33 39 스크린샷 2020-03-09 오후 5 33 39 스크린샷 2020-03-09 오후 5 33 39
이름 내용
AWS S3 이미지 전용 버킷 / 레시피, 유저 아바타 사진 관리 목적
AWS ROUTE 53 Homemade 도메인 연결 목적
AWS EC2 배포용 Server
AWS RDS 배포용 DB / 데이터베이스 저장 목적


  • Tools
스크린샷 2020-03-09 오후 5 33 39 스크린샷 2020-03-09 오후 5 33 39 스크린샷 2020-03-09 오후 5 33 39
이름 내용
gitbook API 문서 작성 목적
dbdiagram 스키마 테이블 기획, 관계구성 표현 목적



Clone this wiki locally