Capstone Project

Carlo Carbonell
4 min readJun 25, 2021

Project Requirements:

Front-End

  • Must use React/Redux
  • Must have reducers, actions, action types
  • Must use styled components, CSS framework, or vanilla CSS. If it is not styled, it will not be considered complete.
  • Must be mobile responsive for 3 break points. Computer, tablet, phone. Work in mobile first then scale up.
  • Must contain color swatches and theme for your application.
  • All input fields must be controlled either with the redux store or local state. All important data must be stored in the redux store.
  • Deploy on Heroku or Netlify

Back-End

  • If you used a data file before, you must upload that to a sequelize/mongodb/elephantsql database and that be your priority. Supabase/Firebase is only for backup in the event nothing works. Please discuss this with me if you find this as an issue.
  • Use Express Router to break up your files
  • Create the routes that make sense for the functionality you would like to use on your application. CRUD.
  • Login/Authentication using Passport/JWT/Cookies
  • Deploy on Elephant SQL / Digitalocean or AWS.
  • Encrypt passwords sent to backend. Use bcrypt

Non-Code Related Requirements

  • Create a medium article and link it to your repo.
  • Create a proper readme for your application and the people who contributed to it.
  • Record your presentation of you going through the application. Should be roughly 2–5 min max time. Deploy to Youtube and link in readme and medium article.
  • Keep team sizes to 3–4 people max. Designate your PM.
  • Must be present for standup everyday at 9am/10am CST/EST. Send me a slack message of what you did today at the end of the day when you log off. Must do both to be counted as present.
  • You must apply to 7 jobs each week. You must give me the names of the places you applied to and where you applied to them.

The Idea Behind the Project

As a team, we wanted our Capstone project to be something that was simple in design, but also showed our expertise. We came upon the idea of an e-commerce website at first, but after careful consideration, we switched it up to an exotic car rental site. We sparked the original idea from https://lvcexotics.com/, and kind of put our own spin on it. With this type of e-commerce site, we would be able to easily meet all the project requirements, while still being able to put an emphasis on simplicity, as well as design. Our goal was to make this site as user friendly as possible, as design friendly as possible, and easy on the eyes with smooth edges and a light color scheme.

Project Time-frame:

  • Start: Monday, June 14th, 2021.
  • Finish and Present: Monday June 28th, 2021.

Screenshots:

Landing Page
The Garage
Single Car Page
Login/Create Account Page
Register Page
Reservation Details
Cart Page
Reservation Confirmation
About Us Page
404 Page

Technology Stack:

  • HTML, CSS, JS(JSX with React)
  • React/Redux
  • Supabase
  • React Bootstrap
  • React Router
  • Toastify
  • Styled Components

NPM Packages:

  • “@supabase/supabase-js”: “¹.15.1”
  • “bootstrap”: “⁴.6.0”
  • “react”: “¹⁷.0.2”
  • “react-bootstrap”: “¹.6.1”
  • “react-dom”: “¹⁷.0.2”
  • “react-redux”: “⁷.2.4”
  • “react-router”: “⁵.2.0”
  • “react-router-dom”: “⁵.2.0”
  • “react-scripts”: “⁴.0.3”
  • “react-toastify”: “⁷.0.4”
  • “redux”: “⁴.1.0”
  • “redux-logger”: “³.0.6”
  • “styled-components”: “⁵.3.0”

--

--