PONG의 클라이언트 레포지토리입니다.
🔗 Storybook: https://master--6208487d2b51c1003ae8ae5e.chromatic.com/
2021.07.19 ~ 2021.10.08 (약 3개월)
PONG 프로젝트의 클라이언트를 개발합니다.
Pong 게임을 할 수 있는 웹 어플리케이션 개발
- Pong 게임
- 승패에 따른 전적 시스템
- 유저 초대 및 관전
- 커뮤니티
- 유저 친구 추가 및 차단
- 유저 프로필 확인 가능
- DM
- 임의 유저와의 DM
- 채널
- 채널 개설 및 채널 내 채팅
- admin page를 통한 채널 유저 관리
- 인증
- 42 시스템의 OAuth를 이용한 회원가입 및 로그인
- Google Authenticator를 이용한 2FA 로그인
- 기타
- 서비스 내 업적 달성 요소
최효정 @hyo-choi | 강진우 @PennyBlack2008 |
⚠️ NOTE
API 서버 및 42 system OAuth와 연동된 프로젝트이므로 클라이언트만 실행시킨 경우 실제 동작을 확인할 수 없습니다. 실제 동작을 확인하고 싶으신 경우 프로젝트 총괄 레포지토리의 Getting Started를 확인해주세요.
- git clone하여 프로젝트를 내려받습니다.
git clone https://github.com/OnBoarding-Park-is-best/week2-partners-dashboard.git
- 아래 커맨드로 패키지를 설치합니다.
yarn install
- 아래 커맨드로 프로젝트를 실행합니다.
yarn start
.
├── public
│ └── images
└── src
├── components
│ ├── atoms
│ │ ├── Avatar
│ │ ├── Button
│ │ ├── ChatInput
│ │ ├── DigitInput
│ │ ├── Input
│ │ ├── List
│ │ ├── ListClickItem
│ │ ├── ListItem
│ │ ├── Switch
│ │ └── Typo
│ ├── molecules
│ │ ├── Dialog
│ │ ├── GameOptionCard
│ │ ├── Menu
│ │ ├── SubMenu
│ │ └── UserProfile
│ ├── organisms
│ │ ├── AchieveListItem
│ │ ├── ChannelInfoForm
│ │ ├── ChannelListItem
│ │ ├── ChannelUserListItem
│ │ ├── ChatMessage
│ │ ├── DMListItem
│ │ ├── GameListItem
│ │ ├── MatchListItem
│ │ ├── PlayerProfile
│ │ ├── ProfileCard
│ │ └── UserInfoForm
│ ├── pages
│ │ ├── ChannelManagePage
│ │ ├── ChannelPage
│ │ ├── ChatPage
│ │ ├── CommunityPage
│ │ ├── DMPage
│ │ ├── GamePage
│ │ ├── GamePlayPage
│ │ ├── GameWatchPage
│ │ ├── LoginPage
│ │ ├── MFAPage
│ │ ├── MFARegisterPage
│ │ ├── ProfilePage
│ │ └── RegisterPage
│ └── templates
│ ├── LoginTemplate
│ └── MainTemplate
├── types
└── utils
├── game
└── hooks