Coder Social home page Coder Social logo

overlook's Introduction

Abstract:

For the final solo project of Mod 2, I built an enterprise management software for the Grand Budapest Hotel. A user can log in and see a dashboard where they can select a date, view available rooms (with price, ameneties, etc), book a room, see their future and past bookings, delete future bookings, and see how much they've spent at the hotel. A manager can also log in and see a similar dashboard, but with the ability to search for a specific user,and book & delete rooms for that user.

Installation Instructions:

  1. Fork and clone this repo and  this repo (backend API).

  2. Copy the SSH key from the green "Code" button within each repo.

  3. In your terminal, use the command git clone [email protected]:[the link to each repo].

  4. Run npm install in both local repositories -- Do NOT run npm audit fix --force when prompted.

  5. Open the repo in your text editor to make any changes or inspect code.

  6. Run npm start in your terminal for both repos.

  7. Copy and paste the generated localServer address that your terminal provides for the front end repo into your browser address bar.

  8. Use a username of "customerXX" where XX is a number between 1 & 50, or use "manager" to see the manager view. Password is "overlook2021" for both. Note - if a single digit, do not include a 0. eg ✅"1" vs ❌"01".

Preview of App:

GBPH1-min

GBPH2-min

GBPH3-M-min

Context:

This project was the final solo project of Mod 2 at Turing. The scope of the project was intentional in testing our ability to write Javascript, HTML, and CSS to build a fully functional application on our own. Additionally, we incorporated a backend server and API's to GET, POST, and DELETE data. This project took about 25 hours to complete, and I completed all MVP functionality, as well as a handful of additional features to improve the UX.

Contributors:

Joseph 'Joe' Fogiato

Learning Goals:

The goals of this project were (1) use OOP to drive the design of the application and the code, (2) work with an API to send and receive data, (3) solidify the code review process, and (3) create a robust test suite that thoroughly tests all functionality of a client-side application.

Wins + Challenges:

Overall, I am confident with my work on this project, and how the application turned out. I was able to wireframe a design, implement passing functionality, and implement about 70% of the styling within three days of being assigned project. I was then able to use the remaining time to add features that enhanced the user experience and made using the application more appealing and seamless.

I am very happy with the layout, readability, and versatility of my Javascript in this project. For both classes and DOM-related functions/methods, I prioritized SRP and DRY code, as well as utilizing parameters to enable code to be reused across different parts of the code base.

For login error handling, I utilized boolean variables that were assigned based off the user inputs, and then checked those variables in my conditional. This allowed my error handling for that portion to be much clearer and cleaner to someone who has to familiarize themselves with the codebase.

The last major win that I am proud of on this project was my apirRequest function. This function utilized a handful of parameters to able to GET, POST, and DELETE all from within the same function.

The major challenges I had on this project arose from switching between customer and manager views. Keeping track of which pieces of the dashboard should be visible, which data was being populated where, and ensuring functions were firing with the right arguments took a lot of trial and error and path testing.

overlook's People

Contributors

jfogiato avatar robbiejaeger avatar hannahhch avatar niksseif avatar dependabot[bot] avatar bea-ordonez avatar hfaerber avatar khalidwilliams avatar

Watchers

 avatar

overlook's Issues

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.