⭐ 23 # 별이삼샵 (SSAFY 9기 부울경 E106)

⭐ 23 #

내 마음을 전달해주는 익명의 러브레터 💌

📅 기간

• 2023.10.10 ~ 2023.11.17(7주)

🔎 목차

1. 🎯 기획 배경
2. ⭐️ 주요 기능
3. ⚙️ 시스템 아키텍쳐
4. 🛠️ 기술 스택
5. 🗂️ 파일 구조
6. 💾 ERD
7. 🖥️ 화면 소개
8. 👥 팀원 소개
9. 💡 업무

🎯 기획 배경

별이삼샵

기획배경
기억나니 그때 그 시절..? 전하지 못한 진심을 익명의 힘을 담아 전달할 수 있는 익명 편지 전달 플랫폼

⭐️ 주요 기능

다른 사람에게 익명의 편지 보내기

• 다른 사람의 전화번호를 불러온다.
• 전화번호를 입력하고 내용을 쓰면 익명의 편지를 보낼 수 있다.
• 편지에 나에 대한 힌트를 담아서 보낼 수 있다.

모바일 : 플러터를 사용해서 전화번호 목록을 불러오고 서비스 사용자만 추려서 제공해준다.

웹 : 직접 전화번호를 입력한다.

---

랜덤 쪽지 보내기

• 본인을 제외한 사람들 중 랜덤으로 선정해서 쪽지를 보낸다.
• 닉네임은 형용사 + 동물 명사로 랜덤 난수 로직을 적용한다.

---

우주 롤링페이퍼

• 본인의 우주 롤링페이퍼 링크를 생성한다.
• 생성된 링크는 회원, 비회원 모든 사람에게 링크 공유 및 카카오 공유가 가능하다.
• 모든 사람은 우주 롤링페이퍼에서 우주인 캐릭터를 선택하고 익명의 글귀를 남길 수 있다.

목차로 이동

⚙️ 시스템 아키텍쳐

목차로 이동

🛠️ 기술 스택

프론트

---

백엔드

---

협업

목차로 이동

🗂️ 파일 구조

프론트

자세히

📦front
 ┣ 📂node_modules
 ┣ 📂public
 ┃ ┣ 📂assets
 ┃ ┃ ┣ 📂astronaut
 ┃ ┃ ┣ 📂character
 ┃ ┃ ┣ 📂glb
 ┃ ┃ ┗ 📂📂planet
 ┃ ┣ 📂fonts
 ┃ ┣ 📂icons
 ┃ ┃ ┗ 📂📂planets
 ┃ ┣ 📂link
 ┃ ┣ 📂main
 ┃ ┣ 📂write
 ┣ 📂src
 ┃ ┣ 📂app
 ┃ ┃ ┣ 📂auth
 ┃ ┃ ┃ ┣ 📂loginPassword
 ┃ ┃ ┃ ┣ 📂regist
 ┃ ┃ ┃ ┗ 📂registpass
 ┃ ┃ ┣ 📂error
 ┃ ┃ ┣ 📂main
 ┃ ┃ ┣ 📂pullfriend
 ┃ ┃ ┣ 📂storage
 ┃ ┃ ┃ ┣ 📂friend
 ┃ ┃ ┃ ┃ ┗ 📂[letter]
 ┃ ┃ ┃ ┣ 📂random
 ┃ ┃ ┃ ┃ ┣ 📂[history]
 ┃ ┃ ┃ ┃ ┃ ┗ 📂[reply]
 ┃ ┃ ┣ 📂today
 ┃ ┃ ┃ ┣ 📂arrive
 ┃ ┃ ┃ ┣ 📂delivery
 ┃ ┃ ┃ ┗ 📂storage
 ┃ ┃ ┃ ┃ ┣ 📂friend
 ┃ ┃ ┃ ┃ ┣ 📂Link
 ┃ ┃ ┃ ┃ ┃ ┗ 📂[slug]
 ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂write
 ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂[id]
 ┃ ┃ ┃ ┃ ┗ 📂Random
 ┃ ┃ ┣ 📂types
 ┃ ┃ ┃ ┗ 📂storage
 ┃ ┃ ┣ 📂utils
 ┃ ┃ ┃ ┣ 📂main
 ┃ ┃ ┃ ┣ 📂sms
 ┃ ┃ ┃ ┣ 📂storage
 ┃ ┃ ┃ ┣ 📂todayStorage
 ┃ ┃ ┃ ┃ ┣ 📂friend
 ┃ ┃ ┃ ┃ ┣ 📂link
 ┃ ┃ ┃ ┃ ┗ 📂random
 ┃ ┃ ┃ ┗ 📂write
 ┃ ┃ ┗ 📂write
 ┃ ┃ ┃ ┣ 📂send
 ┃ ┃ ┃ ┃ ┗ 📂component
 ┃ ┃ ┃ ┣ 📂wfriend
 ┃ ┃ ┃ ┃ ┣ 📂getfriend
 ┃ ┃ ┃ ┃ ┣ 📂input
 ┃ ┃ ┃ ┃ ┗ 📂searchfriend
 ┃ ┃ ┃ ┗ 📂wrandom
 ┃ ┣ 📂component
 ┃ ┃ ┣ 📂arrive
 ┃ ┃ ┣ 📂axes
 ┃ ┃ ┣ 📂common
 ┃ ┃ ┃ ┣ 📂kakaoShareButton
 ┃ ┃ ┃ ┗ 📂write_layout
 ┃ ┃ ┣ 📂login
 ┃ ┃ ┣ 📂main
 ┃ ┃ ┣ 📂storage
 ┃ ┃ ┃ ┣ 📂friend
 ┃ ┃ ┃ ┗ 📂random
 ┃ ┃ ┣ 📂Three
 ┃ ┃ ┣ 📂today
 ┃ ┃ ┃ ┗ 📂todayStorage
 ┃ ┃ ┃ ┃ ┣ 📂checkPosition
 ┃ ┃ ┃ ┃ ┣ 📂friend
 ┃ ┃ ┃ ┃ ┃ ┗ 📂astronautModel
 ┃ ┃ ┃ ┃ ┣ 📂light
 ┃ ┃ ┃ ┃ ┣ 📂link
 ┃ ┃ ┃ ┃ ┃ ┣ 📂astronautModel
 ┃ ┃ ┃ ┃ ┃ ┣ 📂planetModel
 ┃ ┃ ┃ ┃ ┃ ┣ 📂shareButton
 ┃ ┃ ┃ ┃ ┃ ┣ 📂ufoModel
 ┃ ┃ ┃ ┃ ┃ ┗ 📂writeButton
 ┃ ┃ ┃ ┃ ┗ 📂random
 ┃ ┃ ┃ ┃ ┃ ┣ 📂planetModel
 ┃ ┃ ┃ ┃ ┃ ┣ 📂randomPlanet
 ┃ ┃ ┃ ┃ ┃ ┗ 📂rocketModel
 ┃ ┃ ┗ 📂write
 ┃ ┗ 📂store
 ┣ 📜.gitignore
 ┣ 📜.env
 ┣ 📜.eslintrc.json
 ┣ 📜.prettierrc
 ┣ 📜Dockerfile
 ┣ 📜next.config.js
 ┣ 📜next-env.d.ts
 ┣ 📜package-lock.json
 ┣ 📜postcss.config.js
 ┣ 📜README.md
 ┣ 📜tailwind.config.js
 ┣ 📜yarn.lock
 ┗ 📜tsconfig.json

백엔드

자세히

📦back
 ┣ 📂eureka
 ┃ ┣ 📂gradle
 ┃ ┣ 📂src
 ┃ ┃ ┣ 📂main
 ┃ ┃ ┃ ┗ 📂java
 ┃ ┃ ┃ ┃ ┗ 📂com
 ┃ ┃ ┃ ┃ ┃ ┗ 📂eureka
 ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂eureka
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂elasticsearch
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂emotion
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂exception
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂jwt
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂kafka
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂member
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂recommend
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂response
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂search
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂statistic
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂swagger
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂transaction
 ┃ ┃ ┗ 📂test
 ┣ 📂gateway
 ┃ ┣ 📂gradle
 ┃ ┣ 📂src
 ┃ ┃ ┣ 📂main
 ┃ ┃ ┃ ┗ 📂java
 ┃ ┃ ┃ ┃ ┗ 📂com
 ┃ ┃ ┃ ┃ ┃ ┗ 📂letter
 ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂gateway
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂config
 ┃ ┃ ┗ 📂test
 ┣ 📂auth-service
 ┃ ┣ 📂gradle
 ┃ ┣ 📂src
 ┃ ┃ ┣ 📂main
 ┃ ┃ ┃ ┗ 📂java
 ┃ ┃ ┃ ┃ ┗ 📂com
 ┃ ┃ ┃ ┃ ┃ ┗ 📂letter
 ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂auth-service
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂emotion
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂exception
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂jwt
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂config
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂member
 ┃ ┃ ┗ 📂test
 ┣ 📂letter-service
 ┃ ┣ 📂gradle
 ┃ ┣ 📂src
 ┃ ┃ ┣ 📂main
 ┃ ┃ ┃ ┗ 📂java
 ┃ ┃ ┃ ┃ ┗ 📂com
 ┃ ┃ ┃ ┃ ┃ ┗ 📂letter
 ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂letter-service
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂emotion
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂exception
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂letter
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂config
 ┃ ┃ ┗ 📂test
 ┣ 📂note-service
 ┃ ┣ 📂gradle
 ┃ ┣ 📂src
 ┃ ┃ ┣ 📂main
 ┃ ┃ ┃ ┗ 📂java
 ┃ ┃ ┃ ┃ ┗ 📂com
 ┃ ┃ ┃ ┃ ┃ ┗ 📂letter
 ┃ ┃ ┃ ┃ ┃ ┃ ┗ 📂note-service
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂emotion
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂exception
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂note
 ┃ ┃ ┃ ┃ ┃ ┃ ┃ ┣ 📂config
 ┃ ┃ ┗ 📂test
📂elastic
 ┣ 📂elasticsearch
 ┃ ┣ 📂data
 ┃ ┃ ┗ 📂nodes
 ┣ 📂kibana
 ┣ 📂logstash
 ┃ ┣ 📂drivers
 ┃ ┣ 📂pipeline
 ┗ 📜docker-compose-elastic.yml
 📂conf
 ┗ nginx.config
📜docker-compose.yml
📜docker-compose-nginx.yml

목차로 이동

💾 ERD

목차로 이동

🖥️ 화면 소개

1. 로그인 페이지

2. 메인 페이지

3. 편지작성 페이지

4. 카카오톡 링크전송

5. 보관함

6. 오늘 온 편지함

🖥️ 기술

1. Spring Cloud MSA

2. Elastic Stack 모니터링

3. Three.js를 이용한 인터렉티브한 화면

👥 팀원 소개

Name	조병철	권은정	김예슬	조은정	이승민	최진석
Profile
Position	Leader Frontend	Frontend	Frontend	Frontend	Backend	Backend
Git	GitHub	GitHub	GitHub	GitHub	GitHub Blog	GitHub

목차로 이동

💡 업무 분장

FrontEnd

• 조병철 :
  기획 단계 팀원 의견 조율
  프론트엔트 협업 툴 적응 보조
  프론트엔드 git 관리
  사용자 메시지 보관함 (친구/랜덤) 페이지 작성 및 기능구현
  JWT토큰 적용된 http 통신 컴포넌트 작성
• 권은정 :
  로그인
  회원가입
  메인페이지
  전송중, 전송완료 페이지
• 김예슬 :
  three.js를 이용한 오늘의 보관함 페이지
  롤링페이퍼 url 복사 및 카카오톡 공유 기능
  롤링페이퍼 작성 및 읽기 페이지
  프론트엔드 개발환경 설정
• 조은정 :
  글 작성 페이지 제작
  flutter를 이용한 인앱웹뷰 apk 형태 제공
  

BackEnd

• 이승민 : spring boot api 개발, Spring Cloud MSA 백엔드 서버 구축, ELk Stack을 활용한 MSA 서버 모니터링 구축
• 최진석 : spring boot api 개발, CoolSMS 문자, CI/CD

목차로 이동