- Rice coco๋ ๋ด ์ฃผ๋ณ ์ต๋ช ์ ์ฌ๋๋ค๊ณผ์ ์์ฌ ์ฝ์ ๊ธฐ๋ฅ์ ์ ๊ณตํ๋, ์์น๊ธฐ๋ฐ ์ค์๊ฐ ์์ ๋คํธ์ํฌ ์ฑ ์๋น์ค์ ๋๋ค.
- Rice coco๋ Rice์ ๋๋ฃ๋ฅผ ์๋ฏธํ๋ co์ ํฉ์ฑ์ด ์ ๋๋ค.
- ๋ณธ ํ๋ก์ ํธ๋ ์ด 3์ฃผ๊ฐ(1์ฃผ-Idea Brainstorming & Planning, 2์ฃผ-Development) 3๋ช ์ ์ธ์(์ด๋๊ท, ์ด์ค์, ๊น์ฐฌ์ค)์ด ์งํํ์์ต๋๋ค.(์ด๋๊ท ํ์์ ์ทจ์ ์ผ๋ก ์ธํด 2์ฃผ์ฐจ์ ์ค๋ ํ์ฐจ ํ์์ต๋๋ค.)
- ์์ฐ ์์(ํ๋ก์ ํธ ๋ฐํ ไธญ)
- Features
- Tech Stack
- Requirements
- Installation
- Deploy
- How to use
- Project Process
- Collaboration principle
- Challenges
- Things to do
- Expo Facebook & JWT ํ ํฐ์ ์ด์ฉํ ๋ก๊ทธ์ธ ๊ตฌํ
- ์ํ๋ ์๋ ์กฐ๊ฑด ์ค์ ๋ฐ ํํฐ๋ง ๊ธฐ๋ฅ ๊ตฌํ
- Google Map Marker๋ฅผ ์ด์ฉํ ๋ด ์์น ๋ฐ๊ฒฝ 3km ๋ด ๋๊ธฐ์ค์ธ ๋ฏธํ ํ์ ๊ฐ๋ฅ
- Google Place API๋ฅผ ์ด์ฉํ ๋ฐ๊ฒฝ 3km ๋ด ์์์ ๊ฒ์ ๊ธฐ๋ฅ
- Socket.io๋ฅผ ํตํ ์ ํํ ์์์ ์์ ์ํ๋ ์กฐ๊ฑด์ ์๋๋ฐฉ ์ค์๊ฐ ๋๊ธฐ ๊ธฐ๋ฅ
- ๋๊ธฐ๋ฐฉ ์์ฑ ํ 1์๊ฐ ๋์ ์๋๋ฐฉ๊ณผ์ ๋ฏธํ ์ด ์ฑ์ฌ๋์ง ์์ ๊ฒฝ์ฐ, ๋ฐฉ์ด ์ญ์ ๋๋ ํ์์์ ๊ธฐ๋ฅ
- ๋งค์นญ ์ฑ์ฌ ํ, ์ค์๊ฐ์ผ๋ก ์๋๋ฐฉ์ ์์น ํ์ธ ๋ฐ ์ฑํ ๊ธฐ๋ฅ
- ๋งค์นญ ์ข ๋ฃ ํ, ์น๊ตฌ ์ถ๊ฐ ๊ธฐ๋ฅ
- IAMPORT๋ฅผ ์ด์ฉํ ํฌ์ธํธ ๊ฒฐ์ ๊ธฐ๋ฅ
- ๋ด์ ๋ณด ์์ ๋ฐ ๋ก๊ทธ์์ ๊ธฐ๋ฅ
- ES2015+
- React Native for component-based-architecture
- Redux for state management
- Styled Component
- Socket.io for real-time communication
- Jest for unit-test
- Enzyme for component-test
- Node.js
- Express
- MongoDB / MongoDB Atlas for data persistence
- Moongoose
- JSON Web Token Authentication
- Socket.io
- Chai / Sinon for unit-test
- Android ํ๊ฒฝ์์ ์ฌ์ฉ์ด ๊ฐ๋ฅํฉ๋๋ค.
Local ํ๊ฒฝ์์ ์คํ์ ์ํด ํ๊ฒฝ ๋ณ์ ์ค์ ์ด ํ์ํฉ๋๋ค.
Root ๋๋ ํ ๋ฆฌ์ environment.jsํ์ผ์ ์์ฑ ํ ์๋์ ๊ฐ์ด ํ๊ฒฝ๋ณ์ ๊ฐ์ ์ ๋ ฅํฉ๋๋ค.
// in environment.js in Root directory
import Constants from 'expo-constants';
const ENV = {
dev: {
REACT_NATIVE_ANDROID_SERVER_BASE_URL: <YOUR_SERVER_BASE_URL>
REACT_NATIVE_GOOGLE_PLACES_API_KEY: <YOUR_GOOGLE_PLACES_API_KEY>
REACT_NATIVE_FACEBOOK_APP_ID: <YOUR_FACEBOOK_API_ID>,
},
staging: {
REACT_NATIVE_ANDROID_SERVER_BASE_URL: http://api.rice-coco.life,
REACT_NATIVE_GOOGLE_PLACES_API_KEY: <YOUR_GOOGLE_PLACES_API_KEY>,
REACT_NATIVE_FACEBOOK_APP_ID: <YOUR_FACEBOOK_API_ID>',
},
};
const getEnvVars = (env = Constants.manifest.releaseChannel) => {
if (__DEV__) {
return ENV.dev;
} else if (env === 'staging') {
return ENV.staging;
}
};
export default getEnvVars;
git clone https://github.com/daechidongVibe/Rice-coco-frontend.git
cd Rice-coco-frontend
npm install
npm start
Root ๋๋ ํ ๋ฆฌ์ .envํ์ผ์ ์์ฑ ํ ์๋์ ๊ฐ์ด ํ๊ฒฝ๋ณ์ ๊ฐ์ ์ ๋ ฅํฉ๋๋ค.
// in .env in your directory
PORT=<YOUR_PORT_NUMBER>
DB_URL=<YOUR_MONGODB_URL>
JWT_SECRET=<YOUR_JWT_SECRET>
IAMPORT_KEY=<YOUR_IAMPORT_KEY>
IAMPORT_SECRET=<YOUR_IAMPORT_SECRET>
git clone https://github.com/daechidongVibe/Rice-coco-backend.git
cd Rice-coco-backend
npm install
npm run dev
- AWS Elastic Beanstalk (EB)
- AWS Code Pipeline for Deployment automation
- Facebook ์์ ๋ก๊ทธ์ธ ํ, ์ฌ์ฉ์๋ 5๊ฐ์ ํฌ์ธํธ๊ฐ ๋ถ์ฌ๋ฉ๋๋ค.
- ๋ง๋จ์ ํฌ๋งํ๊ณ ์ํ๋ ์๋๋ฐฉ์ ์ง์ ๊ตฐ, ๋์ด, ์ฑ๋ณ์ ์ค์ ์ ํตํด ํํฐ๋ง์ ํ ์ ์์ต๋๋ค.(์ฌ์ฉ์๋ ๋ง์ฐฌ๊ฐ์ง๋ก ์๋๋ฐฉ์ ์กฐ๊ฑด์ ๋ฐ๋ผ ํํฐ๋ง ๋ฉ๋๋ค.)
- ์ค์ ์๋ฃ ํ, ๋ด ์์น ๊ธฐ์ค ์ฃผ๋ณ 3km ์ด๋ด์ ํํฐ๋ง๋ ์ ์ ๋ค์ด ์ ์ฒญํด๋์ ์์์ ๋ค์ ์์น๊ฐ ๋ฐฅ ๋ชจ์์ผ๋ก ํ์๋ฉ๋๋ค.
- ์ง๋ ์ฐ์ธก ํ๋จ์ ์๋ก๊ณ ์นจ์ ๋ฒํผ์ ๋๋ฅด๋ฉด, ํด๋น ์์ ์ ๊ธฐ์ค์ผ๋ก ์ ์ฒญ๋์ด์๋ ์์์ ๋ค์ด ์ ๋ฐ์ดํธ ๋ฉ๋๋ค.
- ํด๋น ์์์ (๋ฐฅ ๋ชจ์)์ ํด๋ฆญํ๋ฉด ์์์ ์ ๋ํ ๊ฐ๋ตํ ์ค๋ช ๊ณผ ๋๊ธฐ ์ค์ธ ์๋๋ฐฉ์ ๋๋ค์์ ํ์ธ ํ ์ ์์ต๋๋ค
- [๋ผ์ด์ค์ฝ์ฝ ๋ง๋๋ฌ๊ฐ๊ธฐ] ๋ฒํผ์ ๋๋ฅด๋ฉด ๋งค์นญ์ด ์ฑ์ฌ๋๊ณ ์ด ๋ ํฌ์ธํธ 1๊ฐ๊ฐ ๊ฐ์๋ฉ๋๋ค.
- ํญ ์ค์์ Search ๋ฒํผ์ ํด๋ฆญํ๋ฉด, ๋ด ์ฃผ๋ณ 3km ์ด๋ด์ ์์์ ์ ๊ฒ์ํ์ฌ ํด๋น ์์์ ์์์ ๋ง๋จ์ ์ ์ฒญ ํ ์ ์์ต๋๋ค. ๋ง๋จ์ ์ ์ฒญํ ๊ฒฝ์ฐ, ํฌ์ธํธ๊ฐ 1๊ฐ ๊ฐ์ํฉ๋๋ค.
- (๋๊ธฐ์๊ฐ ์์ ๊ฒฝ์ฐ) ๊ฒ์ํ ์์์ ์ ๋๊ธฐ์๊ฐ ์์ ๊ฒฝ์ฐ, ๋๊ธฐ์์์ ๋งค์นญ ์๋ฝ ์ฌ๋ถ๋ฅผ ํ์ธํ๊ฒ ๋๊ณ ์๋ฝ ์ฆ์ ๋งค์นญ์ด ์ฑ์ฌ๋ฉ๋๋ค.
- (๋๊ธฐ์๊ฐ ์์ ๊ฒฝ์ฐ) ๋ง๋จ ์ ์ฒญ ํ 1์๊ฐ ๋์ ํ์์์์ด ์คํ๋๊ณ ์ต๋ช ์ ์๋๋ฐฉ์ผ๋ก๋ถํฐ ์๋ฝ์ ๋ฐ์ผ๋ฉด, ์ฆ์ ๋งค์นญ์ด ์ฑ์ฌ๋ฉ๋๋ค. ์๊ฐ ๋ด์ ์๋ฝ์ ๋ฐ์ง ๋ชปํ ๊ฒฝ์ฐ์๋ ๋ฐ๋ก ์ข ๋ฃ๋ฉ๋๋ค.
- ๋งค์นญ์ด ์ฑ์ฌ๋๋ฉด, ์ค์๊ฐ์ผ๋ก ์๋ก์ ์์น๊ฐ ๋งต์ ํ์๋๊ณ 30๋ถ์ ํ์์์์ด ์ค์ ๋ฉ๋๋ค.
- ์ฐ์ธก ํ๋จ์ ๋ํ ๋ฒํผ์ ํด๋ฆญํ๋ฉด ์๋๋ฐฉ๊ณผ ์ค์๊ฐ์ผ๋ก ๋ํํ ์ ์๋ ์ฑํ ๋ฐฉ์ด ์ด๋ฆฝ๋๋ค.
- ์๊ฐ ์์ ์์์ 50m ๋ฐ๊ฒฝ ์ด๋ด์ ๋์ฐฉํ๋ฉด [๋์ฐฉ ๋ฒํผ]์ด ์์ฑ๋๊ณ , ๋ฒํผ์ ๋๋ฅด๋ฉด ํฌ์ธํธ๊ฐ 1๊ฐ ์ฆ๊ฐํ๊ฒ ๋ฉ๋๋ค.
- ์์๊ฐ ๋์ฐฉ ๋ฒํผ์ ๋๋ฅธ ์ํฉ์์ ํ์์์์ด ์ข ๋ฃ๋๋ฉด, ์๋๋ฐฉ์ ์น๊ตฌ๋ก ์ถ๊ฐํ ๊ฒ์ธ์ง์ ๋ํ ์ง๋ฌธ์ฐฝ์ด ๋์ค๊ณ ,์ถ๊ฐํ๋ฉด ์๋๋ฐฉ์ ์น๊ตฌ๋ก ๋ฑ๋กํ ์ ์์ต๋๋ค.
- ๋ด ์ ๋ณด ์ฐฝ์์ ๋์ ๋๋ค์๊ณผ ์ง์ ์ ๋ค์ ์ค์ ํ ์ ์๊ณ , ์ ํธํ๋ ์๋๋ฐฉ์ ์กฐ๊ฑด์ ์ฌ์ค์ ํ ์ ์์ต๋๋ค. ๋ฉ์ธ ์ง๋์๋ ํด๋น ์ฌ์ค์ ํ ์กฐ๊ฑด์ ๊ธฐ์ค์ผ๋ก ํํฐ๋ง๋ฉ๋๋ค.
- ํฌ์ธํธ๊ฐ 0๊ฐ๊ฐ ๋๋ฉด ๋ ์ด์ ๋ง๋จ์ ์์ฑํ๊ฑฐ๋ ๋ง๋จ์ ์ฐธ์ฌํ ์ ์๊ฒ ๋ฉ๋๋ค. ๋ง์ดํ์ด์ง ๊ฒฐ์ ์ ๋ณด์ฐฝ์ ํตํด ํฌ์ธํธ๋ฅผ ๊ตฌ๋งคํ ์ ์์ต๋๋ค.(ํ์ฌ๋ ๋ค์ด๋ฒํ์ด๋ง ์ง์๋ฉ๋๋ค.)
- ์์ด๋์ด ๊ฒฐ์ + ๊ธฐ์ ์คํ ๊ฒํ
- Figma๋ฅผ ํตํ Mockup ์์
- LucidChart๋ฅผ ํ์ฉํ Database Schema Modeling
- Notion Todo๋ฅผ ํ์ฉํ Task Management
- Git์ ์ด์ฉํ Version๊ด๋ฆฌ ์์น ์ค์ (Client/Server ๋ถ๋ฆฌ, Branch ๋ถ๋ฆฌ)
- React native Navigation ๊ตฌ์กฐ ์ค๊ณ
- Social Login & JWT ํ ํฐ ๋ก๊ทธ์ธ ๊ตฌํ
- ์ ์ ์ ๋ณด ๋ฑ๋ก ๋ฐ ์ ํธํ๋ ํํธ๋ ์กฐ๊ฑด ํํฐ๋ง DB ์ฟผ๋ฆฌ ์์
- Google API๋ฅผ ํตํ ์ค์๊ฐ ์์น ํ์ธ ๋ฐ ๊ฒ์ ๊ธฐ๋ฅ
- ์ค์๊ฐ ์ฑํ ๋ฐ ์์น ์ ๋ณด ๊ณต์ ๋ฅผ ์ํ Socket ์ฐ๊ฒฐ
- WebView ๋ฐ Iamport๋ฅผ ํตํ ํฌ์ธํธ ๊ฒฐ์ ๊ธฐ๋ฅ ๊ตฌํ
- Refactoring & Debugging
- ํ๋ก ํธ App Build ๋ฐ ๋ฐฐํฌ
- AWS Elastic Beanstalk๋ฅผ ํ์ฉํ ๋ฐฑ์๋ ์๋ฒ ๋ฐฐํฌ
- Front & Backend Test code ์์ฑ
- ๊น ์ปค๋ฐ ๋ฉ์์ง ํต์ผํ๊ธฐ (์ปค๋ฐ ๋ฉ์์ง Reference)
- ํ๋์ ์ปค๋ฐ ๋ฉ์์ง์๋ ํ๋์ ๋ณ๊ฒฝ ์ฌํญ๋ง ์ถ๊ฐํ์ฌ ์ปค๋ฐํ๊ธฐ
- ์ฝ๋ ๋ฆฌํฉํ ๋ง ์ ๊น์ง ํ์ธ์ ๋ณ์๋ช ์์ ๋ณ๊ฒฝ ๊ธ์งํ๊ธฐ
- ํ๋ด์์ ์ ํ ์ฝ๋ ์ปจ๋ฒค์ ์งํค๊ธฐ(ํ์ดํ ํจ์, single quote, return๋ฌธ ์ blank ๋ฑ)
- ๊ฐ์ ํ๋ฃจ์ ๋งก์ ํ ์คํฌ ๋ค์๋ ์ค์ ์ ํ์์ด ํ์ธํ ์ ์๋๋ก Pull request ํด๋๊ธฐ
- ํ์ Pull Request์ ๊ฐ๋จํ ์ฝ๋ ๋ฆฌ๋ทฐํด์ฃผ๊ธฐ
- Pull Request์ ๋ถํ์ํ ์ฝ์ ๋ฐ ์ฃผ์ ์ ๊ฑฐํ๊ธฐ
- (โญ๏ธ) ๊น ์ปค๋ฐ ๋ฉ์ธ์ง๋ ํ๋์ ๊ตฌ์ฒด์ ์ธ refernce(์ ๋งํฌ)๋ฅผ ์ ํ๊ณ ์์ํ์ฌ, ๋์ฒด์ ์ผ๋ก ํต์ผ๋ ์ปค๋ฐ ๋ฉ์์ง๋ฅผ ์์ฑํ ์ ์์์ต๋๋ค. ๋ค๋ง, ๋ฉ์ธ์ง๊ฐ ๋๋ถ๋ถ Add, Fix ๋ฑ ํน์ ๋จ์ด์๋ง ๋ง์ด ์น์ค๋์ด ์ฌ์ฉ๋๋ ํ์์ด ์์ด ๋ ๋ค์ฑ๋ก์ด ์ปค๋ฐ ๋ฉ์ธ์ง๋ฅผ ์์ฑํ์ง ๋ชปํ ๋ถ๋ถ์ด ์์ฌ์์ผ๋ก ๋จ์ต๋๋ค. ์ฐจํ์๋ ํด๋น ์ปค๋ฐ ์ํฉ์ ๋ ์๋ง๊ณ ๊ตฌ์ฒด์ ์ธ ์ปค๋ฐ ๋ฉ์ธ์ง๋ฅผ ์ ๊ณ ์ํฉ๋๋ค.
- (๐บ) ์ปค๋ฐ ๋ฉ์ธ์ง๋ฅผ ํตํด ์ด๋ค ๊ธฐ๋ฅ์ด ๋ฐ๋์๋์ง ๋ช ํํ ์๊ธฐ์ํด ํด๋น ์์น์ ์ ํ์๊ณ , ์ด๋ฐ์๋ ์ ์ง์ผ์ก์ต๋๋ค. ํ์ง๋ง ํ๋ก์ ํธ ์ค๋ฐ~ํ๋ฐ ์ง๋๊ณ ์๋ถํฐ ํ๋์ ์ปค๋ฐ ๋ฉ์์ง์ ์ฌ๋ฌ๊ฐ์ง ๋ณ๊ฒฝ์ฌํญ๋ค์ด ๋ฐ์๋์ด์๋ ๊ฒฝ์ฐ๊ฐ ๋ง์์ต๋๋ค. ์ฌ๋ฌ๊ฐ์ง ๋ณ๊ฒฝ์ฌํญ๋ค์ด ํ๋์ ์ปค๋ฐ๋ฉ์ธ์ง๋ก ์์ถ๋๋ค ๋ณด๋ ๋ฌด์์ด ๋ฐ๋์๋์ง ํ์ธํ๊ธฐ ์ด๋ ค์ ์ต๋๋ค. ๋น๋ก ์๊ฐ์ด ๋ถ์กฑํ๋๋ผ๋ ํ์์๊ฒ ๊ธฐ๋ฅ๋ณ ํน์ ๋จ์๋ณ ๊ตฌ์ฒด์ ์ธ ์ปค๋ฐ ๋ฉ์ธ์ง๋ฅผ ๋จ๊ธฐ๋ ๊ฒ ํ์ ์์ ์ค์ํ ๋ถ๋ถ์ ์ฐจ์งํ๋ค๋ ๊ฒ์ ๋ฒ ์ ์ต๋๋ค.
- (โญ๏ธ) ๋ณ์๋ฅผ ์๋ช ํ ๋๋ง๋ค ํ์์๊ฒ ์ผ์ผ์ด ๋ฌผ์ด๋ณด๋ ๊ฒ์ด ๋นํจ์ธ์ ์ผ ๊ฒ์ด๋ผ๊ณ ํ๋จํ์ฌ, ์ค๊ฐ ๋ฆฌํฉํ ๋งํ ๋๋ฅผ ์ ์ธํ๊ณ ๋ ํ์์ ๋ณ์๋ช ์ ์์๋ก ๋ฐ๊พธ์ง ์๋ ๋ค๋ ๊ฒ์ ์์น์ผ๋ก ์ ํ์ต๋๋ค. ํด๋น ์์น ์์ฒด๋ ์ ์ง์ผ์ก์ผ๋, ์ฐจํ ๋ฆฌํฉํ ๋ง ๊ณผ์ ์์ ํฐ ํฌ์ ์ ์ฐจ์งํ๋ ๋ณ์๋ช ์ด ๋ณ๊ฒฝ๋๋ ๊ฒฝ์ฐ, ๋ฒ๊ทธ ๋ฌธ์ ๊ฐ ์ข ์ข ๋ฐ์ํ๊ณค ํ์ฌ ์์น ์์ฒด์ ์ฝ๊ฐ์ ์ค๋ฅ๊ฐ ์๋ค๋ ๊ฒ์ ๊นจ๋ฌ์์ต๋๋ค. ์ฑ์ ์ค์ํ ํฌ์ ์ ์ฐจ์นํ ๊ฒ์ด๋ผ๊ณ ํ๋จ๋๋ ๋ณ์๋ช ์ ๋น๋ก ์ฐจํ์ ๋ณ๊ฒฝ๋ ์ง๋ผ๋ ์ฆ๊ฐ์ ์ธ ํ์๊ณผ ์์๋ฅผ ํตํด ์ ํ๋ ๊ฒ์ด ๋์ ์๋ ์๊ฒ ๋ค๊ณ ํ๊ณ ํ์์ต๋๋ค.
- (โญ๏ธ) ์ฝ๋์ ํต์ผ์ฑ์ ์ํด ์ฝ๋ ์ปจ๋ฒค์ ์ ์ ํ์์ต๋๋ค. ์์ํ๋ ๋๋ก ์ด๋ฐ์๋ ๊ฐ์์ ์ฝ๋ ์คํ์ผ๋๋ก ์์ฑ์ ํ์์ง๋ง, ์ง์์ ์ผ๋ก ํ์์ ์ ํ ์ปจ๋ฒค์ ์ ํผ๋๋ฐฑํด์ฃผ์ด ์ฝ๋ ์ปจ๋ฒค์ ์ ํ๋ก์ ํธ ๋๊น์ง ๋์ฒด๋ก ์ ์ง์ผ์ก๋ค๊ณ ํ๊ฐํ์์ต๋๋ค.
- (โ) ํด๋น ์์น์ ํ๋ฃจ์ ๊ฐ์ ๋งก์ Task๊ฐ ์ต๋ํ ๋ฐ๋ฆฌ์ง ์๊ธฐ ์ํด, ๊ทธ๋ฆฌ๊ณ 6๋ฒ ์์น๊ณผ ์ฐ๊ฒฐ๋๊ฒ ํ๊ธฐ ์ํด ์ ํ์์ต๋๋ค. ํ๋ก์ ํธ ์ด๋ฐ์๋ ์ ์ง์ผ์ก์ผ๋, ๊ฐ์์ ์ญ๋๊ณผ ๋งก์ Task์ ๋์ด๋์์ ์ค๋ ์ฐจ์ด๋ก ์ธํด ํ๋ก์ ํธ ์ด์ค๋ฐ๋ถํฐ ์ง์ผ์ง์ง ๋ชปํ์์ต๋๋ค. ์์น ์์ฒด์ ์ทจ์ง๋ ํ๋ก์ ํธ ์ข ๋ฃ ์ดํ์ธ ์ง๊ธ๊น์ง๋ ํ์ ๋ชจ๋๊ฐ ๊ณต๊ฐํ์ง๋ง, Task ๋ถ๋ฐฐ์ ์์ธ์ด ์์๋ค๊ณ ๋ถ์ํ์์ต๋๋ค. ์ฐจํ์ ๊ฐ์ ์์น์ ์ธ์ด๋ค๋ฉด Task ๋ถ๋ฐฐ์์๋ถํฐ ์ ์คํ ๊ณ ๋ คํ์ฌ ํ๋ก์ ํธ๋ฅผ ๊ณํํด์ผ๋๋ค๋ ๊ฒ์ ๋ฐฐ์ ์ต๋๋ค.
- (โ) ๊ธฐ๋ฅ ๊ตฌํ์๋ง ์ด์ ์ ๋ง์ถ๋ ๊ฒ์ด ์๋๋ผ, ์ฝ๋ ๋ฆฌ๋ทฐ๋ฅผ ํตํด ์๋ก์ ์ฝ๋ ์คํ์ผ๊ณผ ๊ตฌํํ ๋ก์ง์ ์ดํดํ๊ณ ํผ๋๋ฐฑํ๋ฉด์ ๋์ด๊ฐ์๋ผ๋ ์ทจ์ง๋ก ๋ง์ ์์น์ด์์ง๋ง, 5๋ฒ ์์น๊ณผ์ ์ฐ์ฅ์ ์ผ๋ก ํด๋น ๋ถ๋ถ์ ํ๋ก์ ํธ ์ด์ค๋ฐ ์ดํ๋ก ์ง์ผ์ง์ง ๋ชปํ์์ต๋๋ค. ํ์ง๋ง ํ๋ก์ ํธ ์ด๋ฐ ์ ๊น pull request์ ๋ํด ์ฝ๋ ๋ฆฌ๋ทฐํด์ฃผ๋ ๊ฒฝํ ์์ฒด๋ ๋ฐฐ์ฐ๋ ์ ์ด ๋ง์๋ค๋ ๊ฒ์ด ํ์์ ํ๊ฐ์ ๋๋ค.
- (๐บ) ์ด๋ฐ์๋ ์ ์ง์ผ์ง์ง ์์์ง๋ง, ์ค๋ฐ ์ดํ๋ถํฐ๋ ์ต๋ํ console๊ณผ ์ฃผ์์ ์ง์ฐ๊ณ ์ ํ์๋ค ๋ชจ๋๊ฐ ๋ ธ๋ ฅํ์ต๋๋ค. ์ข ์ข ์ฝ์๊ณผ ์ฃผ์์ด merge๋๋ ์ค์๊ฐ ์๊ธดํ์์ง๋ง ์ ์ ํด๋น ์์น์ ๋ํด์๋ ํ์ ๋ชจ๋๊ฐ ๊ฐ์ ๋๋ ๋ชจ์ต์ ๋ณด์ฌ ์ธ๋ชจ๋ก ํ๊ฐํ์์ต๋๋ค. ํผ์์ ๊ฐ๋ฐ์ ํ ๋์๋ ํฌ๊ฒ ์ ๊ฒฝ์ฐ์ง ์์๋ ๋ถ๋ถ์ด์ง๋ง, ๋์ ์ง์ฐ์ง ์์ ์ฝ์์ด ๊ฐ๋ ํ์์ ๋๋ฒ๊น ์ ๋ฐฉํดํ ์๋ ์๊ณ , ์ฑ ์ ์ฒด์ ์ํฅ์ ์ค ์๋ ์๊ธฐ ๋๋ฌธ์ ๋ฐ๋์ ๋ถํ์ํ ๋ถ๋ถ์ ์ง์ฐ๊ณ merge๋ฅผ ํด์ผํ๋ค๋ ์ ์ ๊นจ๋ฌ์์ต๋๋ค.
MatchWaitingScreen์์ ์๋๋ฐฉ์ ๊ธฐ๋ค๋ฆด ๋ ๊ฐ๋๋๋ Timer๊ฐ, ๋ง๋จ ์ฑ์ฌ ์ดํ MatchSucceessScreen์ผ๋ก ํ๋ฉด์ด ์ ํ๋์ด ๊ฐ๋๋๋ Timer์ ์ข ๋ฃ์๊ฐ(00:00)๊ณผ ๋์์ ์ข ๋ฃ ์ด๋ฒคํธ๊ฐ ๋ฐ์๋๋ ํ์์ด ์์์ต๋๋ค. ๋๋ฒ๊น ์ ์ง์์ ์ผ๋ก ํ ๊ฒฐ๊ณผ, react native๋ web์ ๋ฌ๋ฆฌ ํด๋น ํ์ด์ง์์ ๋ค๋ฅธ ํ์ด์ง๋ก ๋์ด๊ฐ ๋, Screen์ด Stack์ผ๋ก ์์ด๋ ๊ตฌ์กฐ์ธ ๊ฒ์ ๊ฐ๊ณผํ๋ค๋ ์ ์ ๊นจ๋ฌ์์ต๋๋ค. ์ด๋ฅผ ํด๊ฒฐํ๊ธฐ ์ํด ๋๊ธฐ ํ๋ฉด์์ ๋ฏธํ ์ฑ์ฌ ํ๋ฉด์ผ๋ก ๋์ด๊ฐ ๋ ์คํ์ ์๊ณ navigate ํ๋ ํํ๊ฐ ์๋ ๊ทธ ์ ์ ์์๋ ๋ชจ๋ ํ๋ฉด Stack์ ๋ฆฌ์ ํ๊ณ ํ๋ฉด ์ ํํ๋ ํํ๋ก navigate ๋ฉ์๋๋ฅผ ๋ณ๊ฒฝํ์์ต๋๋ค. ์ถ๊ฐ์ ์ผ๋ก ๋ค์ ๋ค๋ก๊ฐ๊ธฐ๊ฐ ํ์ฑํ๋๋ฉด ์๋๋ ์ํฉ(๋๊ธฐํ๋ฉด์์ ์ทจ์๋ฒํผ์ด ์๋ ํด๋ํฐ ๋ค๋ก๊ฐ๊ธฐ ๋ฒํผ์ ๋๋ฌ ํ ํ๋ฉด์ผ๋ก ๋์๊ฐ๋ ์ํฉ)์๋ ์ด๋ฅผ ์ ์ฉํ์ฌ Navigation ์ค๋ฅ edge case๋ค์ ํด๊ฒฐํ์์ต๋๋ค.
MatchWaitingScreen์์ MatchSucceessScreen์ผ๋ก ๋์ด๊ฐ๋ ๋ถ๋ถ์์ ๋๊ธฐ ์ ์ ์ ํ๋ฉด์ด ๋๋ฒ Mount๋๋ ํ์์ผ๋ก ์ธํด, ์ด๋ ํ ์์ผ ์ด๋ฒคํธ๋ ์ฐ๊ฒฐ๋์ง ์๋ ์ค๋ฅ๊ฐ ๋ฐ์ํ์์ต๋๋ค. ์ค๋ น ๋๋ฒ Mount๊ฐ ๋๋๋ผ๋, ๊ฒฐ๊ตญ mount ํ ์์ผ ์ด๋ฒคํธ๊ฐ ์ฐ๊ฒฐ๋ ๊ฒ ๊ฐ์์ง๋ง ๊ทธ๋ฌํ์ง ์์์ต๋๋ค. ์ฒ์์๋ navigation ๋ฉ์๋์ ๋ฌธ์ ๊ฐ ์์ ๊ฒ์ผ๋ก ์๊ฐํ๊ณ ์กฐ์ฌํ์์ง๋ง ํด๊ฒฐ์ฑ ์ ์ฐพ์ง ๋ชปํ์์ต๋๋ค. ๋ง์ ์๊ฐ์ ๋๋ฒ๊น ํ ๊ฒฐ๊ณผ, ๋ฌธ์ ๋ 2๊ฐ์ง๊ฐ ์์์ต๋๋ค.
- ๋ฏธํ ๋๊ธฐํ๋ฉด(MatchWaitingScreen)๊ณผ ๋ฏธํ ์ฑ์ฌํ๋ฉด(MatchSucceessScreen)์ด ๊ฐ์ ์์ผ ์ด๋ฒคํธ๋ฅผ(Join meeting)์ ๊ณต์ ํ๊ณ ์์๋ ์
- ๋๋ถ์ด ๋ฏธํ ๋๊ธฐํ๋ฉด(MatchWaitingScreen)์ด unmount ๋ ์ ์์ผ ์ด๋ฒคํธ(Join meeting)์ remove ์์ ๊ณผ, ๋ฏธํ ์ฑ์ฌํ๋ฉด(MatchSucceessScreen)์ผ๋ก ์ ํ๋ ํ ๋ค์ ๊ฐ์ ์์ผ์ด๋ฒคํธ์(Join meeting) ์ฐ๊ฒฐ์์ ์ด ์์๊ณผ ๋ฌ๋ฆฌ ์์๋๋ก ์ด๋ฃจ์ด์ง์ง ์์์ต๋๋ค. ์ฆ MatchWaitingScreen๊ฐ unmount ๋ ๋ ํธ์ถ๋๋ ์์ผ์ removeAllListener ๋ฉ์๋ ์์ ์ด MatchSucceessScreen์ด ๋ง์ดํธ ๋ ์ดํ ์คํ๋์ด ์๋ฌด๋ฐ ์์ผ ์ด๋ฒคํธ๋ ์ฐ๊ฒฐ๋์ง์์๋ ์ ์ด์์ต๋๋ค. ์ด๋ฅผ ํด๊ฒฐํ๊ธฐ ์ํด MatchWaitingScreen์์ ์์ผ ์ด๋ฒคํธ๋ฅผ Join meeting์์ Create meeting์ผ๋ก ๋ณ๊ฒฝํ๊ณ ์ธ๋ถํํ์ฌ ์๋๋ฐฉ์ Join meeting ์์ผ ์ด๋ฒคํธ๊ฐ ๋์ด์ MatchWaitingScreen์ ์ํฅ์ ์ฃผ์ง ์๋๋ก ๋ณ๊ฒฝํ์์ต๋๋ค. ๊ฒฐ๊ตญ, ์ด๋ฅผ ํตํด ๋๋ฒ ๋๋๋ง ๋๋ ํ์์ ๋ง์ ์ ์์๊ณ , ์ ์์ ์ผ๋ก ์์ผ ์ฐ๊ฒฐ์ด ๋๋ ๊ฒ์ ํ์ธํ ์ ์์์ต๋๋ค.
์ฒ์์๋ ๊ฐ๋จํ ์์ผ ์ด๋ฒคํธ ๋ช๊ฐ์ง๋ง ํ์ํ ๊ฒ์ด๋ผ๊ณ ์๊ฐํ์์ง๋ง ์๊ฐ๋ณด๋ค ๊ตฌ์ฒด์ ์ธ ์ด๋ฒคํธ(๋ฐฉ ์์ฑ, user ์ฐ๊ฒฐ, ์ฌ์ฐ๊ฒฐ, ์ค์๊ฐ ์ฑํ , ์ค์๊ฐ ์์น ๊ณต์ , ๋ด๊ฐ ๋ฏธํ ์ ๋์ค์ ์ทจ์ํ์ ๊ฒฝ์ฐ, ์๋๋ฐฉ์ ์ํด ๋ฏธํ ์ด ์ทจ์๋์์ ๊ฒฝ์ฐ, ํด๋น ์์์ ์ฅ์์ ๋์ฐฉํ์ ๊ฒฝ์ฐ ๋ฑ)๊ฐ ํ์ํ๊ณ ๋ฐ๋์ ์ธ๋ถํ๋์ด์ผ๋ง ์ด๋ฒคํธ ๊ด๋ฆฌ๋ ๋๋ฒ๊น ์ด ์ฉ์ดํด์ง ์ ์๋ค๋ ์ ์ ๋ฐฐ์ ์ต๋๋ค.
์ฑ์ ์์ฑ์ํค๊ณ bulidํ์ฌ apk๋ฅผ ๋ง๋๋ ๊ณผ์ ์์ฒด๋ ์ฌ์ ์ผ๋, apkํ์ผ์ ์คํํ์ splash ํ๋ฉด๋ง ๋์ค๊ณ ๋ฐ๋ก ์ฑ์ด ์ข ๋ฃ๋๋ ํ์์ด ๋ฐ์ํ์์ต๋๋ค. ์ด๋ ํ ์๋ฌ ๋ฉ์ธ์ง๋ ๋ฐ์ง ๋ชปํ๊ณ ๋๋ฒ๊น ํ์ง ๋ชปํ๋ ์ํฉ์์ stackoverflow๋ ์ฌ๋ฌ ๋ธ๋ก๊ทธ์์ ์ ์ํ๋ ๋ฐฉ๋ฒ์ ์ ์ฉ๋ณด์์ง๋ง ํด๊ฒฐ๋์ง ์์์ต๋๋ค. ๊ฒฐ๊ตญ ๊ณต์๋ฌธ์๋ฅผ ํตํด buildํ ๋ environment.jsํ์ผ์์ ์ค์ ํด๋์ releaseChannel๋ฅผ ์ค์ ํด์ฃผ์ด์ผํ๋ค๋ ์ ์ ์๊ฒ ๋์๊ณ (ex. expo build:android --release-channel staging, expo build:android --release-channel prod) ํด๋น ๋ถ๋ถ์ ์์ ํ์ฌ ์ฑ Build์ ์ฑ๊ณตํ ์ ์์์ต๋๋ค.
- ๋ง๋จ ์ฑ์ฌ ๋์ค ํด๋น ์์์ ์ ๋ฉ๋ด ์ถ์ฒ ๊ธฐ๋ฅ, ๋ง๋จ ์ฑ์ฌ ์ดํ ์น๊ตฌ์์ ์ฌ๋ง๋จ ๊ธฐ๋ฅ ๋ฑ ๋ ๋ค์ฑ๋ก์ด ๊ธฐ๋ฅ์ ์ถ๊ฐํ๊ณ ์ ํฉ๋๋ค.
- ์ฌ์ฉ์๊ฐ ์ดํ๋ ์ผ์ด์ ์ข ๋ฃ&์คํ์ ํตํด ์์ผ์ ์ฌ์ฐ๊ฒฐ๋์์ ๋, ์ง์์ ์ผ๋ก ์ฆ๊ฐํ๋ server instance ๋ฌธ์ ์ ๋ํ ๋์ ๋ฐฉ๋ฒ์ ๊ตฌํํด๋ณด๊ณ ์ถ์ต๋๋ค,
- ํ์ฌ ์ฝ๋์์ ์ฌ์ฌ์ฉ ๊ฐ๋ฅ์ฑ์ด ๋ง์ component๊ฐ ์์์๋ ๋ถ๊ตฌํ๊ณ , ๋ฏธ์ณ ์ฌ์ฌ์ฉํ์ง ๋ชปํ ๋ถ๋ถ์ ๋ค์ ๋ฆฌํฉํ ๋งํ๊ณ ์ ํฉ๋๋ค.
- ํน์ ํ๋ฉด์ผ๋ก์ ์ง์ ํ ํ์ฌ ์ ์ ์ ์ํ์ ๋ฐ๋ผ navigate๋๋ ๋ถ๊ธฐ์ฒ๋ฆฌ ๋ก์ง์ผ๋ก ์ธํด ๋ถ๋ฆฌํ์ง ๋ชปํ๋ ๋น๋๊ธฐ api ๋ก์ง๋ค์ ์ปดํฌ๋ํธ ํน์ screen์์ ๋ฐ๋ก ๋ถ๋ฆฌํ๊ณ ์ ํฉ๋๋ค.
- ์ ๋ฐ์ ์ธ UI&UX ๊ฐ์ ์ ํตํด ๋ ์์ฑ๋ ์๋ ์ดํ๋ฆฌ์ผ์ด์ ์ผ๋ก ๊ฐ์ ํ๊ณ ์ถ์ต๋๋ค. (login ๋ฐ signup๊น์ง ํญ ๋ค๋น๊ฒ์ด์ ์ ๊ฑฐ, ํ๋ฒ ๋ง๋จ์ด ์ฑ์ฌ๋์๋ ์ ์ ๋ ๋ค๋ฅธ UI๋ก ์ง๋์ ํ์๋๋ ๊ธฐ๋ฅ, ์์์ ์ ๊ฒ์ํ์์ ๋ ํด๋น ์์์ ์ ์์น๊ฐ ๋ฐ๋ก ํ์๋๋ ๊ธฐ๋ฅ ๋ฑ)