/guest-calendar

Angular + Bootstrap guest management. Live Demo:

Primary LanguageJavaScript

#Guest Calendar

Live Demo

https://giocodes.github.io/guest-calendar/

Features

  • Fetch data of guest profile, stays, and rates from JSON file
  • Day, week or month view through filters
  • Total number of guests, rates collected, and fees
  • Filter by property, source and status
  • Click or tap contact for profile details
  • Profile photo placeholders
  • Add new guests (without persistent data)
  • Omnisearch box
  • Responsive layout
  • W3C valid HTML5 and CSS3

Frameworks used

Angular Bootstrap LESS

Development Process

  1. Ensure to understand the challenge and wireframe creation ###Main Desktop Wireframe ###Guest Profile Guest Profile Wireframe

  2. Review data source (JSON) and analyze how to integrate. Decided to use Angular's $http service to load the JSON data.

  3. Worked on the filters logic and dates localization.

  4. Theme and styling using LESS to leverage variables and DRY the stylesheet.

  5. QA and Deployment.

Screenshots

###Main Desktop ###Mobile Guest Profile Mobile