Code Monkey home page Code Monkey logo

mern-movie-reviewer's Introduction

MERN-Movie-Reviewer

Full stack web app using the MERN stack (MongoDB, Express, React, and Node.js) to CRUD (Create, Read, Update and Delete) movie reviews and ratings.

MERN:

  • MongoDB: Document based open source database
  • Express: Web application framework that makes it simpler to code a web server in JavaScript.
  • React: Front-end library for building user interfaces.
  • Nodes.js: Allows Javascript to run outside a browser in places like a web server.

Backend Dependencies:

  • express
  • cors: Cross-origin resource sharing, allows ajax request to skip the same origin policy and access resources from remote hosts. The cors package provides an express middleware than can enable cors with different options. Basically going it make it so we can make the right connections on our network that we need to make.
  • mongodb:
  • dotenv: Loads environmental variables from a dot emv file in the process. Environmental variables can be stored in a file.
  • nodemon: Nodemon helps develop node.js based applications by automatically restarting the node application.

Frontend Dependencies:

  • bootstrap
  • react-router-dom@5: To route different urls to different pages on our site.
  • axios: Axios for the get/post/put/delete requests.

To use:

  • Open 2 command prompts.
  • Navigate to "backend" folder and run ~nodemon start to start the backend.
  • Navigate to "frontend" folder and run ~npm start to start the front end.
  • Your browser will open up to your localhost and you will be brought to the homepage.

Search for movies using the Search by Name, Search by Release Year or Genre queries.

Home Page

After logging in, the Home page is updated with more tab option.

Home Page Logged in

Clicking "View Reviews" on a movie gives you the option to add a review/rating for the movie.

Movie Page

Add your review.

Add Review Page

Movie now displays your review.

Movie Page with Review

Review tab displays all your reviews which you can edit.

Reviews Page

mern-movie-reviewer's People

Contributors

timothyjan avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.