DevOops - 개발자들의 "Oops!"를 즐겁게 극복하다 DevOops는 타이핑 속도 게임, 오류 찾기 게임, 그리고 커뮤니티 게시판을 통해 개발자들이 자주 마주하는 "Oops!" 순간을 대비하기 위한 웹사이트입니다. 개발 중 자주 마주하는 실수들, 끊임없는 디버깅의 고통, 그리고 소소한 웃음거리까지 모두 DevOops에서 즐겁게 나누세요. 게임과 커뮤니티가 결합된 공간에서 실력을 키우고, 동료 개발자들과 함께 성장해 나갈 수 있습니다.
🔥 주요 기능
- 타이핑 속도 게임: 더 빠르고 정확하게 코딩할 수 있도록 타이핑 실력을 연마하세요.
- 오류/오타 찾기 게임: 코드 속 숨어 있는 "Oops!"를 찾아내는 실력을 키워보세요.
- 커뮤니티 게시판: 자유롭게 글을 작성하고, 당신만의 개발 이야기를 공유해 보세요. 프로젝트를 함께할 팀원을 모집하거나, 개발 관련 질문과 답변을 주고받으며 커뮤니티를 만들어가세요.
개발자들에게는 "Oops!"도 하나의 즐거운 도전입니다! DevOops에서 실수를 게임으로, 경험을 성장으로 바꾸고 동료들과 함께 멋진 여정을 시작해 보세요. 🚀
메인화면
로그인/회원정보
개발자 유형찾기
타이핑 캘린지
오류찾기 챌린지
랭킹
자유/팀원모집게시판
홍보 게시판
####🚨🚨 Install 모아보기 🚨🚨
npm install
npm install react-router-dom
npm install react-slick slick-carousel
npm install react-icons
npm install react-syntax-highlighter
npm install bootstrap
npm install -D tailwindcss
npx tailwindcss init
npm install framer-motion
npm install @faker-js/faker
npm install classnames
npm install --save prismjs
npm install react-quill
npm install redux
npm install react-redux
npm install @reduxjs/toolkit react-redux
-
저장소를 클론:
git clone https://github.com/KDH000/DevOops.git
-
필요한 종속성을 설치:
npm install
-
React Router DOM
npm install react-router-dom
-
React Slick 및 Slick Carousel
npm install react-slick slick-carousel
-
React Icons 및 추가 라이브러리
npm install react-icons npm install react-syntax-highlighter npm install bootstrap
-
TailwindCSS 설치 및 초기화
npm install -D tailwindcss npx tailwindcss init
-
Framer Motion
npm install framer-motion
-
Faker.js
npm install @faker-js/faker
-
Classnames (조건부 CSS)
npm install classnames
-
PrismJS (코드 하이라이팅)
npm install --save prismjs
-
React Quill (글쓰기 옵션)
npm install react-quill -
Redux 설치 (계정별 점수 관리)
npm install redux npm install react-redux npm install @reduxjs/toolkit
npm start
| 아이디 | 비번 |
|---|---|
| jjang9 | 987654 |
| ckals413 | 123456 |
| dong | qwerty |
| suki | zxcvbn |
| nanana | poiuyt |