Building Micro-Frontends With Single-spa, React, and Vue

When I see something new and controversial like this, I always want to try it out myself to see what all of the hype is about and also so I can form my own opinions about the subject.

This led me down the path to creating a micro-frontend application that rendered two separate React applications, along with a single Vue application.

Packaging a React App With Spring Boot

In this article, we're going to discuss how to combine Create React App with Spring Boot to give you a single war file, so that we:

  • Can have our frontend and backend in a single war file with optimized productions build
  • And keep the benefits Create React App gives such as hot reloading

Setup

  1. Must have Java installed. Head over here to download a version.
  2. Must have Maven installed. For Mac, I used Homebrew (brew install maven), but otherwise, head here.
  3. Must have Node installed. For Mac, I used Homebrew (brew install node), but otherwise, head over here.

Note: my IDE of choice is IntelliJ. When working on react code, I usually switch over to VS Code. Feel free to use what makes you feel comfortable. 

Introduction to Micro-Frontend Architecture

As the frontend world grows, the architectural solutions for it should grow as well. The main idea behind micro-frontends is to divide frontends into independent parts so that independent teams can maintain them.

“An architectural style where independently deliverable frontend applications are composed into a greater whole”

A Bit About Blockchain

This article is for anyone who is curious about blockchain but has no idea what it is exactly. The goal is to make you understand what is blockchain, which means that there are few simplifications done while writing this. If you understand what blockchain technology is by the end of this article, then my mission will be accomplished!

Tips: Do not ignore the images mentioned in this article for the best understanding of blockchain technology. Images are very important.