How to display a non-default route on the first page load?

Question

React

There are such routes:

<Switch>
    <Route exact path="/" component={Home}/>
    <Route path="/nobel-laureates" component={About}/>
    <Route path="/usage-statistics" component={History}/>
    <Route component={PageNotFound}/>
</Switch>

Is it possible to display the application at the 2nd route address: "/nobel-laureates" on the first page load instead of the default one???

Answer 1

If you meant the first visit to the site from a particular browser, then you can use localstorage to solve this problem :

import React, { Component } from 'react';
import { Redirect } from 'react-router-dom';

const isVisited = localStorage.getItem("isVisited");

if (!isVisited) {
  localStorage.setItem("isVisited", true);
}


class Home extends Component {
  ...
  render() {
    if (!isVisited) return <Redirect to="/nobel-laureates" />
    ...
  }
}