title: 404 whilst refreshing react routes with laravel?
body: <p>Working with a react laravel based project, and I was following a tutorial in order to see how both interact with each other. The application consist of making a simple <code>CRUD Application</code>, with three routes :</p>
  
  <ul>
  <li><code>/</code> Home route</li>
  <li><code>/create</code> create a project route</li>
  <li><code>/{id}</code> single project route</li>
  </ul>
  
  <p>I am having an issue debugging an error related to the <code>third route</code>, to elaborate <code>localhost:8000/7</code> will bring the project with <code>id 7</code> and it works fin upon creating the project, or upon accessing it from <code>/</code>, But if I want to access it via typing the full url like <code>localhost:8000/7</code>, I am getting <code>404 not found</code>.</p>
  
  <p><a href="https://i.stack.imgur.com/NKOP3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/NKOP3.png" alt="enter image description here"></a></p>
  
  <p>I am missing something, and I can't figure it out ??</p>
  
  <p><code>App.js</code>: </p>
  
  <pre><code> import React, { Component } from "react";
  import ReactDOM from "react-dom";
  import { BrowserRouter, Route, Switch } from "react-router-dom";
  import Header from "./Header";
  import ProjectsList from "./ProjectsList";
  import NewProject from './NewProjects';
  import SingleProject from "./SingleProject";
  import { Provider } from 'react-redux';
  import { createStore } from 'redux';
  import reducer from '../reducers/index';
  const store = createStore(reducer)
  class App extends Component {
      render() {
          return (
              &lt;Provider store={store}&gt;
                  &lt;BrowserRouter&gt;
                      &lt;div&gt;
                      &lt;Header /&gt;
                          &lt;Switch&gt;
                              &lt;Route exact path="/" component={ProjectsList} /&gt;
                              &lt;Route path="/create" component={NewProject} /&gt;
                              &lt;Route path="/:id" component={SingleProject} /&gt;
                          &lt;/Switch&gt;
                      &lt;/div&gt;
                  &lt;/BrowserRouter&gt;
              &lt;/Provider&gt;
          );
      }
  }
  
  ReactDOM.render(&lt;App /&gt;, document.getElementById("app"));
  </code></pre>
  
  <p>web.php:</p>
  
  <pre><code>&lt;?php
  
  Route::get('/', function () {
      return view('welcome');
  });
  </code></pre>
  
  <p>api.php:</p>
  
  <pre><code>&lt;?php
  
  use Illuminate\Http\Request;
  
  
  
  Route::middleware('auth:api')-&gt;get('/user', function (Request $request) {
      return $request-&gt;user();
  });
  
  Route::get('projects', 'ProjectController@index');
  Route::post('projects', 'ProjectController@store');
  Route::get('projects/{id}', 'ProjectController@show');
  Route::put('projects/{project}', 'ProjectController@markAsCompleted');
  Route::post('tasks', 'TaskController@store');
  Route::put('tasks/{task}', 'TaskController@markAsCompleted');
  Route::view('/{path?}', 'app');
  </code></pre>