3.1. useEffect and Axios for Requests | Full Stack Web Development Tutorial for Beginners
On this video we connect our React front end with our Node server and introduce the useEffect hook and axios for http requests.
In this tutorial series, I'll walk you through how to build a todo app using React on the front end, and Node on the back end.
We'll start by bootstrapping the React application using create-react-app (CRA) and learning how to manage things like state and component lifestyle using hooks. You'll also learn how to control a form component in React.Our todo app will have full CRUD functionality.
Then we'll create a Node server with a SQLITE database so our todo data will persist. You'll learn how to use KnexJS to run queries on the database to perform those CRUD operations.
What you'll need:
- A text editor. I prefer VSCode, and it's what i'll be using in this series.
- A browser with React Dev Tools installed. I'm using Firefox Developer Edition, but Chrome is also a good choice.
- A good understanding of HTML and CSS and at least some knowledge of JavaScript.
Front End Source Code 👉 https://github.com/techendeavor/react...
Back End Source Code 👉 https://github.com/techendeavor/todo-...
If this is your first time here, be sure to hit the subscribe button, and if you like the video, you know what to do!
Front end web development tutorial.
Back end web development tutorial.
Front end web developer tutorial.
Back end web developer tutorial.
________________________________________________________________________
React Todo App
-------------------------
1.1 Setting up the Project • 1.1. Setting up the Project | Full St...
1.2 Components and Props • 1.2. Components and Props | Front End...
1.3 State & Form Handling • 1.3. State & Form Handling | Front En...
1.4 CRUD Update and Delete • 1.4. CRUD Update and Delete | Front E...
Node Server
--------------------
2.1 Set Up Node Server with Express • 2.1. Set Up Node Server with Express ...
2.2 Middleware and REST Endpoints • 2.2. API Tutorial Middleware & Endpoi...
2.3 Initialize Database with Knex • 2.3. Initialize Database with Knex | ...
2.4 Create, Read, Update, Delete REST • Video
Connecting the front end to the back end
-----------------------------------------------------------------
3.1. useEffect and Axios for Requests • 3.1. useEffect and Axios for Requests...