“모두가 자유롭게 이용할 수 있는 커뮤니티”
”커뮤니티 내에서의 1대1 실시간 채팅”
Crab은 주 타겟층인 20대 대학생들을 위한 자유로운 커뮤니티로,
1대1 실시간 채팅을 바탕으로 신나”게” 사용자들과 소통할 수 있는 사이트입니다 😀
📣저희 Crab에서는 자체적인 로그인 없이, 간편한 소셜로그인을 제공해드리고 있습니다 📣
전체 게시판은 모든 게시판의 게시물이 게재되는 곳으로, 이곳에서 한눈에 모든 게시물을 열람할 수 있습니다 😄
여러 카테고리의 게시물들을 함께 살펴보세요!!
모든 게시물들을 하나하나 찾는 사용자분들의 고초를 덜어드리는 검색기능 🔎
제목과 본문, 유저들을 검색하며 원하는 내용을 찾아보세요😊
원하는 이미지와 텍스트로 자기만의 게시글을 꾸며볼까요 💟
마음에 드는 게시물에는 좋아요도 빼놓을 수 없겠죠? ❤️
게시글에서 회원분의 의견을 담고싶다면 댓글과 대댓글을 남겨주세요!!
다른 회원분들과의 또다른 소통창구가 될 수 있습니다 😆
chattingPage(미완성 → 주말 안으로 완성)
메인 페이지 우측 하단의 말풍선 아이콘을 클릭했을때의 채팅페이지입니다 💬
이곳에서 사이트의 회원분들과 자유로운 1대1 채팅 서비스를 이용할 수 있어요!!
회원분들의 mypage입니다 🪪
이곳에서 회원의 간단한 정보와 작성한 게시글들을 열람해보세요 🧐
modern Agile 6기
- 1 : 1 채팅을 기반으로 한 게시판 만들기 프로젝트 입니다.
- 모던애자일6기 메인프로젝트 입니다.
- 23.08.21 ~ 23.11.30
- 개발사이트
feat : 새로운 기능 추가
modify : 기능 수정
fix : 버그 수정
docs : 문서 수정
style : 코드 포맷팅, 세미콜론 누락, 코드 변경이 없는 경우
refactor : 코드 리펙토링
test : 테스트 코드, 리펙토링 테스트 코드 추가
chore : 빌드 업무 수정, 패키지 매니저 수정
conflict: 충돌 해결
publisher : 페이지 퍼블리싱
예제: feat(#이슈번호): 커밋내용
feature/기능이름/(#이슈번호)
git checkout -b [만들 피처브랜치 명] develop
- 디자인패턴 : Atomic Design Pattern
- 구분
[name] : 폴더
[name].ts/tsx : 동적경로
name.ts/tsx : 파일
- 폴더구조
├─ public │ └─ images └─ src ├─ components │ ├─ common : 자주사용되는 기능 │ │ ├─ index.ts │ │ └─ [componentName] │ │ ├─ styled.tsx │ │ ├─ index.ts │ │ └─ [componentName].tsx │ ├─ molecules : 하나의 기능 │ ├─ organisms : 여러기능 집합 │ └─ templates : 집합이 모여 하나의 페이지구성 ├─ hooks │ ├─ index.ts │ └─ [hookName] │ ├─ [hookName].tsx │ └─ index.ts ├─ pages │ ├─ index.tsx │ ├─ _app.tsx │ ├─ _document.tsx │ └─ [each_page] │ └─ index.tsx ├─ recoil │ ├─ atoms │ │ └─ userAtom.ts │ └─ selectors │ └─ userSelector.ts └─ styles └─ globals.css - dependencies
"@emotion/is-prop-valid": "^1.2.1", "@loadable/component": "^5.15.3", "@mui/material": "^5.14.15", "@types/autosize": "^4.0.2", "@types/loadable__component": "^5.13.5", "@types/node": "20.5.4", "@types/react": "18.2.21", "@types/react-dom": "18.2.7", "axios": "^1.6.2", "dotenv": "^16.3.1", "loadable": "^1.0.0", "next": "13.4.19", "prettier": "^3.0.3", "react": "18.2.0", "react-dom": "18.2.0", "react-icons": "^4.10.1", "react-loadable": "^5.5.0", "react-quill": "^2.0.0", "react-toastify": "^9.1.3", "recoil": "^0.7.7", "recoil-persist": "^5.1.0", "socket.io-client": "^4.7.2", "styled-components": "^6.1.0", "typescript": "5.1.6"
- 폴더 :
post-board기능-요소순으로 작성
- 파일
.tsx: UpperCamelCase으로 작성.ts: CamleCase작성
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent