Skip to content

Instantly share code, notes, and snippets.

@gajjardarshithasmukhbhai
Last active March 24, 2023 19:48
Show Gist options
  • Save gajjardarshithasmukhbhai/6317399928cbec363cb063b87442294a to your computer and use it in GitHub Desktop.
Save gajjardarshithasmukhbhai/6317399928cbec363cb063b87442294a to your computer and use it in GitHub Desktop.
Micro Front End in React

Welcome in Micro Front End Architecture

Monolithic Front End Architecture

uHeqbT.png

Micro Front End Architecture

uHedh0.png

  • Micro Front End is more Superior as compare to monolithic Because If you have Enterprise level of Big Application so you have tons of componenet so that time you have to wait for other development or till it's not complete
  • But in Micro Front End all components are working independently so no need to dependent of other component
  • Ex.we are using the npm package okay. so in that package that component we are add in our project, so they all are independent. so we no need to worry of other project team component or any dependency over there.
  • In microFront End all commnication done by the API in micro Front End component dependent of others

Ex uHeNA9.png

Big Advantage uHeCKM.png

  • Different Engineering Team Focus on their Componenet. THis is same kind of concept like the micro-service Architecture. Ex. Basically In ONRX Project we made each and every different Lambda Functions to handle our functionality. but the things is they all are independent means let's say any-one function broken or Any Error so that time that function has been effected not other one, and when we made any changes so we had to go that attached API that connected with different Lambda Function and that changes reflected that one also not other lambda Function

upMenq.png

Understanding the Micro Front Architecture Major Categories

upTlyK.png

Build-Time Integartion
  • Ex, 3 Pepole of the Engineer Team Suppose work on the one module. so they are made and deploy that tightly container in NPM registry.
  • so other team might install as dependency like we install as package and use that. so we say that overall application module divided into the chunk and that chunk connect togehter to make entire robust Application.

uphkGz.png

Run-Time Integration

uph46X.png

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment