Git Product home page Git Product logo

cerealbackend's Introduction

General Assembly Logo

MERN Lab

Get ready to build your first MERN app! For this lab, your goal is to build a MERN app with Express on the back-end and React on the front-end.

Prerequisites

  • Mongo, Mongoose, Express and Node
  • React, Components, State and Props
  • React Component Lifecycle Methods (useEffect)
  • React Router
  • A pull request will be used for submission of this assignment

Instructions

  1. Fork and Clone this repo
  2. Fulfill the listed requirements.
  3. Create a Pull request on this repository with links to your repo(s).

Unlike most labs, for this one you will submit your work by making a pull request. If a pull request has not been performed up until now then the instructor will walk the class through performing one at the completion of this readme.

This repo should be used as the backed server.

Create another repo for the Frontend and add a link to that repo when you make the Pull request.

Requirements

Here are the requirment:

  • Build a simple MERN - Mongo-Express-React-Node App
  • Must contain related models (Owner/Fruits or Owner/Dogs)
  • React on the front end must include React Router
  • Node on the backend must be configured as a RESTFull API
  • Both servers much be deployed

Backend

Your app should have a back-end build with Express that persists data to a MongoDB database using Mongoose. Your Express app should return JSON data to your React front-end.

Backend server must be deployed via Heroku.

Backend must be configued for CORS.

Frontend

The front-end for your simple MERN app should be built with React. Instead of using fetch you will now use axios to get data from your Express back-end.

Use React Router to build out separate 'views' for creating, editing, updating and deleting instances of your model.

Your goal should be to have full CRUD functionality on one model with a React front-end and Express back-end.

Frontend server must be deployed via Netlify.

Bonus

  • Style it and make Kenny proud!!!
  • Add useContext to create a global state
  • Add a third model as a sub-document. Finish full CRUD on your first two models before adding any additional subdocuments.

cerealbackend's People

Contributors

jb0nd87 avatar tomatohammado avatar alexmercedcoder avatar jrhorn424 avatar

Watchers

 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.