테스트 ID: a1sw110
테스트 PW: aa123123
// 1️⃣ 저장소 클론
git clone https://github.com/yourusername/brainpix.git
// 2️⃣ 패키지 설치
npm install
// 3️⃣ 개발 서버 실행
npm run dev
✨ 실행 전 환경 변수를 설정해주세요!
프로젝트 루트 폴더에 '.env'을 생성 후, 아래를 붙여넣어주세요.
VITE_BASE_URL=https://api.brainpix.net
VITE_S3_URL=https://brainpix.s3.ap-northeast-2.amazonaws.com
BrainPIX는 사람들이 자신의 아이디어를 공유하고 판매하거나, 협력자를 찾을 수 있는 플랫폼입니다.
기업과 개인 모두 아이디어를 제안하여 협력자를 찾거나 거래할 수 있습니다.
- 💡 아이디어 거래: 자신의 아이디어를 사고팔 수 있습니다.
- 👥 협업 찾기: 프로젝트에 적합한 팀원을 찾을 수 있습니다.
- 🚀 요청 과제: 직원 채용 없이 요청 과제를 등록하고, 신청할 수 있습니다.
![]() |
![]() |
![]() |
![]() |
권소현 | 김민정 | 임가희 | 최규호 |
- React (TypeScript)
- TypeScript를 사용하여 타입 안전성을 확보하고, 코드의 안정성을 높였습니다.
- 컴포넌트화를 통해 추후 유지보수와 재사용성을 고려했습니다.
- SCSS
- SCSS는 클래스 이름을 고유하게 부여할 수 있어, 일관된 네이밍 컨벤션을 유지하는 데 필요한 비용을 절약할 수 있어 채택하였습니다.
- 정해진 규칙에 따라 자동적으로 코드 스타일을 정리해 코드의 일관성을 유지하고자 하고 있습니다.
- 코드 품질 관리는 eslint에, 코드 포맷팅은 prettier에 일임해 사용하고 있습니다.
- airbnb의 코딩 컨벤션을 참고하고 있습니다.
- 협업 시 매번 컨벤션을 신경 쓸 필요 없이 빠르게 개발하는 데에 목적에 두었습니다.
- Git-flow 전략을 기반으로 main, develop 브랜치를 운용했습니다.
- main, develop 브랜치로 나누어 개발을 하였습니다.
- main 브랜치는 배포 단계에서만 사용하는 브랜치입니다.
- develop 브랜치는 개발 단계에서 git-flow의 master 역할을 하는 브랜치입니다.
BRAINPIX-front
┣ 📜README.md
┣ 📜.eslintrc.js
┣ 📜.gitignore
┣ 📜.prettierrc
┣ 📜.stylelintrc.json
┣ 📜package-lock.json
┣ 📜package.json
┣ 📜tsconfig.json
┣ 📜tsconfig.app.json
┣ 📜tsconfig.node.json
┣ 📜vite.config.ts
📦src
┣ 📂apis
┣ 📂assets
┃ ┣ 📂icons
┃ ┗ 📂images
┣ 📂components
┃ ┣ 📂common
┃ ┃ ┣ 📂button
┃ ┃ ┃ ┣ 📜ButtonGroup.tsx
┃ ┃ ┃ ┗ 📜buttonGroup.module.scss
┃ ┃ ┣ ...
┃ ┣ 📂my-page
┃ ┃ ┣ 📂info
┃ ┃ ┣ 📂message
┃ ┃ ┣ ...
┣ 📂constants
┣ 📂contexts
┣ 📂hooks
┣ 📂pages
┃ ┣ 📂collaboration
┃ ┃ ┣ 📜CollaborationMain.tsx
┃ ┃ ┣ 📜collaborationMain.module.scss
┃ ┃ ┣ ...
┃ ┣ 📂errorPage
┃ ┣ 📂idea-market
┃ ┣ ...
┣ 📂styles
┃ ┣ 📜_buttons.scss
┃ ┣ 📜_colors.scss
┃ ┣ 📜_components.scss
┃ ┣ 📜_fonts.scss
┃ ┣ 📜_layout.scss
┃ ┣ 📜_mixins.scss
┃ ┣ 📜_reset.scss
┃ ┣ 📜global.scss
┃ ┣ 📜main.scss
┃ ┗ 📜quillStyles.css
┣ 📂types
┣ 📜App.tsx
┣ 📜global.d.ts
┣ 📜main.tsx
┣ 📜routes.tsx
┣ 📜seoMetaTag.tsx
┗ 📜vite-env.d.ts