chore(examples): Updated create-react-app example to use react-router-dom v6

Author: mlaursen

examples/create-react-app/README.md

@@ -6,10 +6,8 @@ This project was bootstrapped with [Create React App](https://github.com/faceboo
 
 This example will setup an example Create React App + ReactMD app that has the following features:
 
-- [jsconfig.json](./jsconfig.json) to allow absolute imports instead of relative imports from the `"src"` directory
-  - `import MyComponent from "components/MyComponent"` instead of `import MyComponent from "../../components/MyComponent"`
 - [\_everything.scss](./src/_everything.scss) to override the default `react-md` theme and feature toggles
-- a reusable [Layout.jsx](./src/components/Layout/Layout.jsx) that:
+- a reusable [Layout.js](./src/components/Layout/Layout.js) that:
   - updates all the icons to use `SVGIcon`s instead of `FontIcon`s
   - initializes the `Layout` component from `react-md` with navigation items
   - uses [react-router-dom](https://www.npmjs.com/package/react-router-dom) as the routing library

examples/create-react-app/jsconfig.json

@@ -15,7 +15,7 @@
     "react": "^17.0.1",
     "react-dom": "^17.0.1",
     "react-md": "latest",
-    "react-router-dom": "^5.2.0",
+    "react-router-dom": "^6.0.2",
     "react-scripts": "4.0.3",
     "sass": "^1.37.5",
     "web-vitals": "^2.1.0"

examples/create-react-app/package.json

@@ -0,0 +1,16 @@
+import { Routes, Route } from 'react-router-dom';
+
+import Layout from './components/Layout';
+import Home from './components/Home';
+import Route1 from './components/Route1';
+
+export default function App() {
+  return (
+    <Layout>
+      <Routes>
+        <Route path="/" element={<Home />} />
+        <Route path="route-1" element={<Route1 />} />
+      </Routes>
+    </Layout>
+  );
+}

examples/create-react-app/src/App.js

@@ -1,13 +1,14 @@
-import ReactDOM from 'react-dom';
 import './index.scss';
+import ReactDOM from 'react-dom';
+import { BrowserRouter } from 'react-router-dom';
+
 import App from './App';
-import { BrowserRouter as Router } from 'react-router-dom';
 import reportWebVitals from './reportWebVitals';
 
 ReactDOM.render(
-  <Router>
+  <BrowserRouter>
     <App />
-  </Router>,
+  </BrowserRouter>,
   document.getElementById('root')
 );