Build fullstack app with Node.Js, Loopback4, React and Hooks

Modern ways to build full-stack web applications with Node.js, Loopback 4, Typescript, React, Mysql, React Hooks

4.15 (19 reviews)
Udemy
platform
English
language
Web Development
category
instructor
154
students
8.5 hours
content
Feb 2021
last update
$49.99
regular price

What you will learn

Build REST APIs with Typescript

Build APIs with Loopback 4

Build Frontend with React

Learn React Hooks

Learn Redux in depth

Build full-stack application with React, React Hooks, Redux, Nodejs

Connect Frontend app with Backend Application

Typescript Fundamentals

Description

LoopBack is an award-winning, highly extensible, open-source Node.js and TypeScript framework based on Express. It enables you to quickly create APIs and microservices composed from backend systems such as databases and SOAP or REST services.

The diagram below demonstrates how LoopBack serves as a composition bridge between incoming requests and outgoing integrations. It also shows the different personas who are interested in various capabilities provided by LoopBack.

React is an open-source, front end, JavaScript library for building user interfaces or UI components. It is maintained by Facebook and a community of individual developers and companies. React can be used as a base in the development of single-page or mobile applications

Hooks are the new feature introduced in the React 16.8 version. It allows you to use state and other React features without writing a class. Hooks are the functions which "hook into" React state and lifecycle features from function components. It does not work inside classes.

TypeScript extends JavaScript by adding types.

By understanding JavaScript, TypeScript saves you time catching errors and providing fixes before you run code.

Any browser, any OS, anywhere JavaScript runs. Entirely Open Source.

Node.js is an open-source, cross-platform, back-end JavaScript runtime environment that runs on the Chrome V8 engine and executes JavaScript code outside a web browser

MySQL is an open-source relational database management system. Its name is a combination of "My", the name of co-founder Michael Widenius's daughter, and "SQL", the abbreviation for Structured Query Language.

We are going to combine these tools and build a full-stack sample application. By the end of this course, you will be able to contribute to any open source project in MERN stack. You will learn the real world applications of React, Readux, Hooks and Node.js

Content

Nodejs Basics (Optional)

Introduction to Nodejs
Sending HTML in Response
Reading and Writing Files
Creating Custom Module

NPM The Node Package Manager

Running Node App using Npm scripts
Installing External Dependencies
Package Dependencies
Sementic Versioning
Listing package details
Upgrading Local Packages
Publish your custom Module to NPM
Updating your published module

Express Basics and REST API BASICS

Introduction
What is REST API
Creating Web Server in Express
Set Enviroment Variables
Route Parameters
GET API Endpoint
POST API Endpoint
DELETE API Endpoint
Update API Endpoint

Typescript Fundamentals

Typescript Setup
Basic Types
Types in Typescript
Operators, Decisions and Loops
Functions Basics
Interfaces
Classes
Modules
Generics Types
Generics in more depth

Typescript Generics

01-What are Generics
02-Typescript Setup and Installation
03-Generic Function
04-Generic Function T Array Type
05-Generic Function with Multiple Type Variables
06-Generic Constraints
07-Generic Interfaces to describe Object Properties
08-Create Interface to describe Function Type
09-Generic Classes and Interfaces

Typescript Decorators

01-Introduction-to-decorators
02-Arguments in Method Decorators
03-Configurable Decorator using Decorator Factory
04-Property-Decorator
05-Parameter-Decorator
06-Class Decorator

Getting started with Loopback 4

Introduction to Loopback 4
Getting started with Loopback 4

CRUD with Loopback 4

01-What is Loopback Model
02-Creating-your-first-Loopback-model
03-Creating Datasource
04-Creating Repository for CRUD Operations
05-Creating Controller to define REST API Operations
06-Test Loopback REST APIs using Explorer
07-Digging into Loopback Repositories

Connecting with Databases

01-Installing-MysQL-Server
02-Connecting Mysql Database with Loopback
03-Set id property to Auto-Increment

Relations

01-Implement HasMany Relation
02-Implement BelongsTo Relation
03-Implement HasOne Relationship

React Hooks Fundamentals

01-ueState Hook
02-Fetching Data using ComponentDidMount
03-Fetching Data using useEffect
04-using async/await with useEffect
05-Running SideEffect after every render
06-Run useEffect on specific Dependency
07-useReducer Demo
08-useContext Demo

Redux Fundamentals

01-Understand the Redux API
02-Building First App with Redux

02- Build Frontend App with React, Redux and React Hooks

01-Project Setup
02-Basic Layout to render the Data in Table
03-Creating Action Types to Fetch Songs
04-Creating Reducer to update the state
05-Send API Request in Redux
06-Rendering Data in the Table
07-Refactor List Item into Separate Component
08-Implement Delete Action Creator
09-Confirmation box before Deleting Record
10-Creating Forms in React and Redux
11-Adding Form Validations using React Hook Form
12-Send API request to create new Record
13-Use same Component to Update and New Record
14-Fetch Single Record on the based on ID
15-Set data to the Form
16-Send update record request in React and Redux

Connecting Frontend Application with Backend

Connect Loopback 4 Application with React

Screenshots

Build fullstack app with Node.Js, Loopback4, React and Hooks - Screenshot_01Build fullstack app with Node.Js, Loopback4, React and Hooks - Screenshot_02Build fullstack app with Node.Js, Loopback4, React and Hooks - Screenshot_03Build fullstack app with Node.Js, Loopback4, React and Hooks - Screenshot_04

Coupons

DateDiscountStatus
2/10/202191% OFF
expired

Charts

Price

Build fullstack app with Node.Js, Loopback4, React and Hooks - Price chart

Rating

Build fullstack app with Node.Js, Loopback4, React and Hooks - Ratings chart

Enrollment distribution

Build fullstack app with Node.Js, Loopback4, React and Hooks - Distribution chart
3820368
udemy ID
2/2/2021
course created date
2/10/2021
course indexed date
Bot
course submited by