How to Get Browser Details in React JS?
Sep 26, 2022 . Admin
Hi Friends,
This tutorial is focused on how to get browser details in react js. This example will help you how to get browser name in react js. I explained simply about react js get browser name. I would like to show you react js get browser details.
Sometimes, we need to get browser name, version, layout etc in react js app. Then i will help you how to get browser details in react js. we will use "platform" npm package to get browser name in react js app.
So, let's see follow the below step to create simple example.
Step 1: Create React JS AppIn this step, open your terminal and execute the following command on your terminal to create a new react app:
npx create-react-app react-app-exampleStep 2: Install platform npm Package
In this step, we need to install platform npm package to use their functions. let's run below command:
npm install platformStep 3: Update App.js Component
Here, we will display browser name, version and layout using platform. let's put the below code on it.
src/App.jsimport './App.css'; import platform from 'platform'; function App() { return ( <div className="App"> <h1>How to Get Browser Details in React JS? - MyWebtuts.com</h1> <h2>Your Browser Details is: </h2> <h4>Name: {platform.name}</h4> <h4>Version: {platform.version}</h4> <h4>Layout: {platform.layout}</h4> </div> ); } export default App;Step 4: Run React JS App
In the last step run your project using bellow command.
npm startOutput
I hope it can help you...