AirBnb 클론코딩

less than 1 minute read

[Vanilla JS를 이용한 AirBnb 클론코딩 프로젝트]


✈️ AirBnb 클론코딩

1주차엔 백엔드, 2주차엔 프론트엔드를 구현했습니다.

Introduction

javascript-w1-airbnb
|-- j098_server	
|     `-- bin	
|     `-- database
|		`-- tables
|     `-- middleware
|     `-- public
|		`-- images
|		`-- javascripts
|		`-- stylesheets
|     `-- routes
|     `-- session
|     `-- veiws
|		`-- includes
|			`-- mixins

설치방법

npm install

실행방법

npm start

학습목표

BE

  • 로그인과 로그아웃을 구현하기 위해서 쿠키와 세션 사용
  • passport나 express-session 등의 외부 모듈은 사용하지 않고, 직접 세션을 구현
  • 회원가입 페이지와 로그인 페이지는 템플릿(pug) 사용
  • 별도 설치가 필요한 DBMS는 사용하지 않고 파일형식(.Json)으로 직접 구현

FE

  • 배치를 할때 flex 속성을 사용
  • HTML는 용도에 맞는 tag 사용
  • 함수를 역할에 맞게 작게 나누려고 노력
  • event 객체와 addEventListener 이해
  • 어떠한 외부 라이브러리도 사용 X

메인화면

image

배포 URL

https://j098-airbnb.herokuapp.com/

숙소 데이터는 서울에 있는 20곳만 추가했음(검색예시: 서울 oo구)

🔍깃허브 링크

Categories:

Updated:

Comments