Build a To-Do List App with Node, Express, React and MongoDB

Build a To-Do List App with Node, Express, React and MongoDB, available at $34.99, has an average rating of 4.4, with 65 lectures, based on 149 reviews, and has 17158 subscribers.

You will learn about The basics of React and React Hooks Integrate React with Express and MongoDB How to build your own React apps How to deploy your React apps How to handle forms in React This course is ideal for individuals who are Programmers looking to learn React or Developers who want to step up their knowledge or Developers trying to learn how to integrate their apps with a database or Developers trying to learn how to build reactive web apps It is particularly useful for Programmers looking to learn React or Developers who want to step up their knowledge or Developers trying to learn how to integrate their apps with a database or Developers trying to learn how to build reactive web apps.

Enroll now: Build a To-Do List App with Node, Express, React and MongoDB

Summary

Title: Build a To-Do List App with Node, Express, React and MongoDB

Price: $34.99

Average Rating: 4.4

Number of Lectures: 65

Number of Published Lectures: 65

Number of Curriculum Items: 65

Number of Published Curriculum Objects: 65

Original Price: $79.99

Quality Status: approved

Status: Live

What You Will Learn

The basics of React and React Hooks

Integrate React with Express and MongoDB

How to build your own React apps

How to deploy your React apps

How to handle forms in React

Who Should Attend

Programmers looking to learn React

Developers who want to step up their knowledge

Developers trying to learn how to integrate their apps with a database

Developers trying to learn how to build reactive web apps

Target Audiences

Programmers looking to learn React

Developers who want to step up their knowledge

Developers trying to learn how to integrate their apps with a database

Developers trying to learn how to build reactive web apps

React is the most popular JavaScript library of the last five years, and the job market is still hotter than ever. Companies large and small hire engineers who understand React, and salaries for engineers are high all the time. So, it’s a great time to learn React! This course starts with zero knowledge assumed! All you need is basic web development and JavaScript knowledge.

In this course, you’ll start with the basics of React and React Hooks and then expand your knowledge by building a fun to-do list app, both the front-end and the back-end, which puts you in a state of learning in a practical way.

After finishing React and React Hooks, you’ll start with building the front-end of the app, you’ll style your app by using a third-party CSS library, build components for your app and imitate the behavior of the back-end. After finishing the front-end, you’ll begin with developing your back-end where you’ll create the database, develop routes in the back-end and finally integrate it with the front-end.

What’s in this course?

An introduction to React.

How React works, building components with React and building UIs with React.

Components, props and dynamic data binding.

Working with user events and state to create interactive applications.

A look behind the scenes to understand how React works under the hood.

A good explanation on how to work with lists and conditional content.

An introduction to React Hooks.

How to debug React apps.

Class-Based components and function components.

Sending HTTP requests and handling transitional states and responses.

Handling forms and user input.

Integrate React with MongoDB and Express.

Develop a back-end separately and integrate it with React.

Create your databases with MongoDB.

Course Curriculum

Chapter 1: Promotional Video

Lecture 1: Promotional Video

Chapter 2: Environment Setup

Lecture 1: Installing Node

Lecture 2: Installing React

Lecture 3: Installing MongoDB Locally

Lecture 4: Installing ExpressJS and Mongoose

Chapter 3: Learn React (Crash Course)

Lecture 1: What is JSX?

Lecture 2: Writing Our First App

Lecture 3: Components #1

Lecture 4: Components #2

Lecture 5: Writing Components

Lecture 6: Understanding Our App Structure

Lecture 7: Props

Lecture 8: Lifecycle Methods

Lecture 9: State #1

Lecture 10: State #2

Lecture 11: Seconds Counter App

Lecture 12: Handling Forms

Lecture 13: Controlled Components

Lecture 14: The Hooks System

Lecture 15: The useState() Hook

Lecture 16: The useEffect() Hook

Lecture 17: Refactoring the Seconds Counter App

Lecture 18: The Return Statement Inside of useEffect()

Lecture 19: Function vs. Class Components

Lecture 20: Making Requests Inside of React

Lecture 21: The Article Searcher App

Lecture 22: Sending Ruquests

Lecture 23: Displaying the Results

Lecture 24: The dangerouslySetInnerHTML Prop

Lecture 25: The key Prop

Lecture 26: Deployment with Vercel

Lecture 27: Alternative Method

Chapter 4: Creating the Front-End

Lecture 1: Thinking About the Front-End

Lecture 2: Using Semantic UI

Lecture 3: Creating the Form #1

Lecture 4: Creating the Form #2

Lecture 5: Turning the Input into a Controlled Component

Lecture 6: Creating Sections

Lecture 7: Creating the To-Do List

Lecture 8: Editing the To-Do Items

Lecture 9: Styling the Input and Listening for Key Codes

Lecture 10: Auto Focusing the Input and Making it a Controlled Component

Lecture 11: Fixing the ESC Key

Lecture 12: Checking To-Do Items

Lecture 13: Simulating Our Back-End

Lecture 14: Fixing Some Problems

Lecture 15: Adding To-Do Items

Lecture 16: Emptying the Input and Form Validation

Lecture 17: Removing To-Do Items

Lecture 18: Writing the Logic of removeTodo()

Chapter 5: Creating the Back-End

Lecture 1: Building our Back-End Structure

Lecture 2: Connecting to Our Database and Creating a Model

Lecture 3: Fetching Data from Our Database

Lecture 4: Solving the Warning Messages

Lecture 5: Creating More Routes

Lecture 6: Inserting & Deleting Records

Lecture 7: Following RESTful Conventions

Lecture 8: Creating the PUT Method

Lecture 9: Responding to Requests

Chapter 6: Binding the Front-End with the Back-End

Lecture 1: Paving the Way for Binding

Lecture 2: Making Requests from Our Front-End

Lecture 3: Solving the CORS Issue

Lecture 4: Creating To-Do Items from Our Front-End

Lecture 5: Deleting To-Do Items from Our Front-End

Lecture 6: Editing To-Do Items from Our Front-End

Instructors

Moath M.
Full-Stack Developer

Rating Distribution

1 stars: 2 votes

2 stars: 3 votes

3 stars: 18 votes

4 stars: 46 votes

5 stars: 80 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!