Description

Get hands-on and learn to build a full-stack app using React.js as the frontend and its web API for the backend

In this course, you will learn how to build a web application from scratch. You'll use React.js for the frontend and Microsoft SQL Server as the database; you'll also use the ASP.NET Web API to create APIs. This is not a comprehensive guide to React.js concepts; instead, this course adopts a practical approach as you learn to build a web app using some of the most commonly used React.js controls. Make sure you check out the additional resources section for theoretical/advanced concepts.
• Install Angular 8 and create projects
• Install Bootstrap and add material designs to your Angular project
• Consume API methods (GET, PUT, POST, and DELETE)
• Angular routing
• Use form fields with drop-downs and date pickers
By the end of this course, you will be able to create a simple full-stack app from scratch.
All the code and supporting files for this course are available at - https://github.com/PacktPublishing/Learn-React-JS-and-Web-API-by-Creating-a-Full-Stack-Web-App

What You Will Learn

Learn React.js and its web API.
Implement the GET, POST, PUT, and DELETE methods.
Learn about the Material UI

Audience

This course is for web developers, .NET developers, Java developers, and UI developers and others who will benefit from this course.

Approach

The structure of this course will empower you to move forward smoothly and efficiently gain as much knowledge as possible. This course is incredibly comprehensive and uses real-world projects; the advanced concepts you'll master will ensure you can build your own apps in a very effective way.

Key Features

Learn to build a full-stack web app. * Create a web API project * Implement routing for your React applications

Github Repo

https://github.com/packtpublishing/learn-react-js-and-web-api-by-creating-a-full-stack-web-app

About the Author

Frahaan Hussain

Frahaan Hussain is a 3 time published author with over 500,000 students enrolled on his courses online and more than 40,000 loyal YouTube followers. Before he started teaching programming online, Frahaan graduated top of his class with honours in Computer Games Programming from De Montfort University. After just 2 years, he was invited back to become module leader at his Alma Mater. While consulting with huge clients such as Google and Chukong, Frahaan continues to further the education of others and himself.

Vinay Kumar

Vinay currently works as a Software Engineer. His core area of expertise is development of Web Applications and Business Intelligence. He has worked on technologies such as .NET, Angular, React JS, SSIS and Power BI.

Course Outline

1. Introduction

Introduction: Introduction

2. Web API

1. Install SQL Server and SSMS

Web API: Install SQL Server and SSMS

2. Install Visual Studio 2019

Web API: Install Visual Studio 2019

3. Create Database in MS SQL Server

Web API: Create Database in MS SQL Server

4. Create Department Table in MS SQL

Web API: Create Department Table in MS SQL

5. Create Employee Table in MS SQL

Web API: Create Employee Table in MS SQL

6. Create Web API project in Visual Studio

Web API: Create Web API project in Visual Studio

7. Force Web API to output JSON response only

Web API: Force Web API to output JSON response only

8. Install Postman client

Web API: Install Postman client

9. Create Model Class for our Application

Web API: Create Model Class for our Application

10. Create Web API Controllers

Web API: Create Web API Controllers

11. Implement GET method in Web API

Web API: Implement GET method in Web API

12. Implement POST method in Web API

Web API: Implement POST method in Web API

13. Implement PUT method in Web API

Web API: Implement PUT method in Web API

14. Implement DELETE method in Web API

Web API: Implement DELETE method in Web API

3. React JS

1. Install Node JS

Movement: Install Node JS

2. Install Visual Studio Code

Movement: Install Visual Studio Code

3. Create React JS Project

Movement: Create React JS Project

4. Install react-bootstrap

Movement: Install react-bootstrap

5. Create React Components

Movement: Create React Components

6. Implement Routing for our React Application

Movement: Implement Routing for our React Application

7. Add Navigation menu

Movement: Add Navigation menu

8. React bootstrap Table

Movement: React bootstrap Table

9. Consume GET method and display Department details

Movement: Consume GET method and display Department details

10. The CORS problem

Movement: The CORS problem

11. Modal Pop up using react bootstrap

Movement: Modal Pop up using react bootstrap

12. Add Form Fields

Movement: Add Form Fields

13. Consume POST method in react js for Departments Table

Movement: Consume POST method in react js for Departments Table

14. Refresh react bootstrap table on insertion

Movement: Refresh react bootstrap table on insertion

15. Snackbar component in Material design

Movement: Snackbar component in Material design

16. Edit Modal and PUT method for Department

Movement: Edit Modal and PUT method for Department

17. Delete method for Department

Movement: Delete method for Department

18. GET and DELETE Methods for Employee

Movement: GET and DELETE Methods for Employee

19. Modal and POST for Employee

Movement: Modal and POST for Employee

20. Dropdown and Datepicker in Form

Movement: Dropdown and Datepicker in Form

21. Modal and PUT method for Employee

Movement: Modal and PUT method for Employee

Course Images

Learn React JS and Web API by Creating a Full Stack Web App.

By Packt

Booking options

Highlights

Description

Course Content

About The Provider

Tags

Reviews