JICAFE - 카페 커뮤니티 (21.5.16~21.9.3)

소스코드 (https://github.com/leejiho9898/cafe-community)

1. 프로젝트 시작 배경

처음으로 제대로 만들기 시작한 프로젝트입니다.

프로젝트가 배움에 목적이 있었기 때문에 웹의 전반적인 기능을 고루 배우고 싶었습니다.

이것을 만족하는 서비스는 커뮤니티 서비스라고 생각되었고 네이버 카페를 참고하여 이 프로젝트를 만들었습니다.

프로젝트명은 제 이름에서 한 글자를 따고 뒤에 카페를 붙여 "JICAFE" 라고 지었습니다.

 

 

2. 사용한 기술 스택

Front-End

• JavaScript
• CSS (SCSS)
• React
• Redux Toolkit

Back-End

• NodeJs
• Express
• MongoDB
• Mongoose
• JavaScript

3. 프로젝트 소개

1. Landing Page

 

시작하면 보이는 LandingPage

랜딩페이지에는

1. 회원가입, 로그인

2. 카페 만들기

3. 내 카페 목록

기능을 구현하였습니다.

회원가입 & 로그아웃

로그인

카페 생성

 

2. Cafe Page

카페에 들어오면 보이는 페이지

카페 페이지에는

1. 게시글 보기, 쓰기 , 수정 , 삭제

2. 댓글 작성, 삭제 , 수정

3. 게시판 리스트 보기

기능을 구현하였습니다.

 

 

게시글 작성

댓글

 

 

 

3. Cafe Management Page

카페 관리 페이지

 

 

 

게시판을 클릭하면 바뀌는 ui

카페 관리 페이지에는

1. 게시판 관리(삭제, 수정, 생성)

기능을 구현하였습니다.

 

나머지 글관리 멤버 관리 등등 CSS만 되어있는 부분은 미완성 인 채로 끝났습니다.

나중에 이 미완성인 부분을 완성시킬 생각도 있지만 언제가 될지는 모르겠습니다.

게시판 생성, 수정, 삭제

 

4. 프로젝트 후기

프로젝트를 시작했을때 거의 아무것도 모르는 상태로 시작했습니다.

생활코딩님의 HTML, CSS를 보며 프론트를 공부하고

John Ahn님의 react 기초강의를 들어가며 계속 공부했습니다.

지금 보면 CSS도 허접하고 코드 분리도 잘 안되어있고

허접한 코드지만 정말 고생하며 만든 기억이 있는 프로젝트입니다.

그리고 이 프로젝트가 제 진로를 개발자로 선택하게 된 토대가 되었습니다.

나중에 한번 다시 리메이크 해서 완벽하게 만들어보고 싶기도 합니다.