A Blog full of Web Projects

16 projects tagged with "react"

  • Webpack 5 boilerplate with React and TypeScript

    28-July-2026

    A Webpack 5 boilerplate with React and TypeScript

    Try the demo...

    The code at GitHub

    A Webpack 5 boilerplate with React and TypeScript. Babel 7 compiles the TypeScript files to ES5. The Webpack module "fork-ts-checker-webpack-plugin" handles the type checking. The demo App serve React routing, a Webpack logo, my photo with some info and compiled PostCSS. Bootstrap CSS was used to make the demo mobile friendly.


  • Webpack 5 boilerplate with React

    26-July-2026

    A Webpack 5 boilerplate with React

    Try the demo...

    The code at GitHub

    A Webpack 5 boilerplate with React. The demo App serve React routing, a Webpack logo, my photo with some info and compiled PostCSS. Bootstrap CSS was used to make the demo mobile friendly.


  • .NET 10 REST API with Dapper SQLite and xUnit

    09-June-2026

    .NET 10 REST API with C# and Dapper ORM + SQLite DB consuming a React 16 Client + Unit Testing

    Unit Testing:

    • xUnit - Used with one of the .NET Web API

    Coverage Reports are generated for visualize the result of Unit Testing ( .NET based xUnit )

    Try the demo...

    Dapper is a lightweight Micro-ORM which can be an alternative to Entity Framework Core ORM

    SQLite is local DB and fine for testing and small applications

    Traditional webhosting is used for this Application


  • Node Express REST API Membership system + Email notification - JWT

    16-March-2026

    Node Express REST API Role based Membership system with Email Verification and Forgot Password using Sequelize ORM towards a MySQL DB - Authentication by JWT

    Volta was used for Node Version Management switching between Node versions

    Functionality of the Web App

    • JWT authentication
    • Email sign up and verification
    • Forgot password and reset password functionality
    • Role based authorization with two roles "User" and "Admin"
    • CRUD Account management routes with role based access control

    Tech used for building the Web App

    • Node.js
    • Sequelize used to implement the ORM at the Web API
    • The Node.js Web API is hosted at Azure App Service with the Free App Service Plan
    • One React client at GH Pages which uses DevOps. The React HashRouter solves most 404 / Browser refresh issues at GH Pages
    • One React Client is hosted at a traditional Webhotel
    • The React TypeScript Client is hosted at a traditional Webhotel
    • MySQL as the Database for both Dev + Prod
    • CORS Policy implemented by Node.js and at Azure
    • JWT Token for access secure routes

  • .NET 10 REST API doing HTTP Basic Authentication

    22-February-2026

    React 19 client towards a REST API by .NET 10 with C# using HTTP Basic Authentication

    Traditional webhosting is used for this Application

    The Web Application was made with ASP.NET Core + React and Redux

    Functionality of the Web App

    • HTTP Basic Authentication

    Tech used for building the Web App

    • C#
    • The .NET 10 Web API is hosted at a traditional Webhotel
    • The React 19 Client is hosted at a traditional Webhotel
    • CORS Policy implemented by .NET
    • HTTP Basic Authentication for access secure routes

  • .NET 10 REST API doing JWT Authentication

    22-February-2026

    React 19 client towards a REST API by .NET 10 with C# using JWT Authentication

    Traditional webhosting is used for this Application

    The Web Application was made with ASP.NET Core + React and Redux

    Functionality of the Web App

    • JWT Authentication

    Tech used for building the Web App

    • C#
    • The .NET 10 Web API is hosted at a traditional Webhotel
    • The React 19 Client is hosted at a traditional Webhotel
    • CORS Policy implemented by .NET
    • JWT Authentication for access secure routes

  • Next.js 13 and MongoDB Membership System

    21-February-2026

    Full Stack Next.js Web application with TypeScript and JWT Authentication using MongoDB and Mongoose ODM serving as a Membership System

    Tech used for the Web Application

    • The Next.js Web App is hosted at Vercel Cloud using Serverless Functions
    • Node 22 at Vercel Cloud
    • Next Version 13
    • React 18
    • TypeScript
    • Joi for validation
    • Zustand for state management
    • MongoDB was the choice of NoSQL Document Database
    • Mongoose ODM ( Object Data Modeling ) used for NoSQL Document Database
    • The MongoDB is hosted at Mongo Atlas Cloud Platform

    Try the demo...

    The code at GitHub

    Next.js was used for creating this Full Stack Web application "Static Site Generator" SSG serving as a Membership System with login and registration towards a MongoDB. The Web App is secured by HTTPS and JWT Authentication.


  • Next.js 15 Web App with JWT Auth

    04-January-2026

    A Next.js Web Application with JWT Authentication hosted at Vercel

    Version used for this Web App

    • Node 22.11.0
    • Upgraded from Next 15.0.3 to 15.0.5 due to security
    • React 18.3.1

    Try the demo...

    The code at GitHub

    The Next.js framework being the "Static Site Generator" was used for creating this full stack web application serving as a login system by having a client using the API Routes of Next.js getting the data / User credentials from a JSON file. The web application is secured by HTTPS and JWT Authentication.

    This Next.js Jamstack Web Application is hosted at Vercel Cloud and uses continuous build and deployment


  • Next.js 15 Web App with Basic Auth

    04-January-2026

    A Next.js Web Application with Basic Authentication hosted a Netlify

    Version used for this Web App

    • Node 22.11.0 ( Note: Running Node 20 at Netlify for now )
    • Upgraded from Next 15.0.3 to 15.0.5 due to security
    • React 18.3.1

    Try the demo...

    The code at GitHub

    The Next.js framework being the "Static Site Generator" was used for creating this full stack web application serving as a login system by having a client using the API Routes of Next.js getting the data / User credentials from a JSON file. The web application is secured by HTTPS and Basic Authentication.

    This Next.js Jamstack Web Application is hosted at Netlify Cloud and uses continuous build and deployment


  • Java Spring Boot REST API + MVC using Spring Security

    07-February-2025

    Java Spring Boot 3 REST API + MVC using Spring Security

    Note: Due to the resource limitations of the Microsoft Azure Free App Service Plan, the initial load time will be up to 1 minute. A 403 Status code may happen too!

    The Source code at GitHub

    The below code is an old version with semilar functionality by Spring Boot 2

    The source code at GitHub

    Migration from Java 11 to Java 17 ! Showing and administrate a dataset of persons by a Java REST API and MVC Web Application (Secured by login) using also JSP, JPA, Hibernate, Maven, MySQL and jQuery for the frontend.


  • Java Spring Boot JAX-RS using REST API + MVC

    06-February-2025

    Java Spring Boot 3 JAX-RS Jersey REST API + MVC Application

    The source code at GitHub

    The below code is an old version with semilar functionality by Spring Boot 2

    The source code at GitHub

    Migration from Java 11 to Java 17 ! Showing and administrate a dataset of persons by a Java Jersey REST API and MVC Web Application using also JSP, JAX-RS, JPA, Hibernate, Maven and MySQL. React, Fetch API (Not working in IE), AngularJS and jQuery for the frontend client


  • Node Express REST API Membership system + Email notification - JWT

    05-December-2024

    Node Express REST API Role based Membership system with Email Verification and Forgot Password using Pure SQL towards a MySQL DB - Authentication by JWT

    Try the demo...

    The Node.js Web API was made without any ORM framework like Sequelize

    Functionality of the Web App

    • JWT authentication
    • Email sign up and verification
    • Forgot password and reset password functionality
    • Role based authorization with two roles "User" and "Admin"
    • CRUD Account management routes with role based access control

    Tech used for building the Web App

    • Node.js
    • Pure SQL instead of using ORM like Sequelize
    • The Node.js Web API is hosted at Azure App Service with the Free App Service Plan
    • The React Client is hosted at a traditional Webhotel
    • MySQL as the Database for both Dev + Prod
    • CORS Policy implemented by Node.js and at Azure
    • JWT Token for access secure routes

  • Node Express REST API Membership system + Email notification - JWT and Refresh Token

    02-December-2024

    Node Express REST API Role based Membership system with Email Verification and Forgot Password using Sequelize ORM towards a MySQL DB - Authentication by JWT + Refresh Tokens

    Volta was used for Node Version Management switching between Node versions

    Functionality of the Web App

    • JWT authentication with Refresh Tokens
    • Refresh token rotation
    • Revoked token reuse detection
    • Email sign up and verification
    • Forgot password and reset password functionality
    • Role based authorization with two roles "User" and "Admin"
    • CRUD Account management routes with role based access control

    Tech used for building the Web App

    • Node.js
    • Sequelize used to implement the ORM at the Web API
    • The Node.js Web API is hosted at Azure App Service with the Free App Service Plan
    • The React Client is hosted at a traditional Webhotel
    • MySQL as the Database for both Dev + Prod
    • CORS Policy implemented by Node.js and at Azure
    • JWT Token for access secure routes
    • Refresh Token by HTTP only Cookie to generate new JWT Tokens

  • Next.js 12 - DevOps by GitHub Actions and Pages

    01-December-2024

    Next.js with TypeScript - DevOps by GitHub Actions and hosted at GitHub Pages

    Version used for this Web App

    • Node 20.18.1
    • Next 12.1.6
    • React 18.1.0

    Try the demo...

    The code at GitHub

    A Create Next App with TypeScript using GitHub Actions and Pages as DevOps. This Next.js Web App is one of the default starters with a lot of useful links for learning Next.js.


  • .NET Core 2.2 REST API Role based Membership system

    07-October-2023

    ASP.NET Core 2.2 REST API with C# towards Angular and React serving as Role based Membership system

    Traditional webhosting is used for this Application

    A Web API role based Membership System for authentication and registration managing Users by an Angular or React client / ASP.NET Core 2.2 Web API with C# secured by HTTPS and Authentication by a JWT

    Administrate Posts by an Angular client and the Web API after a successfully login


  • .NET Core 2.0 MVC and REST API with Crud functionality

    15-January-2023

    ASP.NET Core 2.0 REST API with C# showing a dataset of Persons by MVC / Web API

    Traditional webhosting is used for the Application

    Try the demo...

    Showing / Administrate a dataset of persons as a REST API + MVC using C#, MSSQL Database, AngularJS, ReactJS, jQuery, Ajax and JSON dataset. Secured by HTTPS

    The source code at GitHub
Software Developer - Per Olsen - Denmark