- General Information
- Technical Information
- Backend Details
- Fronted Details
- Known Defenciencies
- Demo
- Deployment
- Contact
This project, the capstone of MOD 5 of Flatiron School's Immersive Software Engineering course, is a web application powered by a Ruby on Rails backend used as an API, and a React.js frontend. The application is called packageDefend, a website created to combat the growing problem of porch pirates. It does so by connecting those expecting a delivery of packages, but unable to receive a package personally, with individuals, such as stay-at-home moms and dads, others that work from home, etc. that can accept delivery, and thus, be a packageDefender.
The site allows users to create an account, search for packageDefenders on a map, create an order, and schedule meetings to pickup their packages. Other functionalities include:
- Edit user account info
- View order history
- Edit order info
- Favorite pacakgeDefender listings (front-end only- i.e. data does not persist)
This application was written in Ruby using Rails as an API. The frontend was written in React, using class, styled, and functional components. No state management tools (e.g. Redux) were used.
The application uses Rails as an API with with a Postgres database. It uses the following Ruby Gems:
- bcrypt: A secure hash algorithm designed by The OpenBSD project for hashing passwords.
- Active Model Serializer: to generate JSON responses from frontend client requests.
A single-page React.js application serves as the frontend. Other techinical details include:
- React Bootstrap: for reusable component generation, such as buttons, forms, and containers.
- Mapbox: to generate the maps where each packageDefender is located
- React Router: for page routing and user experience.
- Various types of components (class, styled, functional using hooks) mainly for educational purposes.
- Favorites Model: only has backend functionality
- Comments Model: was not implemented
- Session terminated on refresh
Click the video image below to be redirected to a demo video.
Saul Feliz LinkedIn