README.md

Yeungnam-Nyang

영남대 고양이와 함께 고양이의 사소한 일상을 공유해주세요.

🚀 사이트 접속 : https://yeungnam-nyang.site

릴리즈

version	description	date	author
V0.0.1	첫 데모 버젼	2024.12.15	#74

📖목차

1. 개요
2. 팀원
3. Architecture
   1. 폴더 구조
   2. 서비스 흐름도
   3. System Architecture
4. UI/UX
5. 기술스택

📄개요

Yeungnam-Nyang(영남냥)은 영남대학교 길고양이들의 모습을 주변 친구들과 공유하며 자신의 고양이에 이름을 붙여줄 수 있습니다.
사용자의 현재위치를 기반으로 200m근방의 고양이 게시물을 마커형태로 확인할 수 있습니다.

🧑‍🤝‍🧑팀원

BackEnd,FrontEnd	BackEnd	FrontEnd
김도연 @tkv00	박재성 @pjs1710	백진욱 @Znaoznao

🔨Architecture

커밋 메시지

emoji	message	description
✨	feat	새로운 기능 추가, 기존 기능을 요구 사항에 맞추어 수정
🐛	fix	기능에 대한 버그 수정
📕	docs	문서(주석) 수정
🎨	style	코드 스타일, 포맷팅에 대한 수정
♻️	refact	기능 변화가 아닌 코드 리팩터링
✅	test	테스트 코드 추가/수정
📌	chore	패키지 매니저 수정, 그 외 기타 수정 ex) .gitignore

📂폴더 구조

Yeungnam-Nyang-FE

├── App.jsx
├── api
│   └── api.jsx
├── components
│   ├── common
│   │   ├── Button.jsx
│   │   ├── ButtonNopic.jsx
│   │   ├── DropMenu.jsx
│   │   ├── Error.jsx
│   │   ├── Header.jsx
│   │   ├── Loading.jsx
│   │   ├── Logo.jsx
│   │   ├── Modal.jsx
│   │   ├── NavBar.jsx
│   │   ├── Title.jsx
│   │   └── Wrapper.jsx
│   ├── friend
│   │   ├── FriendList.jsx
│   │   └── FriendRequest.jsx
│   ├── main
│   │   └── PostPreview.jsx
│   ├── nyangmap
│   │   ├── CatMarker.jsx
│   │   ├── KakaoMap.jsx
│   │   └── NyangBox.jsx
│   └── post
│       ├── DetailPostComment.jsx
│       ├── DetailPostCommentInput.jsx
│       ├── DetailPostContent.jsx
│       ├── DetailPostHeader.jsx
│       ├── DetailPostImage.jsx
│       ├── StopWatch.css
│       └── StopWatch.jsx
├── data
│   └── test.txt
├── hooks
│   ├── useFetch.jsx
│   ├── useFileUpload.jsx
│   ├── useGeoLocation.jsx
│   ├── useLocationPermission.jsx
│   └── useOutsideClick.jsx
├── index.css
├── main.jsx
├── pages
│   ├── CatsMap.jsx
│   ├── Friend.jsx
│   ├── FriendProfile.jsx
│   ├── FriendReceive.jsx
│   ├── FriendSent.jsx
│   ├── Login
│   │   ├── FindId.css
│   │   ├── FindId.jsx
│   │   ├── FindPassword.css
│   │   ├── FindPassword.jsx
│   │   ├── Login.css
│   │   └── Login.jsx
│   ├── Main.jsx
│   ├── NotFound.jsx
│   ├── Post
│   │   ├── DetailPost.jsx
│   │   ├── EditPost.jsx
│   │   └── WritePost.jsx
│   ├── Profile
│   │   ├── EditProfile.css
│   │   ├── EditProfile.jsx
│   │   ├── EditProfile2.jsx
│   │   ├── MyProfile.css
│   │   └── MyProfile.jsx
│   ├── Scrap.jsx
│   └── SignUp
│       ├── SignUP1.jsx
│       ├── SignUp1.css
│       └── SignUp2.jsx
├── setupProxy.js
├── store
│   ├── AuthProvider.jsx
│   ├── commentInputStore.jsx
│   └── useCatMapPosts.jsx
├── styles
│   ├── animation.js
│   └── test.txt
└── utils
  ├── PrivateRoutes.jsx
  ├── dateCalculator.js
  └── getAddressApi.js

• components : 재사용 가능한 컴포넌트
• assets : 이미지 혹은 폰트
• data : 로컬상에서 사용되는 데이터
• hooks : 커스텀 훅
• pages : 각 페이지 컴포넌트
• styles : css파일
• api : 서버통신 api
• store : zustand,contextAPI상태관리
• utils : 정규표현식 패턴,공통 함수등

🚚서비스 흐름도

⚙️system architecture

---

💻UI/UX

메인페이지	로그인

회원가입 1	회원가입2

친구추가	게시물 작성

좋아요	댓글 작성

마이프로필	스크랩

친구목록	받은 친구 신청 및 보낸 친구 신청

고양이 급식 타이머	냥맵

📚기술스택

FRONT

BACK

INFRA