All Projects β†’ AdityaKumawat97 β†’ MERN-BUS-APP

AdityaKumawat97 / MERN-BUS-APP

Licence: other
This is a MFRP (My first Real Project) assigned to me during my internship at Cognizant. Made with MERN Stack technology.

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects
HTML
75241 projects

Projects that are alternatives of or similar to MERN-BUS-APP

HIMS
Hospital Information Management System create using Node Js
Stars: ✭ 41 (-55.43%)
Mutual labels:  node-js, passportjs, express-js
ExpressJS-SocketIO-Boilerplate
πŸ“¦ Simple Express.js & Socket.io Boilerplate
Stars: ✭ 31 (-66.3%)
Mutual labels:  node-js, passportjs, express-js
Registration-and-Login-using-MERN-stack
Simple Registration and Login component with MERN stack
Stars: ✭ 210 (+128.26%)
Mutual labels:  react-components, node-js, express-js
node-express-mongo-passport-jwt-typescript
A Node.js back end web application with REST API, user JWT authentication and MongoDB data storage using TypeScript
Stars: ✭ 51 (-44.57%)
Mutual labels:  node-js, passportjs, express-js
react-app-simple-chat-app
A Simple Chat Application using MERN stack (MongoDB, Express JS, React JS, Node JS) and Socket.io for real time chatting
Stars: ✭ 41 (-55.43%)
Mutual labels:  css3, mongodb-atlas, react-hooks
express-boilerplate
ExpressJS boilerplate with Socket.IO, Mongoose for scalable projects.
Stars: ✭ 83 (-9.78%)
Mutual labels:  node-js, express-js
MERN-Ecommerce
An E-commerce app built using MERN stack. It has 4 social login options and implements email verification as well. Stripe and Paypal payment gateways are implemented.
Stars: ✭ 50 (-45.65%)
Mutual labels:  passportjs, express-js
book-fullstack-react
Fullstack React: The Complete Guide to ReactJS and Friends by Anthony Accomazzo
Stars: ✭ 100 (+8.7%)
Mutual labels:  react-components, react-hooks
react-theme
Production ready Wordpress theme built with React, Redux, Redux-Thunk, Intl, React Router v4, etc... and packaged by Webpack 2. Enjoy!
Stars: ✭ 14 (-84.78%)
Mutual labels:  css3, react-components
aprendendo-css
VΓ‘rios desenhos feitos com CSS e SCSS (e as vezes um pouco de JavaScript)
Stars: ✭ 56 (-39.13%)
Mutual labels:  css3, css-animations
reddit-clone
A reddit clone written using node.js / express.js / mongodb / passport.js. https://seiya-beddit.herokuapp.com/
Stars: ✭ 84 (-8.7%)
Mutual labels:  node-js, express-js
moesif-nodejs
Moesif Nodejs Middleware Library (formerly Moesif-Express)
Stars: ✭ 36 (-60.87%)
Mutual labels:  express-middleware, express-js
Landing-Page-Animation
Landing page animation made using CSS
Stars: ✭ 45 (-51.09%)
Mutual labels:  css3, css-animations
hexa
Awesome Css Animation. The documentation =>
Stars: ✭ 32 (-65.22%)
Mutual labels:  css3, css-animations
react-guidebook
πŸ“š React ηŸ₯θ―†ε›Ύθ°± ε…³δΊŽζ¦‚εΏ΅γ€ζŠ€ε·§γ€η”Ÿζ€γ€ε‰ζ²Ώγ€ζΊη ζ ΈεΏƒ
Stars: ✭ 22 (-76.09%)
Mutual labels:  react-components, react-hooks
Backend-NodeJS-Golang-Interview QA
A collection of Node JS and Golang Backend interview questions please feel free to fork and contribute to this repository
Stars: ✭ 122 (+32.61%)
Mutual labels:  node-js, express-js
web-animation-club
CSS controlled animations with transitionEnd, onTransitionEnd, animationend, onAnimationEnd events and frame throwing. Tiny javascript library with cross-browser methods to handle css animation/transition callbacks and event loop frame throwing. πŸ“šπŸ–₯οΈπŸ“±
Stars: ✭ 52 (-43.48%)
Mutual labels:  css3, css-animations
passport-saml-example
PassportJS SAML example
Stars: ✭ 118 (+28.26%)
Mutual labels:  passportjs, passport-strategy
react-remark
React component and hook to use remark to render markdown
Stars: ✭ 81 (-11.96%)
Mutual labels:  react-components, react-hooks
react-awesome-reveal
React components to add reveal animations using the Intersection Observer API and CSS Animations.
Stars: ✭ 564 (+513.04%)
Mutual labels:  css-animations, react-components

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 - 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 - Javascript runtime
  • React - A javascript library for building user interfaces
  • Babel - A transpiler for javascript
  • Webpack - A module bundler
  • SCSS - A css metalanguage
  • Bootstrap 4 - Bootstrap is an open source toolkit for developing with HTML, CSS, and JS
  • Axios - Promise based HTTP client for the browser and node.js
  • Express js - 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 - MongoDB Atlas is the global cloud database service for modern applications.
  • Passport Js - 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

node -v
npm -v

Install

Follow the following steps to get development environment running.

  • Clone 'MERN-BUS-APP.git' repository from GitHub

    git clone https://github.com/AdityaKumawat97/MERN-BUS-APP.git

    OR USING SSH

    git clone [email protected]:AdityaKumawat97/MERN-BUS-APP.git
  • Install node modules

    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.

    cd frontend
    npm start
    cd..
    cd backend
    npm run devStart

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].