Home
- 이 프로젝트는 코로나로 인한 사회적거리두기/비대면 업무가 증가함에 따라 집에서 보내는 시간이 늘어남으로서 직접 요리를 만들어 먹는 수요가 증가 할 것으로 판단되어 레시피 공유 플랫폼을 구상하게 되었습니다. 회원 가입을 통해 레시피를 등록하고 공유 할 수 있으며, 다른사람의 레시피에 평점을 주거나 댓글을 작성 하여 소통할 수 있습니다. 또한 메인 화면에서 금주의 인기 레시피를 선별적으로 보여줌으로서 타인으로 부터 좋은 평가를 받은 음식의 레시피를 노출시켜 맛있는 음식을 공유 할 수있습니다.
GIT HUB repository
| 구별 | 저장소 링크 |
|---|---|
| Client | Client repository |
| Server | Server repository |
PROJECT Information
| 구별 | 저장소 링크 |
|---|---|
| Project Link | Project Link (Our Website) |
| Project Info | Project Info (Information) |
Front End : 김남인, 김지운
| 이름 | 담당 | 설명 |
|---|---|---|
| 김남인 | UX/UI, 디자인, recipe 상태관리 | recipe list, recipe 등록, 메인화면 구성 |
| 김지운 | UX/UI, 디자인, 유저 상태관리 | 유저 회원가입, 로그인 , 회원정보 변경 화면 구성 |
Back End : 김용재, 송정현
| 이름 | 담당 | 설명 |
|---|---|---|
| 김용재 | 유저정보 API, 배포 | AWS 서비스들을 이용한 배포, 유저 정보 암호화, 토큰 인증 |
| 송정현 | 레시피정보 API, 데이터 | multer를 이용한 S3버킷 이미지 업로드, DB생성 및 관리 |
- 메인화면에서 확인 할 수 있는 정보 : 최근 등록된 레시피, 이번달 최고의 레시피, 금주의 탑 4 레시피
- 메인화면에서 사용할 수 있는 기능 : 카테고리별 레시피 목록 page이동, 검색어별 레시피 목록 page이동, 회원정보 버튼, 회원가입 버튼
1 . 최근등록된 레시피 확인
2 . 이번달 최고의 레시피
3 . 금주의 탑 4레시피
- 사용자의 잘못된입력(email 형식, passord 8자이상, 전화번호 형식)을 유효성 검사를 통해 예외처리함.
- 프로필등록 / 변경 , 비밀번호 변경, 전화번호 변경, 회원탈퇴기능
- 유저가 등록한 recipe list 확인 , carousel로 화면 recipe list 전환기능, recipe 클릭시 recipe 상세 page전환
- 레시피 정보 작성 , 순서(step)별 이미지 & 설명 등록 , 필수입력사항 미입력시 예외처리
- 유저가 레시피를 등록할때 카테고리를 정할 수 있으며, 검색은 제목의 필터링을 통해 레시피를 검색한다
| 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 문서
| 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 |
| DELETE | API명 | 설명 | 엔드포인트 |
|---|---|---|---|
| DELETE | delete user | 회원 탈퇴 | users/duser |
| DELETE | delete content | 레시피 글 삭제 | recipes/dcontent |
| DELETE | delete comment | 레시피 댓글 삭제 | recipes/dcomment |
- Framework
| 이름 | 내용 |
|---|---|
| 리액트 | 컴포넌트기반으로 재사용성이 용이, 컴포넌트별 상태관리가 용이 |
| hooks | 상태관리 코드의 단순화, 컴포넌트간 데이터 공유시 편의성 |
- Library
| 이름 | 내용 |
|---|---|
| axios | 서버 비동기 통신 |
| styled_componets | javascript 파일 내에서 CSS를 사용하여 별도의 CSS 파일 생성 불필요, 스타일컴포넌트에 props를 전달수있다 |
- Tools
| 이름 | 내용 |
|---|---|
| figma | 시스템아키텍쳐 설계 |
| git | 버전관리 |
| ESlint | 협업간 코드style의 통일 목적 |
| prettier | 협업간 코드style의 통일 목적 (airbnb) |
- Deploy
|:---:|:---:| |AWS S3 | 클라이언트 HTTPS 배포 목적 | |AWS Route 53|Homemade 서버 도메인 연결 목적| |AWS Cloudfront| SSL 등록, 캐싱을 통한 빠른 데이터 전송속도 제공 목적|
- Framework
| 이름 | 내용 |
|---|---|
| Node js | 비동기 활용 퍼포먼스 증가 목적 |
| Express | 라우팅, Node js 효율적인 사용 목적 |
- Database
| 이름 | 사용 이유 |
|---|---|
| Mysql | 무료로 사용가능하기 때문 |
| Mysql | 널리 알려진 표준 SQL 형식을 사용 |
- Library
| 이름 | 내용 |
|---|---|
| Sequelize | database 관계 설정, ORM형식으로 DB CRUD 목적 |
| Multer S3 | 레시피 이미지 S3 이미지 버켓에 저장목적 |
| crypto | 유저 비밀번호 암호화 저장 목적 |
- Deploy
| 이름 | 내용 |
|---|---|
| AWS S3 | 이미지 전용 버킷 / 레시피, 유저 아바타 사진 관리 목적 |
| AWS EC2 | 가상 서버를 구축, 보안 및 네트워크 구성, 스토리지 관리 목적 |
| AWS RDS | 배포용 DB / 데이터베이스 저장 목적 |
| AWS ROUTE 53 | Homemade 서버 도메인 연결 목적 |
| AWS ELB | 네트워크 트래픽 분산을 통한 애플리케이션 확장성 개선 목적 |
| AWS certificate manager | HTTPS 제공, 보안 콘텐츠 제공 목적 |
| PM2 | NodeJS 프로세서 관리, 무중단 서비스 운영 목적 |
- Tools
| 이름 | 내용 |
|---|---|
| gitbook | API 문서 작성 목적 |
| dbdiagram | 스키마 테이블 기획, 관계구성 표현 목적 |
| postman | API 작동 테스트 목적 |
| git | 버전관리 |
| ESlint | 협업간 코드style의 통일 목적 |
| prettier | 협업간 코드style의 통일 목적 (airbnb) |