Implement sitemap.

Author: Bart Hazen

.github/workflows/build_default.yml

@@ -16,7 +16,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [12.x]
+        node-version: [14.x]
 
     steps:
     - uses: actions/checkout@v2
@@ -27,4 +27,5 @@ jobs:
     - run: npm install
     - run: npm audit fix
     - run: npm run build --if-present
+    - run: npm run sitemap
     # - run: npm test --passWithNoTests

.github/workflows/deploy_master.yml

@@ -16,6 +16,8 @@ jobs:
         run: npm audit fix
       - name: Build
         run: npm run build
+      - name: Create sitemap
+        run: npm run sitemap
       - name: Archive production artifact
         uses: actions/upload-artifact@master
         with:

firebase.json

@@ -6,7 +6,23 @@
       "**/.*",
       "**/node_modules/**"
     ],
+    "redirects": [
+      {
+        "source": "/sitemap",
+        "destination": "/sitemap.xml",
+        "type": 301
+      },
+      {
+        "source": "/sitemap/**",
+        "destination": "/sitemap.xml",
+        "type": 302
+      }
+    ],
     "rewrites": [
+      {
+        "source": "/sitemap.xml",
+        "destination": "/sitemap.xml"
+      },
       {
         "source": "**",
         "destination": "/index.html"

package.json

@@ -2,6 +2,7 @@
   "name": "python-create",
   "version": "0.1.1",
   "private": true,
+  "type": "module",
   "dependencies": {
     "@material-ui/core": "^4.9.8",
     "@material-ui/icons": "^4.9.1",
@@ -18,7 +19,9 @@
     "react-dom": "^16.13.1",
     "react-helmet": "^6.1.0",
     "react-markdown": "^4.3.1",
-    "react-router-dom": "^5.1.2",
+    "react-router": "^5.2.0",
+    "react-router-dom": "^5.2.0",
+    "react-router-sitemap": "^1.2.0",
     "react-scripts": "3.4.1",
     "react-syntax-highlighter": "^12.2.1",
     "typeface-roboto": "0.0.75"
@@ -27,7 +30,8 @@
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
-    "eject": "react-scripts eject"
+    "eject": "react-scripts eject",
+    "sitemap": "babel-node src/routes/builder.js"
   },
   "eslintConfig": {
     "extends": "react-app"
@@ -43,5 +47,11 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
+  },
+  "devDependencies": {
+    "babel-cli": "^6.26.0",
+    "babel-preset-es2015": "^6.24.1",
+    "babel-preset-react": "^6.24.1",
+    "babel-register": "^6.26.0"
   }
 }

src/pages/Homepage/index.js

@@ -25,7 +25,7 @@ export default class Homepage extends React.Component {
         <Header onDrawerToggle={this.props.handleDrawerToggle} />
         <Helmet>
           <title>Homepage | Python Create</title>
-          <meta name="description" content="Python Create offers generators and instructions on using Python optimally. Get help writing your code by the tools we offer." />
+          <meta name="description" content="Python Create offers generators and instructions on using Python optimally. Get help writing your code with the tools we offer." />
           <meta name="robots" content="index, follow" />
         </Helmet>
         <main className={this.props.classes.main}>

src/routes/builder.js

@@ -0,0 +1,26 @@
+import pkg from 'react-router-sitemap';
+const { sitemapBuilder } = pkg;
+
+// import { routeDetails } from './index.js';
+import path from 'path'; // add path which will be needed for file write
+import fs from 'fs'; // import file system object
+
+const paths = [
+    "/setup-py-generator",
+    "/"
+];
+
+// use your website root address here. Optimally you can
+// include dev and production environments with variables
+const hostname = 'https://pythoncreate.com';
+
+const dest = path.resolve('./build', 'sitemap.xml');
+
+const sitemap = sitemapBuilder(
+    hostname,
+    paths
+);
+
+// write sitemap.xml file in /public folder
+// Access the sitemap content by converting it with .toString() method
+fs.writeFileSync(dest, sitemap.toString())

src/routes/index.js

@@ -6,11 +6,27 @@ import SetupPy from "pages/SetupPy";
 import Homepage from "pages/Homepage";
 import RouteWithScene from "./RouteWithScene";
 
-export default function Routes() {
+export const routes = [
+  {
+    path: "/setup-py-generator",
+    scene: Paperbase,
+    component: SetupPy
+  },
+  {
+    path: "/",
+    scene: Paperbase,
+    component: Homepage
+  }
+];
+
+export default function RoutesSwitch() {
   return (
     <Switch>
-      <RouteWithScene path="/setup-py-generator" scene={Paperbase} component={SetupPy} />
-      <RouteWithScene path="/" scene={Paperbase} component={Homepage} />
+      {
+        routes.map((route, index) => (
+          <RouteWithScene path={route.path} scene={route.scene} component={route.component} key={index} />
+        ))
+      }
       <Redirect to="/" />
     </Switch>
   );