/DevConnector

Full Stack Project React + Automation Puppeteer

Primary LanguageJavaScript

Full Stack project - MERN Stack Front To Back.

Welcome to "MERN Stack Front To Back". In this Project i'l build an in depth full stack social network application using Node.js, Express, React, Redux and MongoDB along with ES6+. We will start with a blank text editor and end with a deployed full stack application.

This project includes:

  • Building an extensive backend API with Node.js & Express
  • Protecting routes/endpoints with JWT (JSON Web Tokens)
  • Extensive API testing with Postman
  • Integrating React with our backend in an elegant way, creating a great workflow
  • Building our frontend to work with the API
  • Using Redux for app state management
  • Creating reducers and actions for our resources
  • Creating many container components that integrate with Redux
  • Testing with the Redux Chrome extension

Creating a build script, securing our keys and deploy to Heroku using Git.

UPDATE: The entire project was updated to use React Hooks, Async/Await and better overall code.

This is NOT an "Intro to React" or "Intro to Node" project. It is a practical hands on project for building an app using the incredible MERN stack. I do try and explain everything as I go so it is possible to follow without React/Node experience but it is recommended that you know at least the basics first.

What you'll see in the project:

  • Build a full stack social network app with React, Redux, Node, Express & MongoDB
  • Create an extensive backend API with Express
  • Use Stateless JWT authentication practices
  • Integrate React with an Express backend in an elegant way
  • React Hooks, Async/Await & modern practices
  • Use Redux for state management
  • Deploy to Heroku with a postbuild script

Are there any course requirements or prerequisites?

  • A good understanding of JavaScript & ES6 Fundamentals
  • React & Node Basics

Who this project is for:

  • Anyone that wants to learn how to build and deploy a full stack MERN application

Logo