Giter VIP home page Giter VIP logo

boonghota's Introduction

어디있니 붕호타

  • 근처 붕어빵, 호떡, 타코야끼 가게를 찾아주는 서비스에요.
  • 전국 붕세권, 호세권 그리고 타세권(?)까지 한 눈에 볼 수 있어요.
  • 당신의 근처에 있는 가게를 등록하면 다른 사람들과 붕호타의 위치를 공유할수 있어요.

찾고 싶은 가게 유형을 선택할 수 있어요!


사장님뿐만 아니라 누구나 직접 가게를 등록하실 수 있어요!


지도에서 내 주변 가게를 찾을 수 있어요!


실행 방법

cd server  
npm i  
npm start  
cd ../client  
npm i

(dev mode)
npm start

(prod mode)
준비중..

디렉토리 구조

├ BoongHota  
 ├ client  
  ├ public  
  ├  src  
   ├  api  # Api call functions  
   ├  components  # UI components  
   ├  constants  # constant state  
   ├  hooks  # Custom hooks  
   ├  modules  # Redux actions, reducers, saga  
   ├  types  # type definitions  
   ├  App.js  
   ├  index.js    
 ├ server  
  ├  model # Data model(mongoose)  
  ├  types  # type definitions  
  ├  controller.js # Controller
  ├  db.js # Db connection  
  ├  index.js  
  ├  shopRouter.js # router

기술 스택

Area Tech Stack
Frontend
Backend
버전관리
인프라

Wiki

boonghota's People

Contributors

dohye1 avatar jungcome7 avatar dooeun avatar

Stargazers

Devicii avatar avatar Seungho Kim avatar JongHyeok Park avatar Sehyun Chung avatar Jiho Lee avatar Changi Cho (tube) avatar Younho Choo avatar Eunjoo avatar avatar

Watchers

James Cloos avatar avatar avatar avatar

Forkers

wanilly

boonghota's Issues

dfsdf

설명

ex) 가게 등록 Validation 구현 및 스타일 수정

체크리스트

해결해야 하는 이슈 정의

  • 가게이름 입력시 유효성 검사(한글, 영문, 숫자만 허용)
  • 영업 시간 select box 스타일 수정
  • 유효성 검사 통과 실패시 Feedback 화면 구현

jest를 활용한 유닛/통합 테스트

설명

ex) jest를 이용하여 front/backend 테스트

체크리스트

해결해야 하는 이슈 정의

  • 프론트엔드 유닛테스트
  • 백엔드 유닛테스트
  • 백엔드 통합테스트

Docker 학습 및 적용

설명

Docker 학습하고 적용해보기

체크리스트

해결해야 하는 이슈 정의

  • Docker 학습하고 적용해보기

map 컴포넌트 수정

설명

지도 상에 선택된 타입에 해당하는 가게를 보여주는 동작 구현 및 스타일 개선

체크리스트

해결해야 하는 이슈 정의

  • 선택된 타입의 가게만 지도에 보여주기
  • 기본 마커를 음식 아이콘으로 변경
  • 마커에 마우스 오버시 해당 정보를 보여주는 인포윈도우 만들기
  • 마커를 여러개 보여주기

크로스 브라우징

설명

구형 브라우저 지원을 위하여 크로스 브라우징 적용
그 전에, 어디까지 지원할지 토의해보기

체크리스트

해결해야 하는 이슈 정의

  • 크로스 브라우징

Beta 버전 릴리즈(AWS)

설명

AWS 클라우드 서버를 이용해 서비스를 배포합니다.

체크리스트

해결해야 하는 이슈 정의

  • EC2 알아보기
  • lightsail 구매
  • S3, lambda 알아보고 적용하기 -> 적용하지 않기로 함
  • https 적용

Config 파일들 필요에 맞게 다시 설정하기

설명

webpack, babel, jest, eslint, typescript 등의 설정 파일을 필요에 맞게 다시 설정하기

체크리스트

해결해야 하는 이슈 정의

  • webpack 설정
  • babel 설정
  • jest 설정
  • eslint 설정
  • typescript 설정

Github-actions 학습 및 적용

설명

Github-actions 학습하고 적용해보기

체크리스트

해결해야 하는 이슈 정의

  • Github-actions 학습하고 적용해보기

UI/UX 개선점 찾고 반영해보기

설명

UI/UX 개선점 찾고 반영해보기

체크리스트

해결해야 하는 이슈 정의

  • UI의 관점에서 개선점 찾기
  • UX의 관점에서 개선점 찾기
  • Figma 다시 그려보기
  • 레이아웃/CSS 반영

코드 및 구조 개선점 찾아 리팩토링하기

설명

확장과 유지보수가 용이한 코드 및 구조 설계
먼저 개선점을 고민해보고 리팩토링하기

체크리스트

해결해야 하는 이슈 정의

  • 구조 관점에서 개선점 찾아보기
  • 코드 레벨의 개선점 찾아보기
  • 리팩토링

SEO, 도메인 주소, Google-analytics

설명

SEO, 도메인 주소, Google-analytics 등 배포 후 서비스 운영을 위해 필요한 것들 생각해보기

체크리스트

해결해야 하는 이슈 정의

  • SEO
  • 도메인 주소
  • Google-analytics

modal component 개선

설명

모달 내부 기능 수정

체크리스트

해결해야 하는 이슈 정의

  • 시간 선택하는 방식 변경
  • 모달 외부 화면 클릭시 모달 꺼지는 기능 추가
  • 데이터 추가시 알림창 띄우기

모달 관련 기능 개선 및 수정 및 추가

위치찾기 버튼을 누르면 내 현재위치를 얻어오는데,
이렇게 작동하는것 보다 사용자가 지도상에서 좌표를 설정할 수 있게 하는것이 맞는것 같아서 수정하려함.

Labels

  • 필요시 라벨 새로 만들기!

서버구성하기

nodejs, mongodb를 사용해서 백엔드를 만들어보겠습니다!

CI/CD 학습 및 적용

설명

지속적 통합, 지속적 배포에 관해 학습하고 적용해보기

체크리스트

해결해야 하는 이슈 정의

  • CI에 관해 학습하기
  • CD에 관해 학습하기
  • CI/CD 적용하기

Typescript로 이주(JS -> TS)

JS -> TS 마이그레이션

  • Typescript관련 패키지 설치
  • 파일 확장자 변경
  • Props 타입 설정
  • 가게 데이터 타입 지정 및 모듈화
  • 기타 타입 설정

form에서 발생한 오류 수정

설명

form제출 후 다시 form을 열면 기존의 데이가 남아있어서
이부분을 초기화해주는 기능 추가

체크리스트

해결해야 하는 이슈 정의

  • 데이터를 생성 후 type, name, time을 초기화해줌 (form module에서)
  • 데이터를 생성 후 address, geoLocation을 초기화해줌 (map module에서)
  • address, geoLocation을 초기화 해주는 액션 생성

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.