Giter Site home page Giter Site logo

hcs's Introduction

Hobby Community Service

1. 서비스 소개

  • 당근마켓을 클론한 프로젝트입니다.
  • 내가 사는 동네에 함께 사는 주민들을 위한 플랫폼 서비스 입니다
  • 활발하고 편리한 소통을 위해 다양한 기능을 제공합니다
  • 자신의 다양한 취미를 함께 즐길 수 있는 동호회를 찾거나 생성할 수 있습니다
  • 다이렉트 메시지를 통해 사용자끼리 채팅 및 중고거래를 할 수 있습니다

HCS 프로젝트 구성도

스크린샷 2022-03-17 오후 3 57 37

  • REST API 를 준수하는 API 서버이며, method는 문서화되어 작성됨
  • RabbitMQ external broker를 사용하여 scale out된 서버간의 stomp 프로토콜 기반 실시간 통신 message delivery 기능 지원
  • FormLogin, OAuth 2.0(Google, Facebook, Naver, Kakao) 로그인 지원
  • React (with Typescript) 를 사용하여 login, chatting service 기능 확인을 위한 Front 화면 구현
  • Redis cache로 session storage 전역저장소로 사용
  • Nginx의 reverse-proxy 기능을 이용하여 로드밸런싱
  • PR이 push될 경우 Jenkins plugin을 이용한 health check 후 무중단 배포하는 CI/CD 서버
  • Spring actuator를 이용하여 prometheus를 위한 endpoint 열기
  • Grafana로 서버들의 성능을 학인할 수 있는 모니터링 dashboard UI 제공
  • 서비스에 대한 자세한 사항은 Notion Link 를 참고해주세요

ERD

스크린샷 2022-03-17 오후 2 15 14

01. User Flow

  1. Form Login

로그인 버튼을 누를 시 인증 과정을 거침

로그인 성공

ezgif com-gif-maker

로그인 실패

log fail

2. OAuth2.0 Login

  1. Google

google oauth

  1. Facebook

facebook

  1. Kakao

oauth kakao login

  1. Naver

naver

3. 채팅하기

1. /messenger

사용자가 로그인시 자신의 채팅방 목록이 왼쪽 사이드바에 나타납니다

스크린샷 2022-03-17 오후 2 46 47

원하는 방을 누르고 접속하면 채팅 목록들이 나오게됩니다

chat1

채팅 전송을 눌러 실시간으로 채팅이 가능합니다

채팅방의 최신 메시지가 업데이트 됩니다

chat2

채팅이 오게 될경우 상단 네비게이션 바에 알람이 도착합니다

chat alarm

02. 기술스택

카테고리 기술
Language Java,Javascript
Framework SpringBoot
ORM JPA,MyBatis
Security Spring Security
Messaging Protocol STOMP
Build Tool Gradle,Jenkins
DB MySQL,Redis
Test Mockito,JUnit
Front React,Typescript,Redux,SWR

hcs's People

Contributors

noah0504789 avatar trigonotis97 avatar f-lab-lyan avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.