yemluck / Fly-And-Ship

This project is about a peer to peer web application to connect frequent flyers to people interested in shipping packages internationally.

Fly&Ship

Table of Contents

• Description
• Built With
• Screenshots
• Getting Started
  • Prerequisites
  • Installation
• Usage
• Acknowledgements
• Contacts

Description

This project is about a peer to peer web application to connect frequent flyers to people interested in shipping packages internationally.

Built With

Screenshots

Getting Started

This version uses React, Redux, Express, Passport, and PostgreSQL (a full list of dependencies can be found in package.json).

To test the application. you need to create a database named solo-project.

then copy the contents of database.sql into the sql query

Prerequisites

Before you get started, make sure you have the following software installed on your computer:

• Node.js
• PostrgeSQL
• Nodemon

Installation

• Run npm install
• Create a .env file at the root of the project and paste this line into the file:

  SERVER_SESSION_SECRET=superDuperSecret
  

  While you're in your new .env file, take the time to replace superDuperSecret with some long random string like 25POUbVtx6RKVNWszd9ERB9Bb6 to keep your application secure. Here's a site that can help you: https://passwordsgenerator.net/. If you don't do this step, create a secret with less than eight characters, or leave it as superDuperSecret, you will get a warning.
• Start postgres if not running already by using brew services start postgresql
• Run npm run server
• Run npm run client
• Navigate to localhost:3000

Usage

To use the app, you have to register as a flyer or a shipper. As a flyer, you are prompted to fill a form to create a new itinerary. A shipper on the other hand has to create a request form. Shipping requests are matched with itineraries and the user with the request is giving access to contact the user with the itinerary.

Lay of the Land

There are a few videos linked below that show a walkthrough the client and sever setup to help acclimatize to the boilerplate. Please take some time to watch the videos in order to get a better understanding of what the boilerplate is like.

• Initial Set
• Server Walkthrough
• Client Walkthrough

Directory Structure:

• src/ contains the React application
• public/ contains static assets for the client-side
• build/ after you build the project, contains the transpiled code from src/ and public/ that will be viewed on the production site
• server/ contains the Express App

This code is also heavily commented. We recommend reading through the comments, getting a lay of the land, and becoming comfortable with how the code works before you start making too many changes. If you're wondering where to start, consider reading through component file comments in the following order:

• src/components
  • App/App
  • Footer/Footer
  • Nav/Nav
  • AboutPage/AboutPage
  • InfoPage/InfoPage
  • UserPage/UserPage
  • LoginPage/LoginPage
  • RegisterPage/RegisterPage
  • LogOutButton/LogOutButton
  • ProtectedRoute/ProtectedRoute

Acknowledgements

I acknowledge my Prime Woodall cohort, my instructor, my pod mates and everyone who contributed to the success of this project

Contacts