
- 사용자들이 자신이 촬영한 사진을 자유롭게 업로드하고, 다른 사용자로부터 피드백과 리뷰를 받을 수 있는 플랫폼입니다.
- 개인의 프로필 페이지에서 해당 사용자가 올린 사진을 모아볼 수 있습니다.
- 사용자들이 올린 사진을 제목, 작성자, 내용을 토대로 검색할 수 있습니다.
- 원하는 사진을 다운로드 받을 수 있습니다.
김민경 💻 |
이준영 💻 |
C:.
├─backend
│ ├─.mvn # Maven Wrapper 관련 설정
│ │ └─wrapper
│ ├─src # 실제 프로젝트 소스 코드
│ │ ├─main
│ │ │ ├─java
│ │ │ │ └─com
│ │ │ │ └─ssafy
│ │ │ │ └─mvc
│ │ │ │ ├─config
│ │ │ │ ├─controller
│ │ │ │ ├─interceptor
│ │ │ │ ├─model
│ │ │ │ │ ├─dao
│ │ │ │ │ ├─dto
│ │ │ │ │ └─service
│ │ │ │ └─view
│ │ │ └─resources
│ │ │ ├─mappers
│ │ │ └─static
│ │ │ └─img # 정적 이미지 리소스
│ │ └─test # 테스트 코드
│ │ └─java
│ │ └─com
│ │ └─ssafy
│ │ └─mvc
│ └─pom.xml # Maven 빌드 설정 파일
├─frontend
│ └─rephoto
│ ├─public
│ ├─src # Vue 소스 코드
│ │ ├─assets # CSS, JS, 이미지 등 정적 자원
│ │ ├─components # Vue 컴포넌트
│ │ ├─router # Vue 라우터 설정
│ │ ├─stores # Pinia 관련 파일
│ │ └─views # Vue 뷰 페이지
│ ├─package.json # Node.js 의존성 정보
│ ├─package-lock.json # Node.js 의존성 버전 고정
│ ├─vite.config.js # Vite 설정 파일
└─.gitignore
- Notion
- Notion과 GitHub를 이용한 협업 진행
- 컨벤션, 명세서, 트러블 슈팅, 문서 등은 Notion으로 관리
- 소스코드는 GitHub로 관리
- NavigationGuard를 이용하여 로그인 여부에 따라 특정 라우터에 접근할 수 없게 함
- 로그인이 되어 있는 경우 로그인, 회원가입 화면에 접근 불가
- 로그인이 되어 있지 않은 경우 시작 화면, 로그인 화면, 회원 가입 화면 이외에 접근 불가
- 글, 댓글 작성시 DB의 제약조건에 위배되는 경우를 watch로 감시하고 위배될 경우 해당 작업을 수행할 수 없도록 disabled 설정
- session에 로그인 아이디와 닉네임을 저장한 후 로그인 아이디의 여부에 따라 특정 로직을 실행할 수 없게 인터셉터를 설정하였다.
- 로그인이 되어 있는 경우 로그인 요청, 회원가입 요청을 차단함.
- 로그인이 되어 있지 않은 경우 로그인 요청, 회원 가입 요청, 중복 확인 여부를 제외한 모든 요청을 차단함.
- 원활한 사용을 위해 크롬 웹 스토어에서 Vue.js devtools 다운
- node.js 사이트 (https://nodejs.org/en) 에서 다운
cd frontend/rephoto
npm i axios bootstrap bootstrap-icons
npm run dev