개요

• 이미지 기반의 SNS를 반응형 웹으로 설계&제작
• not reload (편리성)
• Google Map API (사용자가 어디서 업로드 하는지 실시간 확인)
• CURD (게시글, 댓글, 사용자 정보)
• Search (부분 텍스트 검색 - 위치, 사용자 정보)
• repo: https://github.com/gaon-park/Image-Video-Upload-Post-Site

기술 스택

분류	기술
Language	- JAVA(JDK 1.8) - JavaScript
Database	- MySQL
WAS	- Tomcat 9
Back End	- Spring MVC - JDBC - MyBatis
Front End	- jQuery - AJAX - JSON - Bootstrap
API	Google Map API

Service Configuration Diagram

Database ERD

Page Samples

1. Login Page
   1. Keep me signed in 버튼을 통해 localStorage 관리
   2. Ajax를 통해 페이지 전환 없이 아이디 중복성 체크
2. User Informatin Page
   1. 프로필 사진 변경
   2. 소개 변경
   3. 패스워드 변경
3. Profile Page
   1. 콘텐츠에 대한 정보
   2. 썸네일 이미지
   3. 사용자가 어디에서 이미지를 자주 업로드 하는지 보여줌
4. Upload Page
   1. Dropzone과 Google API를 이용한 업로드 편의성
5. Main Page
   1. 사용자별 좋아요(♥)와 댓글 기능
   2. Scroll Event에 따른 페이징 기능
6. Search Page
   1. 위치 정보 or 텍스트 내용의 검색 기능