react Archives - BezKoder

react-spring-boot-postgresql-crud-example-feature-image

Spring Boot + React + PostgreSQL example: Build a CRUD App

Last modified: November 26, 2020 bezkoder Leave a comment

In this tutorial, we will learn how to build a full stack Spring Boot + React.js + PostgreSQL example with a CRUD App. The back-end server uses Spring Boot with Spring Web MVC for REST APIs and Spring Data JPA for interacting with PostgreSQL database. Front-end side is made with React, React Router, Axios & Bootstrap.

Other databases:
– Spring Boot, React, MySQL: Build a CRUD Application
– Spring Boot, React & MongoDB example: Build a CRUD Application

Run both projects in one place:
How to integrate React.js with Spring Boot

How to integrate React.js with Spring Boot

Last modified: November 17, 2020 bezkoder Leave a comment

In this tutorial, I will show you step by step to integrate React.js with Spring Boot so that Spring Boot project can serve React App. You will also know how to configure React SPA Routing to avoid Whitelabel Error Page.

Serverless:
– React Firebase CRUD with Realtime Database
– React Firestore CRUD App example | Firebase Cloud Firestore

react-redux-login-registration-example-feature-image

React Redux Login, Logout, Registration example with Hooks

Last modified: November 29, 2020 bezkoder 10 Comments

In this tutorial, we’re gonna build a React Redux Login, Logout, Registration example with LocalStorage, React Router, Axios and Bootstrap using React.js Hooks. I will show you:

JWT Authentication Flow for User Registration & User Login, Logout
Project Structure for React Redux JWT Authentication, LocalStorage, Router, Axios
Working with Redux Actions, Reducers, Store for Application state
Creating React Function Components with Hooks & Form Validation
React Function Components for accessing protected Resources (Authorization)
Dynamic Navigation Bar in React App

Fullstack (JWT Authentication & Authorization example):
– React + Spring Boot
– React + Node.js Express

The example without using Hooks (but React Components):
React Redux Login, Logout, Registration example

The example without using Redux:
React Hooks: JWT Authentication (without Redux) example

Integrate React with Node.js Express on same Server/Port

Last modified: November 13, 2020 bezkoder Leave a comment

In this tutorial, I will show you step by step to integrate React project with Node.js Express Rest API so that we only need to run both on same Server/Port. You will also know how to configure React SPA Routing to avoid 404 on refresh.

Serverless:
– React Firebase CRUD with Realtime Database
– React Firestore CRUD App example | Firebase Cloud Firestore

react-multiple-files-upload-progress-bar-feature-image

React Multiple Files upload example with Progress Bar

Last modified: September 17, 2020 bezkoder Leave a comment

In this React tutorial, I will show you way to build React Multiple Files upload example using Axios and Multipart File for making HTTP requests, Bootstrap for progress bar and display list of files’ information (with download url).

More Practice:
– React File Upload/Download example with Spring Boot Rest Api
– React.js CRUD example to consume Web API
– React JWT Authentication (without Redux) example

react-file-uload-axios-progress-bar-feature-image

React File Upload with Axios and Progress Bar to Rest API

Last modified: September 17, 2020 bezkoder Leave a comment

In this tutorial, I will show you way to build React.js File Upload example with Rest API. The React App uses Axios and Multipart File for making HTTP requests, Bootstrap for progress bar. You also have a display list of files’ information (with download url).

More Practice:
– React Multiple Files upload example with Progress Bar
– React.js CRUD example to consume Web API
– React JWT Authentication (without Redux) example

React + Node.js Express: User Authentication with JWT example

Last modified: November 19, 2020 bezkoder 14 Comments

In this tutorial, we will learn how to build a full stack React.js + Express Authentication & Authorization example. The back-end server uses Node.js Express with jsonwebtoken for JWT authentication and Sequelize for interacting with MySQL database. The front-end will be created with React, React Router, Axios. We’ll also use Bootstrap and perform Form validation.

Run both projects in one place:
How to integrate React with Node.js Express on same Server/Port

Tag: react