Repository: AdityaKumawat97/MERN-BUS-APP
Branch: master
Commit: a363d0c32a68
Files: 57
Total size: 114.8 KB
Directory structure:
gitextract_jky4zb8k/
├── .gitattributes
├── README.md
├── backend/
│ ├── app.js
│ ├── auth/
│ │ └── auth.js
│ ├── bin/
│ │ └── www
│ ├── config/
│ │ ├── jwtConfig.js
│ │ ├── keys.js
│ │ └── passport.js
│ ├── models/
│ │ ├── Buses.js
│ │ └── User.js
│ ├── package.json
│ ├── public/
│ │ ├── index.html
│ │ └── stylesheets/
│ │ └── style.css
│ ├── routes/
│ │ ├── loggedInUser.js
│ │ ├── login.js
│ │ ├── register.js
│ │ └── routeSelection.js
│ └── routes.json
└── frontend/
├── .gitignore
├── README.md
├── debug.log
├── package.json
├── public/
│ ├── index.html
│ ├── manifest.json
│ └── robots.txt
└── src/
├── App.css
├── App.js
├── App.test.js
├── components/
│ ├── API/
│ │ └── api.js
│ ├── BusList/
│ │ ├── BusList.js
│ │ └── busList.css
│ ├── Homepage/
│ │ ├── Homepage.js
│ │ └── homepage.css
│ ├── Login-Signup/
│ │ ├── LogOrsign.js
│ │ ├── Signup.js
│ │ ├── SignupFunctions.js
│ │ ├── logOrsign.css
│ │ ├── loginFunctions.js
│ │ └── signup.css
│ ├── PaymentTab/
│ │ ├── PaymentTab.css
│ │ ├── PaymentTab.js
│ │ └── utils.js
│ ├── Profile/
│ │ ├── Profile.js
│ │ └── profile.css
│ ├── RouteSelection/
│ │ ├── RouteSelection.css
│ │ └── RouteSelection.js
│ ├── SeatSelection/
│ │ ├── SeatSelection.js
│ │ └── Tab.css
│ ├── TicketPage/
│ │ ├── TicketPage.css
│ │ └── TicketPage.js
│ └── routeSelector/
│ ├── Routeselector.css
│ ├── Routeselector.js
│ └── routeApifunc.js
├── index.css
├── index.js
├── serviceWorker.js
└── setupTests.js
================================================
FILE CONTENTS
================================================
================================================
FILE: .gitattributes
================================================
# Auto detect text files and perform LF normalization
* text=auto
================================================
FILE: README.md
================================================
# MERN-BUS-APP
## MFRP (My First Real Project) assigned by Cognizant during Internship
A Bus ticket booking application made using MERN Stack (MongoDB, Express js, React js, Node js)
The Bus ticket application is composed of the following Features:
### Front-End
* Sign-In & Sign-Up Pages.
* Uses Token based system, so only registered users can access the website passport js.
* Password hashing using passport js.
* Has a profile page, which will display all information about the signed in user.
* List of cities for users to choose from (starting city & destination city).
* Getting list of bus's of different companies with various details.
* Seat selection page has a very user friendly environment, which also generates dynamic forms for storing data's of passengers.
* Has a Confirmation page, which gets a debit card data using react-credit-cards. This version of the application does not include handling the payment process.
* Final page has a ticket displaying component, it displays all passenger data and also generates a random number as a transaction ID.
### Back-End
* Uses Express js based application for the backend process.
* Uses MongoDB atlas for storing the collections.
* Uses passport js for authenticating user and token based system.
* Uses passport js for hashing the password before sending the data to the cloud.
* This version does not support dynamic seat data being stored from cloud.
This project also demonstrates:
* a typcial React project layout structure
**Screenshots:**
Landing Page:

Signing In Page:

Bus Selection Page:

Seat Selection Page:

Payment & Confirmation Page:

---
## Developed With
* [Visual Studio Code](https://code.visualstudio.com/) - A source code editor developed by Microsoft for Windows, Linux and macOS. It includes support for debugging, embedded Git control, syntax highlighting, intelligent code completion, snippets, and code refactoring
* [Node.js](https://nodejs.org/en/) - Javascript runtime
* [React](https://reactjs.org/) - A javascript library for building user interfaces
* [Babel](https://babeljs.io/) - A transpiler for javascript
* [Webpack](https://webpack.js.org/) - A module bundler
* [SCSS](http://sass-lang.com/) - A css metalanguage
* [Bootstrap 4](https://getbootstrap.com/) - Bootstrap is an open source toolkit for developing with HTML, CSS, and JS
* [Axios](https://github.com/axios/axios) - Promise based HTTP client for the browser and node.js
* [Express js](http://expressjs.com/) - Express is a minimal and flexible Node.js web application framework that provides a robust set of features for web and mobile applications.
* [MongoDB atlas](https://www.mongodb.com/cloud/atlas) - MongoDB Atlas is the global cloud database service for modern applications.
* [Passport Js](http://www.passportjs.org/) - Passport is authentication middleware for Node.js. Extremely flexible and modular, Passport can be unobtrusively dropped in to any Express-based web application.
---
## Getting Started
These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.
### Prerequisites
The following software is required to be installed on your system:
* Node 8.x
* Npm 3.x
Type the following commands in the terminal to verify your node and npm versions
```bash
node -v
npm -v
```
### Install
Follow the following steps to get development environment running.
* Clone _'MERN-BUS-APP.git'_ repository from GitHub
```bash
git clone https://github.com/AdityaKumawat97/MERN-BUS-APP.git
```
_OR USING SSH_
```bash
git clone git@github.com:AdityaKumawat97/MERN-BUS-APP.git
```
* Install node modules
```bash
cd MERN-BUS-APP
cd frontend
npm install
cd..
cd backend
npm install
```
### Starting both front end and back end servers
* Build application
This command will start the mongodb and the front end part.
```bash
cd frontend
npm start
cd..
cd backend
npm run devStart
```
---
================================================
FILE: backend/app.js
================================================
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
var mongoose = require('mongoose');
var passport = require('passport');
const cors = require('cors')
var app = express();
// Login and Register
require('./auth/auth');
const login = require('./routes/login')
const loggedInPage = require('./routes/loggedInUser');
// ----------------------------------------------------
const bookingRoute = require('./routes/routeSelection')
var registerRouter = require('./routes/register');
//--------------------------------------------------------
//DB Config
const DB_URL = require('./config/keys').MongoURI;
//connect to mongo
//---------------------------------------------
mongoose.connect(DB_URL, {
useNewUrlParser: true,
useUnifiedTopology: true
})
.then(() => {
console.log("Connected to MongoDB")
})
.catch(err => {
throw err
})
//---------------------------------------------
app.use(logger('dev'));
app.use(express.json());
app.use(express.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));
app.use(cors())
app.use('/', login);
app.use('/booking', bookingRoute);
app.use('/register', registerRouter); // To register page
app.use('/user', passport.authenticate('jwt', { session: false }), loggedInPage); //To Secure Route
module.exports = app;
================================================
FILE: backend/auth/auth.js
================================================
const passport = require('passport');
const localStrategy = require('passport-local').Strategy;
const User = require('../models/User')
var bodyParser = require('body-parser')
const bcrypt = require('bcrypt');
//Create a passport middleware to handle User login
passport.use('login', new localStrategy({
usernameField: 'email',
passwordField: 'password'
}, async (email, password, done) => {
try {
//Find the user associated with the email provided by the user
const user = await User.findOne({ email });
if (user === null) {
//If the user isn't found in the database, return a message
return done(null, false, { message: 'User not found' });
}
//Validate password and make sure it matches with the corresponding hash stored in the database
//If the passwords match, it returns a value of true.
const validate1 = await bcrypt.compare(password, user.password, function (err, result) {
if (err) console.log(err);
if (result) return done(null, user, { message: 'Logged in Successfully' });
else return done(null, false, { message: 'Wrong Password' });
});
} catch (error) {
return done(error);
}
}));
const JWTstrategy = require('passport-jwt').Strategy;
//We use this to extract the JWT sent by the user
const ExtractJWT = require('passport-jwt').ExtractJwt;
//This verifies that the token sent by the user is valid
passport.use(new JWTstrategy({
//secret we used to sign our JWT
secretOrKey: 'top_secret',
//we expect the user to send the token as a query parameter with the name 'secret_token'
jwtFromRequest: ExtractJWT.fromUrlQueryParameter('secret_token')
}, async (token, done) => {
try {
//Pass the user details to the next middleware
return done(null, token.user);
} catch (error) {
done(error);
}
}));
================================================
FILE: backend/bin/www
================================================
#!/usr/bin/env node
/**
* Module dependencies.
*/
var app = require('../app');
var debug = require('debug')('backend:server');
var http = require('http');
/**
* Get port from environment and store in Express.
*/
var port = normalizePort(process.env.PORT || '8080');
app.set('port', port);
console.log("Server UP and Running at 8080")
/**
* Create HTTP server.
*/
var server = http.createServer(app);
/**
* Listen on provided port, on all network interfaces.
*/
server.listen(port);
server.on('error', onError);
server.on('listening', onListening);
/**
* Normalize a port into a number, string, or false.
*/
function normalizePort(val) {
var port = parseInt(val, 10);
if (isNaN(port)) {
// named pipe
return val;
}
if (port >= 0) {
// port number
return port;
}
return false;
}
/**
* Event listener for HTTP server "error" event.
*/
function onError(error) {
if (error.syscall !== 'listen') {
throw error;
}
var bind = typeof port === 'string'
? 'Pipe ' + port
: 'Port ' + port;
// handle specific listen errors with friendly messages
switch (error.code) {
case 'EACCES':
console.error(bind + ' requires elevated privileges');
process.exit(1);
break;
case 'EADDRINUSE':
console.error(bind + ' is already in use');
process.exit(1);
break;
default:
throw error;
}
}
/**
* Event listener for HTTP server "listening" event.
*/
function onListening() {
var addr = server.address();
var bind = typeof addr === 'string'
? 'pipe ' + addr
: 'port ' + addr.port;
debug('Listening on ' + bind);
}
================================================
FILE: backend/config/jwtConfig.js
================================================
const JWTstrategy = require('passport-jwt').Strategy;
const ExtractJWT = require('passport-jwt').ExtractJwt;
const passport = require('passport');
passport.use(new JWTstrategy({
secretOrKey: 'top_secret',
jwtFromRequest: ExtractJWT.fromUrlQueryParameter('secret_token')
}, async (token, done) => {
try {
return done(null, token.user);
} catch (error) {
done(error);
}
}));
================================================
FILE: backend/config/keys.js
================================================
module.exports = {
MongoURI: "mongodb+srv://AdityaNew:123@cluster0-rsoqu.mongodb.net/test?retryWrites=true&w=majority"
}
================================================
FILE: backend/config/passport.js
================================================
const passport = require("passport");
const localStrategy = require("passport-local").Strategy;
const User = require("../models/User");
passport.use(
"login",
new localStrategy({
usernameField: "email",
passwordField: "password",
},
async(email, password, done) => {
try {
const user = await User.findOne({ email });
if (!user) {
return done(null, false, { message: "User not found" });
}
const validate = await user.isValidPassword(password);
if (!validate) {
return done(null, false, { message: "Wrong Password" });
}
return done(null, user, { message: "Logged in Successfully" });
} catch (error) {
return done(error);
}
}
)
);
================================================
FILE: backend/models/Buses.js
================================================
const mongoose = require('mongoose');
const Schema = mongoose.Schema;
const BusSchema = new Schema({
companyName: {
type: String
},
busType: {
type: String
},
busNumber: {
type: String
},
startCity: {
type: String
},
destination: {
type: String
},
totalSeats: {
type: String
},
availableSeats: {
type: String
},
pricePerSeat: {
type: String
}
}, {collection: "buses"})
const bus = mongoose.model('bus', BusSchema)
module.exports = bus;
================================================
FILE: backend/models/User.js
================================================
const mongoose = require("mongoose");
const Schema = mongoose.Schema;
const UserSchema = new Schema({
name: {
type: String,
required: true,
},
email: {
type: String,
required: true,
},
password: {
type: String,
required: true,
},
mobile: {
type: String,
required: true,
},
gender: {
type: String,
required: true,
},
dob: {
type: Date,
required: false,
},
});
const User = mongoose.model("user", UserSchema);
module.exports = User;
================================================
FILE: backend/package.json
================================================
{
"name": "backend",
"version": "0.0.0",
"private": true,
"scripts": {
"start": "node ./bin/www",
"devStart": "nodemon ./bin/www"
},
"dependencies": {
"bcrypt": "^4.0.1",
"bcryptjs": "^2.4.3",
"body-parser": "^1.19.0",
"cookie-parser": "~1.4.4",
"cors": "^2.8.5",
"debug": "~2.6.9",
"express": "~4.16.1",
"express-session": "^1.17.1",
"jsonwebtoken": "^8.5.1",
"moment": "^2.26.0",
"mongoose": "^5.9.16",
"morgan": "~1.9.1",
"passport": "^0.4.1",
"passport-jwt": "^4.0.0",
"passport-local": "^1.0.0"
}
}
================================================
FILE: backend/public/index.html
================================================
Express
Express
Welcome to Express
================================================
FILE: backend/public/stylesheets/style.css
================================================
body {
padding: 50px;
font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
}
a {
color: #00B7FF;
}
================================================
FILE: backend/routes/loggedInUser.js
================================================
const express = require('express');
const router = express.Router();
//Displays information tailored according to the logged in user
router.get('/profile', (req, res, next) => {
res.json({
user: req.user,
token: req.query.secret_token
})
});
module.exports = router;
================================================
FILE: backend/routes/login.js
================================================
const express = require("express");
const passport = require("passport");
const User = require("../models/User");
const jwt = require("jsonwebtoken");
var bcrypt = require("bcrypt");
const router = express.Router();
router.post("/login", async(req, res, next) => {
const { email, password } = req.body;
try {
User.findOne({ email: email }, (err, doc) => {
console.log(doc);
if (err) {} else {
if (!doc) {} else {
bcrypt.compare(password, doc.password, function(error, response) {
console.log(response);
const token = jwt.sign({ doc }, "top_secret");
res.status(200).json({ token });
});
}
}
});
} catch (error) {}
// passport.authenticate("login", async(err, user, info) => {
// try {
// if (err || !user) {
// const error = new Error("No User Found");
// console.log("Yellow", err);
// return next(error);
// }
// req.login(user, { session: false }, async(error) => {
// if (error) return next(error);
// const body = {
// _id: user._id,
// name: user.name,
// email: user.email,
// gender: user.gender,
// };
// const token = jwt.sign({ user: body }, "top_secret");
// return res.json({ token });
// });
// } catch (error) {
// return next(error);
// }
// })(req, res, next);
});
// router.get('/Login', (req, res) => {
// res.send("Login Here")
// })
module.exports = router;
================================================
FILE: backend/routes/register.js
================================================
var express = require('express');
var router = express.Router();
var User = require('../models/User')
var bcrypt = require('bcrypt');
var moment = require('moment');
var bodyParser = require('body-parser')
router.get('/', (req, res) => {
res.send("Register Here")
});
//Body-Parser
var jsonParser = bodyParser.json()
router.post('/', jsonParser, async (req, res) => {
//Hash Password
const hashPassword = await bcrypt.hash(req.body.password, 10)
let user = {
name: req.body.name,
email: req.body.email,
password: hashPassword,
mobile: req.body.mobile,
gender: req.body.gender,
dob: moment(req.body.dob).format('YYYY-MM-DD')
}
let newUser = new User(user)
// console.log(newUser)
newUser.save((err, reslut) => {
if (err) console.log(err)
else res.status(201).json(reslut)
})
});
module.exports = router;
================================================
FILE: backend/routes/routeSelection.js
================================================
var express = require('express');
var router = express.Router();
var bus = require('../models/Buses');
// router.get('/', (req, res) => {
// bus.find({ companyName, startCity, totalseats, availableseats }, (err, result) => {
// if (err) res.send(err)
// else res.json({ result })
// })
// })
router.post('/', (req, res) => {
bus.find({ 'startCity': req.body.startCity, 'destination': req.body.destination }).exec((err, bus) => {
if (err) {
res.json({ status: false, message: "error while searching" })
}
else res.json({ bus })
})
})
router.post('/', (req, res) => {
bus.findOne({ _id: req.body.bId }, (err, bus) => {
if (err) {
res.json({ status: false, message: "error while searching with ID" })
}
else
res.json({ bus })
})
})
// router.post('/', (req, res) => {
// let newBus = new bus(req.body)
// newBus.save((err, bus) => {
// if (err) console.log(err)
// else res.status(201).json(bus)
// })
// })
module.exports = router;
================================================
FILE: backend/routes.json
================================================
[
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Chennai",
"destination": "bangalore",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "ORANGE BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Chennai",
"destination": "bangalore",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Chennai",
"destination": "Hyderabad",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "ORANGE BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Chennai",
"destination": "Hyderabad",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Chennai",
"destination": "Coimbatore",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "ORANGE BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Chennai",
"destination": "Coimbatore",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Chennai",
"destination": "Vishakapatnam",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Chennai",
"destination": "Salem",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Chennai",
"destination": "Tirunelveli",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Bangalore",
"destination": "Chennai",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Bangalore",
"destination": "Salem",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Bangalore",
"destination": "Hyderabad",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Bangalore",
"destination": "Coimbatore",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Bangalore",
"destination": "Vishakapatnam",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Bangalore",
"destination": "Kochi",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Kochi",
"destination": "Bangalore",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Kochi",
"destination": "Vishakapatnam",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Kochi",
"destination": "Chennai",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Kochi",
"destination": "Salem",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Kochi",
"destination": "Coimbatore",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Kochi",
"destination": "OOty",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "RED BUS",
"busType": "Multi AXLE AC",
"busNumber": "TN 27 110099",
"startCity": "Kochi",
"destination": "",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/08/2020"
},
{
"CompanyName": "Santhosh Travels bus",
"busType": "Multi AXLE AC",
"busNumber": "AP 27 110099",
"startCity": "Kakinada",
"destination": "",
"totalSeats": "36",
"availableSeats": "20",
"pricePerSeat": "1000",
"date": "22/04/2021"
}
]
================================================
FILE: frontend/.gitignore
================================================
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
# dependencies
/node_modules
/.pnp
.pnp.js
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
================================================
FILE: frontend/README.md
================================================
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
## Available Scripts
In the project directory, you can run:
### `yarn start`
Runs the app in the development mode.
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
The page will reload if you make edits.
You will also see any lint errors in the console.
### `yarn test`
Launches the test runner in the interactive watch mode.
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
### `yarn build`
Builds the app for production to the `build` folder.
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.
Your app is ready to be deployed!
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
### `yarn eject`
**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
## Learn More
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
To learn React, check out the [React documentation](https://reactjs.org/).
### Code Splitting
This section has moved here: https://facebook.github.io/create-react-app/docs/code-splitting
### Analyzing the Bundle Size
This section has moved here: https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size
### Making a Progressive Web App
This section has moved here: https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app
### Advanced Configuration
This section has moved here: https://facebook.github.io/create-react-app/docs/advanced-configuration
### Deployment
This section has moved here: https://facebook.github.io/create-react-app/docs/deployment
### `yarn build` fails to minify
This section has moved here: https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify
================================================
FILE: frontend/debug.log
================================================
[0530/011756.906:ERROR:scoped_process_suspend.cc(31)] NtSuspendProcess: An attempt was made to access an exiting process. (0xc000010a)
[0530/011757.834:ERROR:process_info.cc(118)] ReadProcessMemory bool __cdecl crashpad::(anonymous namespace)::ReadStruct(HANDLE, crashpad::WinVMAddress, T *) [T = crashpad::process_types::PEB]: Only part of a ReadProcessMemory or WriteProcessMemory request was completed. (0x12B)
[0530/011757.843:ERROR:process_info.cc(551)] ReadProcessData failed
================================================
FILE: frontend/package.json
================================================
{
"name": "frontend",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.3.2",
"@testing-library/user-event": "^7.1.2",
"@types/date-fns": "^2.6.0",
"axios": "^0.19.2",
"bootstrap": "^4.5.0",
"jwt-decode": "^2.2.0",
"react": "^16.13.1",
"react-credit-cards": "^0.8.2",
"react-datepicker": "^2.16.0",
"react-dom": "^16.13.1",
"react-icons": "^3.10.0",
"react-router-dom": "^5.2.0",
"react-scripts": "^3.4.1",
"react-transition-group": "^4.4.1",
"redux": "^4.0.5"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
================================================
FILE: frontend/public/index.html
================================================
Unique Travels
================================================
FILE: frontend/public/manifest.json
================================================
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}
================================================
FILE: frontend/public/robots.txt
================================================
# https://www.robotstxt.org/robotstxt.html
User-agent: *
Disallow:
================================================
FILE: frontend/src/App.css
================================================
body {
background: url('./bg.jpg');
background-repeat: no-repeat;
background-position: center center;
background-attachment: fixed;
background-size: cover;
height: 100%;
width: 100%;
}
.page{
position: absolute;
}
.fade-appear, .fade-enter {
opacity: 0;
z-index: 1;
}
.fade-appear-active, .fade-enter.fade-enter-active {
opacity: 1;
transition: opacity 300ms linear 150ms;
}
.fade-exit{
opacity: 1;
}
.fade-exit.fade-exit-active{
opacity: 1;
transition: opacity 150ms linear;
}
================================================
FILE: frontend/src/App.js
================================================
import React from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import 'bootstrap/dist/css/bootstrap.min.css'
import Homepage from './components/Homepage/Homepage'
import RouteSelection from './components/RouteSelection/RouteSelection'
import LogOrsign from './components/Login-Signup/LogOrsign'
import Signup from './components/Login-Signup/Signup'
import Profile from './components/Profile/Profile'
import TicketPage from './components/TicketPage/TicketPage'
import './App.css';
function App() {
return (
)
}
================================================
FILE: frontend/src/components/routeSelector/routeApifunc.js
================================================
import axios from 'axios'
export async function getRoutesFromApi(startCity, destination) {
const baseURL = "http://localhost:8080/booking/"
let incoming = await axios.post(baseURL, { startCity, destination })
return incoming
}
================================================
FILE: frontend/src/index.css
================================================
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
}
================================================
FILE: frontend/src/index.js
================================================
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
ReactDOM.render(
,
document.getElementById('root')
);
// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: https://bit.ly/CRA-PWA
serviceWorker.unregister();
================================================
FILE: frontend/src/serviceWorker.js
================================================
// This optional code is used to register a service worker.
// register() is not called by default.
// This lets the app load faster on subsequent visits in production, and gives
// it offline capabilities. However, it also means that developers (and users)
// will only see deployed updates on subsequent visits to a page, after all the
// existing tabs open on the page have been closed, since previously cached
// resources are updated in the background.
// To learn more about the benefits of this model and instructions on how to
// opt-in, read https://bit.ly/CRA-PWA
const isLocalhost = Boolean(
window.location.hostname === 'localhost' ||
// [::1] is the IPv6 localhost address.
window.location.hostname === '[::1]' ||
// 127.0.0.0/8 are considered localhost for IPv4.
window.location.hostname.match(
/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
)
);
export function register(config) {
if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
// The URL constructor is available in all browsers that support SW.
const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
if (publicUrl.origin !== window.location.origin) {
// Our service worker won't work if PUBLIC_URL is on a different origin
// from what our page is served on. This might happen if a CDN is used to
// serve assets; see https://github.com/facebook/create-react-app/issues/2374
return;
}
window.addEventListener('load', () => {
const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
if (isLocalhost) {
// This is running on localhost. Let's check if a service worker still exists or not.
checkValidServiceWorker(swUrl, config);
// Add some additional logging to localhost, pointing developers to the
// service worker/PWA documentation.
navigator.serviceWorker.ready.then(() => {
console.log(
'This web app is being served cache-first by a service ' +
'worker. To learn more, visit https://bit.ly/CRA-PWA'
);
});
} else {
// Is not localhost. Just register service worker
registerValidSW(swUrl, config);
}
});
}
}
function registerValidSW(swUrl, config) {
navigator.serviceWorker
.register(swUrl)
.then(registration => {
registration.onupdatefound = () => {
const installingWorker = registration.installing;
if (installingWorker == null) {
return;
}
installingWorker.onstatechange = () => {
if (installingWorker.state === 'installed') {
if (navigator.serviceWorker.controller) {
// At this point, the updated precached content has been fetched,
// but the previous service worker will still serve the older
// content until all client tabs are closed.
console.log(
'New content is available and will be used when all ' +
'tabs for this page are closed. See https://bit.ly/CRA-PWA.'
);
// Execute callback
if (config && config.onUpdate) {
config.onUpdate(registration);
}
} else {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
console.log('Content is cached for offline use.');
// Execute callback
if (config && config.onSuccess) {
config.onSuccess(registration);
}
}
}
};
};
})
.catch(error => {
console.error('Error during service worker registration:', error);
});
}
function checkValidServiceWorker(swUrl, config) {
// Check if the service worker can be found. If it can't reload the page.
fetch(swUrl, {
headers: { 'Service-Worker': 'script' },
})
.then(response => {
// Ensure service worker exists, and that we really are getting a JS file.
const contentType = response.headers.get('content-type');
if (
response.status === 404 ||
(contentType != null && contentType.indexOf('javascript') === -1)
) {
// No service worker found. Probably a different app. Reload the page.
navigator.serviceWorker.ready.then(registration => {
registration.unregister().then(() => {
window.location.reload();
});
});
} else {
// Service worker found. Proceed as normal.
registerValidSW(swUrl, config);
}
})
.catch(() => {
console.log(
'No internet connection found. App is running in offline mode.'
);
});
}
export function unregister() {
if ('serviceWorker' in navigator) {
navigator.serviceWorker.ready
.then(registration => {
registration.unregister();
})
.catch(error => {
console.error(error.message);
});
}
}
================================================
FILE: frontend/src/setupTests.js
================================================
// jest-dom adds custom jest matchers for asserting on DOM nodes.
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
import '@testing-library/jest-dom/extend-expect';