xulioguimaraes / progress-bar-indicator Goto Github PK

This is an application created using Next.js to demonstrate how to use the Progress bar indicator

Sometimes transitioning from one route to another takes a little longer for a variety of reasons. It can be sending an API request or displaying complex page elements in the background. When this happens, the application stops responding briefly before suddenly switching to the next route. Without a loading indicator, users can infer that nothing has happened or that there is a problem with the page even if the page is just loading content. This can be very confusing for users and can have a negative impact on the user experience with the application. One solution to this problem is to show a progress indicator at the top of the screen. Until the server data is loaded. Progress bar indicators are mostly used by online apps. For example, online stores use them to increase conversion rates; Progress bars guide users through the steps required to complete a purchase.

First, copy the repository

Install the dependencies

npm install
# or
yarn

Run the development server:

npm run dev
# or
yarn dev

Vercel