When we talk about React or Angular and Vue as the side note, we can build two kinds of applications with all these libraries and frameworks, Single page applications and Multi-page applications.

Table of Contents

If you prefer watching a video

Try CodeMix for fast and productive React Development.

   

Single page applications

  • In Single page applications, we only get back single HTML file by the server once.
  • The time when the user visits the page example.com after everything is managed by Javascript.
  • With ReactJs the entire page consists of components which are rendered and handled by Javascript.

Multi-page applications

  • In Multi-page apps, we get back multiple HTML pages, where each page has content for given Router.
  • In Multi-page apps, we only use React to create widgets.
  • For example, individually created components which we dump to that page but not entire page is managed by React, you can see this in many apps.

 

ReactJs Control over entire Applications

Single Page Applications and Multi Page Applications in React

In single page applications, our page is built with components and every component is a React Component and also the entire page is managed by root React component and it’s just under React control.

REactjs multiple appsIn the Multipage apps in second hand, we split up our components but a lot of pages are going to be normal HTML pages, and widgets we dump in like an Image gallery that is managed by React, so the entire page is not under React control.

 

The Better approach

But the popular approach now days is Single page applications approach because you manage the entire page with Javascript you never have to go back to the server and reload the page. that is the amazing use to experience because everything happens instantly.

Here you are not just showing spinners page where a user can’t do anything but a page which is still a reactive web app.