Image Community

📝 개요

• 이미지와 함께 게시글을 공유하며, 소통할 수 있는 SNS 커뮤니티 서비스 입니다.

💻 사용 기술

• React
• Firebase
• redux
• redux-thunk
• redux-actions
• immer
• moment
• lodash

🏚 개발 환경

• OS : Mac
• Front-End : React
• IDE : IntelliJ
• Platform : PC Web
• Test Browser : Chrome v.100.0.4896.60
• Test Device : iPhone 13 Pro

🔗 배포 URL

• URL: https://image-community-43dff.firebaseapp.com/
• 테스트 계정
  • ID: test@test.com
  • PassWord: asdf1234

💬 구현 기능

• 회원가입, 로그인 기능 개발
• 이미지 게시글 CRUD 기능 개발
• 댓글 작성 삭제 기능 개발
• 댓글 알림 기능 개발
• 재사용성을 높인 최소 단위 Element 컴포넌트 개발
• Redux 액션, 액션 생성 함수, 리듀서, 미들웨어 코드 개발
• Redux 스토어 코드 개발
• Firebase 서버 연결 코드 개발

🛠 구현 화면

홈	회원가입	로그인 & 로그아웃

게시글 작성	게시글 수정	게시글 삭제

댓글 작성	댓글 삭제	댓글 알림

📂 프로젝트 구조

.src
├── index.css
├── index.js
├── components
│   ├── Card.js
│   ├── CommentList.js
│   ├── CommentWrite.js
│   ├── Header.js
│   ├── NotFound.js
│   ├── NotiBadge.js
│   ├── Post.js
│   └── index.js
├── elements
│   ├── Button.js
│   ├── Grid.js
│   ├── Image.js
│   ├── Input.js
│   ├── Spinner.js
│   ├── Text.js
│   └── index.js
├── pages
│   ├── Login.js
│   ├── Notification.js
│   ├── PostDetail.js
│   ├── PostList.js
│   ├── PostWrite.js
│   ├── Signup.js
│   └── index.js
├── redux
│   ├── configureStore.js
│   └── modules
│       ├── comment.js
│       ├── image.js
│       ├── post.js
│       └── user.js
├── shared
│   ├── App.css
│   ├── App.js
│   ├── Cookie.js
│   ├── InfinityScroll.js
│   ├── Permit.js
│   ├── Search.js
│   ├── Upload.js
│   ├── common.js
└   └── firebase.js