https://github.com/codestates-seb/seb40_pre_038

https://github.com/codestates-seb/seb40_pre_038

Last synced: about 1 year ago
JSON representation

• Host: GitHub
• URL: https://github.com/codestates-seb/seb40_pre_038
• Owner: codestates-seb
• Created: 2022-10-19T00:51:28.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2023-03-15T18:57:56.000Z (about 3 years ago)
• Last Synced: 2025-03-26T19:36:53.426Z (about 1 year ago)
• Language: JavaScript
• Homepage: http://pre-project-038-client.s3-website.ap-northeast-2.amazonaws.com/
• Size: 6.89 MB
• Stars: 8
• Watchers: 5
• Forks: 3
• Open Issues: 7
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Stack Overflow clone

### 프로젝트 소개

세계적으로 유명한 개발자들의 커뮤니티, Stack Overflow를 clone한 프로젝트입니다.

👇 아래 링크를 통해 저희들의 Stack Overflow를 체험해보세요 :)

[Stack Overflow create by.pre038](http://pre-project-038-client.s3-website.ap-northeast-2.amazonaws.com)

### 구현 기능

**1. 회원가입 및 로그인/로그아웃**

![38](https://k.kakaocdn.net/dn/bYVy2D/btrQEJs2dsl/c3Bdy1JOWfIzLYOZ69cpnK/img.gif)

- 닉네임, 이메일, 비밀번호 입력을 통해 회원가입할 수 있습니다.

- 중복된 닉네임 또는 이메일을 사용하려 회원가입 시도할 경우 모달 창을 통해 사용할 수 없다는 안내가 나옵니다.

- 회원가입 후 이메일과 비밀번호를 통해 로그인할 수 있습니다.

- 오른쪽 상단에 있는 말풍선>로그아웃 버튼을 통해 로그아웃할 수 있습니다.

**2. Question Create/Read/Delete**

![38](https://k.kakaocdn.net/dn/bzqyBF/btrQDGctOcT/hVFGBq8jq0CD88sbqvyXKk/img.gif)

![38](https://k.kakaocdn.net/dn/99LGw/btrQz55ATVV/NGSkdk5lnFp44OdDsTb5n1/img.gif)

![38](https://k.kakaocdn.net/dn/xsbd1/btrQyWnmDFK/rkwEXa6KlKpYFDitoGsdN1/img.gif)

- Home에서 Top Questions을, Questions에서 All Questions을 볼 수 있습니다.

- 한 페이지에 15/30/50개씩 페이지네이션 기준 갯수를 선택할 수 있습니다.

- 질문의 제목을 클릭하여 질문 상세 페이지로 이동할 수 있습니다.

- 로그인 한 사용자만 질문을 등록할 수 있습니다.

- 질문 등록시, 정해진 글자 수 이상(본문 20글자 이상) 작성하여야 등록할 수 있습니다.

- 자신이 등록한 질문만 삭제할 수 있습니다.

**3. Answer Create/Read/Delete**

![38](https://k.kakaocdn.net/dn/CIa0S/btrQDk1OQ6U/sAHvb4RTcM0IqVMD27BMqK/img.gif)

- 질문 상세 페이지에서 각 질문에 대한 답변을 확인할 수 있습니다.

- 로그인 한 사용자만 답변을 등록할 수 있습니다.

- 답변 등록시, 정해진 글자 수 이상(본문 20글자 이상) 작성하여야 등록할 수 있습니다.

- 자신이 등록한 답변만 삭제할 수 있습니다.

**4. Comment Create/Read/Delete**

![38](https://k.kakaocdn.net/dn/cxihG9/btrQz6Q3fKT/0ckkx7YGxnTCs2o9nXXCWK/img.gif)

- 질문 상세 페이지에서 각 질문과 답변에 대한 댓글을 확인할 수 있습니다.

- 로그인 한 사용자만 댓글을 등록할 수 있습니다.

- 자신이 등록한 댓글만 삭제할 수 있습니다.

**5. Search bar 검색 기능**

![38](https://k.kakaocdn.net/dn/brK7JL/btrQDwVogur/bBZNxLYlonCf8E1tJl0sek/img.gif)

- Header 에 있는 Searchbar 를 통해 질문을 검색할 수 있습니다.

- 검색 결과는 키워드가 제목 혹은 본문에 포함된 질문들만 filter 되어 화면에 출력됩니다.

**6. Vote 기능**

![38](https://k.kakaocdn.net/dn/3QBYC/btrQDv93X3O/aokRd7Nb5nGsIkbu98eeFK/img.gif)

- 로그인 한 사용자만 투표를 할 수 있습니다.

- 모든 질문과 답변에 한 아이디당 단 한 번만 투표가 가능합니다.

- upvote 와 downvote 수가 즉시 합산되어 숫자로 화면에 출력됩니다.

**7. 반응형 화면 구현**

![반응형](https://k.kakaocdn.net/dn/bIum4g/btrQCVnO79Y/mwL6YNsf39VakbcMq5EoZ0/img.gif)

- 500px-640px, 641px-980px, 981px-1100px 을 기준으로 반응형 웹 페이지를 구현하였습니다.

### 🌟Team Members

  

    

    
Serin Bang
🪄FE

    
Changha Shin
🪄FE

    
Jeongwoo Kim
🪄FE

    
Jinhui Kim
🪄FE

    

    

    
Min Joo Kim
🪄BE

    
Taeyeong Kim
🪄BE

    
Hayoung Moon
🪄BE

    

  

### 기술 스택

  ![Redux](https://img.shields.io/badge/redux-%23593d88.svg?style=for-the-badge&logo=redux&logoColor=white) ![Styled Components](https://img.shields.io/badge/styled--components-DB7093?style=for-the-badge&logo=styled-components&logoColor=white)