/cinema-plus

Online Movie Ticket Booking web app with MERN Stack

Primary LanguageJavaScriptMIT LicenseMIT

Cinema +

MongoDB, Expressjs, React/Redux, Nodejs

GitHub license npm version

Cinema + is an online Movie Ticket Booking web app with MERN Stack.

  • Online Booking System
  • Admin Dashboard
  • Dark Theme UI

MERN is a fullstack implementation in MongoDB, Expressjs, React/Redux, Nodejs.

MERN stack is the idea of using Javascript/Node for fullstack web development.

Features!

  • Add / Update / Delete Movies
  • Add / Update / Delete Cinemas
  • Add / Update / Delete Showtimes
  • Add / Update / Delete Reservations
  • Add / Update / Delete Users
  • Generate QR Code for reservation check in
  • Send HTML emails invitations

You can also:

  • Export QR Code pass as PDF

Tech

Cinema + uses a number of open source projects to work properly:

  • MongoDB - A document-oriented, No-SQL database used to store the application data.
  • ExpressJS - fast node.js network app framework.
  • ReactJS - A JavaScript library for building user interfaces.
  • Redux - A predictable state container for JavaScript apps.
  • nodeJS - A JavaScript runtime built on Chrome's V8 JavaScript engine

Installation

Cinema + requires Node.js to run.

Set environment variables

$ Create a .env file in your server and client folder
$ See the .env sample
create a mongodb database and add your connection string into .env file

Install the dependencies and devDependencies

$ git clone https://github.com/georgesimos/Movie-app.git
$ npm install
$ cd server npm install && npm start
$ cd client npm install && npm start

Start the server.

$ cd server 
$ npm install 

Start the client.

$ cd client 
$ npm install 
$ npm start

Start from root path

$ npm run server
$ npm run client

Plugins

Cinema + is currently extended with the following plugins. Instructions on how to use them in your own application are linked below.

Server

Plugin README
concurrently plugins/concurrently/README.md
bcryptjs plugins/bcryptjs/README.md
express plugins/express/README.md
googleapis plugins/googleapis/README.md
jsonwebtoken plugins/jsonwebtoken/README.md
mongoose plugins/mongoose/README.md
multer plugins/multer/README.md
nodemailer plugins/nodemailer/README.md
nodemon plugins/nodemon/README.md
qrcode plugins/qrcode/README.md

Client

Plugin README
fullcalendar plugins/fullcalendar/README.md
material-ui plugins/material-ui/README.md
moment plugins/moment/README.md
jspdf plugins/jspdf/README.md
react plugins/react/README.md
react-facebook-login plugins/react-facebook-login /README.md
react-google-login plugins/react-google-login/README.md
react-redux plugins/react-redux/README.md
react-router-dom plugins/react-router/README.md
react-slick plugins/react-slick/README.md
redux plugins/redux/README.md

Todos

  • Add Light Mode / More themes

Screenshots!

Movie Page

More Screenshots Booking Page

Booking Invitations

Guest Dashboard Page

My Account Page

Admin Home Page

Admin Cinema Page

Admin Movie Page

Admin Reservation Page

Admin Reservation Calendar

License

MIT