BUDDY BEE
🔗디자인 페이지🔗Github 페이지
🔗기능명세서 Notion 페이지
📌 프로젝트 개요
Buddy Bee는 서브컬쳐에 관련된 펀딩 프로젝트를 관리하고 참여할 수 있는 플랫폼입니다. 사용자는 펀딩을 목적으로 하는 그룹과,
행사 동행을 목적으로 하는 그룹으로 나뉩니다. 펀딩 그룹의 경우, 행사를 위한 버스 대절, 옥외광고 모집, 대관, 커피차 등 다양한 프로젝트를 후
참여자로부터 펀딩을 받을 수 있습니다. 동행 그룹의 경우, 행사에 함께할 사람을 모집할 수 있습니다.
📌기술 스택 및 툴
Language - Javascript
Frontend - React(18)
- react-router-dom, react-date-picker, Swiper
- matter.js(물리 엔진 구현)
Backend - Node.js, Express
- Axios
- bcrypt
DB - MySQL
Infra & Tool - AWS, Vercel
- Github (Projects Automation 포함)
- Figma
📌 참여 인원 | 제작 기간
- Smurfs-village팀(4명)
2024.07 ~ 2024.08
📌 주요 업무- 서비스 기획
- 디자인
- 프론트엔드 개발
📌 업무 세부사항
- RESTful API 사용
- 반응형 레이아웃 및 모바일 뷰 제작( 드롭 메뉴)
- 게시글 검색 및 필터링
- 링크 복사 기능
- UI 세부 값 작업
- 랜딩 페이지 스크롤 애니메이션
- 회원 가입 페이지 닉네임 조건 추가
- react-router-dom를 통한 라우트 작업
📌 트러블 슈팅 & 코드 스플릿
- http 환경에서 복사안되는 문제 해결
-
SNS 회원가입 모달창 사용 후 스크롤이 안되는 문제
-
닉네임 중복 확인 : 공란도 통과는 문제
- 랜딩 페이지 애니메이션 타이밍 해결
📌 페이지 상세
🛠️ 랜딩 페이지
🛠️ 로그인 | 회원가입 페이지
🛠️ 목록 페이지(진행 중인 프로젝트 조회, 필터 가능)
작성 코드 PR 2
작성 코드 PR 3
작성 코드 PR 4
작성 코드 PR 5
🛠️ 동행글 작성하기 | 펀딩 글 작성하기
🛠️ 펀딩 참여 완료 페이지
🛠️ 마이페이지(프로필 설정, 작성한 글, 참여중인 프로젝트, 나의 꿀단지)
🛠️상단 메뉴 모바일 쿼리(햄버거 메뉴로 전환)
📌 작업 과정
- Miro 통한 기획, 유저 플로우 작성
- Notion을 통한 기능 명세서 작성, Github을 통한 issue 작성
- Figma에서 와이어프레임, 프로토 타입 제작
BUDDYBEE DESIGN
📌 리서치
📌 디자인 시스템