Summary | Notion

프로젝트주제및선정배경

프로젝트 명 : 금나와라 뚝딱!
프로젝트 주제
- 이 프로젝트는 번호교환 없이 다른 사람들에게 여러가지 선물을 주기 위해서 만들어졌습니다. 단순히 선물을 지목한 사람에게 주는 형식이 아니라, ‘랜덤’ 또는 ‘선착순’의 방식을 통해 게임처럼 재미있게 선물을 나눌 수 있는 서비스입니다.
프로젝트 선정 배경
- KDT 과정을 진행하면서 특정 이벤트에 당첨된 당첨자에게 커피 쿠폰을 전달하는 상황에서 항상 상대방의 핸드폰 번호를 알아야만 전달을 할 수 있는 문제를 인식함.
- 이러한 불편함을 없애고 선물을 조금 더 편하고, 조금 더 재미있게 전달하면 어떨까? 라는 물음에서 시작하여 해당 프로젝트를 선정함.

프로젝트 개요

프로젝트 구현 내용
- 사용자는 소셜로그인을 통해 간단하게 서비스에 가입할 수 있다.
- 이벤트 등록을 통해 선물의 종류, 개수, 이벤트 오픈 및 종료 시간 등을 자유롭게 설정할 수 있다.
- 이벤트가 생성되면 사용자에게는 링크가 주어지고, 링크를 전달받은 사람은 해당 선물을 랜덤 또는 선착순 형식으로 수령하게 된다.
- 수령한 선물은 마이페이지에서 다시 확인할 수 있으며, 선물을 저장하여 개인 소장할 수 있다.
- 모든 선물이 소진되거나 이벤트 종료시간이 경과되어 이벤트가 종료되면 사용자는 해당 이벤트의 당첨자 목록을 확인할 수 있게된다.
컨셉
- 크리스마스 컨셉의 이벤트 서비스
훈련내용과 관련성
- 백엔드
  - Java/Spring을 이용하여 백엔드 API 서버를 만들고 클라우드 환경(AWS EC2)에 배포
  - 파일 업로드 및 저장을 위해 AWS S3를 사용
  - DB는 테스트 환경에서 h2를 사용하고 배포 환경에서는 MySql을 사용
  - Jira를 활용한 이슈, 스프린트 등 프로젝트 관리
  - 협업과 버전 관리를 위한 Git&Github을 사용
  - Notion을 통한 문서화 작업
  - Github Action 와 Docker를 이용한 CI/CD 구현
  - Oauth2를 이용한 카카오 로그인 구현
- 프론트엔드
  - TypsScript/React를 활용한 서비스 개발
  - Netlify 배포
  - Next.JS 프레임워크 활용
  - Context-API 상태관리 라이브러리 활용
  - Jira를 활용한 이슈, 스프린트 등 프로젝트 관리
  - 협업과 버전 관리를 위한 Git&Github을 사용
  - Notion을 통한 문서화 작업
  - 해당 프로젝트는 훈련 과정에서 습득한 지식을 100% 활용하여 개발함.

활용 장비 및 재료

공통
- 협업: git, github, jira, notion, slack
백엔드
- Java
- Gradle
- Spring
- MySQL
- S3
- OAuth2.0
- Jira
- Github Submodule
- Swagger
- Docker
- AWS
프론트엔드
- Node.js
- Typescript
- React
- Next.js
- Emotion
- Eslint
- Prettier
- Storybook
- Netlify
- postman
- figma

프로젝트 구조

백엔드

프론트엔드

.
├── README.md
├── craco.config.js
├── next-dev.d.ts
├── next-env.d.ts
├── next.config.js
├── package.json
├── pages
│   ├── 404.tsx
│   ├── _app.tsx
│   ├── api
│   │   ├── event.ts
│   │   ├── gift.ts
│   │   ├── hello.ts
│   │   ├── post.ts
│   │   ├── services
│   │   ├── user.ts
│   │   └── utils
│   ├── event
│   ├── fifo
│   ├── gift
│   ├── index.tsx
│   ├── login.tsx
│   ├── mypage.tsx
│   ├── oauth
│   ├── post.tsx
│   └── random
├── public
│   ├── templates
│   └── video
├── src
│   ├── assets
│   ├── components
│   │   ├── Checkbox
│   │   ├── Icon
│   │   ├── Image
│   │   ├── Input
│   │   ├── Logo
│   │   ├── MUIAvatar
│   │   ├── MUIButton
│   │   ├── MUISwitch
│   │   ├── MUITab
│   │   ├── Modal
│   │   ├── Spinner
│   │   ├── Swalert
│   │   ├── Text
│   │   ├── Textarea
│   │   ├── Timer
│   │   └── Upload
│   ├── contexts
│   ├── domains
│   │   ├── CardFlip
│   │   ├── CheckboxList
│   │   ├── EventComplete
│   │   ├── EventDetail
│   │   ├── EventList
│   │   ├── EventPresent
│   │   ├── EventStateChecker
│   │   ├── EventTimer
│   │   ├── EventTitle
│   │   ├── EventType
│   │   ├── GiftItem
│   │   ├── GiftList.tsx
│   │   ├── Header
│   │   ├── TextLabel
│   │   └── TimerHeader
│   ├── hooks
│   │   ├── useDebounce.ts
│   │   ├── useInfiniteScroll.tsx
│   │   ├── useInterval.ts
│   │   ├── useIntervalFn.ts
│   │   ├── useLocalStorage.tsx
│   │   └── useTimeoutFn.ts
│   ├── stories
│   │   ├── components
│   │   └── domain
│   ├── types
│   │   ├── event.d.ts
│   │   └── gift.d.ts
│   └── utils
│       ├── constants
│       └── formatTimeNumber.ts
├── styles
├── tsconfig.extend.json
├── tsconfig.json
└── yarn.lock

프로젝트주제및선정배경

프로젝트 개요

활용 장비 및 재료

프로젝트 구조

기대효과