foobara-empty-typescript-react-project-generator 0.2.0 → 0.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 5766d1ac0b265272cc62b2da7fa015890bceb2cce99f9def87d71e7b2eb102a4
-  data.tar.gz: 773f8ead5b569f765f9018e0c69b9131cdc55d6cc606f2cdbf8c951508952fc4
+  metadata.gz: 7f7b4ac21e56483eddd6d15620cf1edaaccd9448e227d17dd2fc73f33c1d38d6
+  data.tar.gz: 7b6a39dbbf4e8e24e739af7cc782677f5dc10139d4971d40b473935c5763a030
 SHA512:
-  metadata.gz: c6bb08aa04721d807cfc8af0d19d03d88000d752e62e190becb20737dfd416cc05a31a2faf12305117c0c5766fd8e7e82fb70b7b320ba74a9754a948a53e8505
-  data.tar.gz: b7ea9b1d7f2a04e4e18b8c866ab1148cdeed2fb07a920332fb2a6608d985be7e926c6b5c1acff3211e1ccc9ce44edd8a44767e932ba60ffdb9310317808ad2b2
+  metadata.gz: 324c237a91f5351a2b885d541b364d6593c5341960cdcf021851926f841ffdb21815bee05dc1b46926808eed81c400a21d5e397e8ae919462e8af9d889306151
+  data.tar.gz: cae37cc52abad3774ec99bfbc02c2719cee244d900f6a2efe9384177011302837cf27a6a6d5bcae07964d3ff7145b73c2cd0d008745f31bb8ab262d0e4488821

data/CHANGELOG.md

@@ -1,3 +1,9 @@
+## [0.3.0] - 2026-07-05
+
+- Wire up react router/nav
+- Wire up a sitemap/prerender stuff
+- Switch to oxlint in generated projects
+
 ## [0.2.0] - 2026-03-19
 
 - Switch to generating the project with Vite instead of CRA

data/src/empty_typescript_react_project_config.rb

@@ -8,6 +8,7 @@ module Foobara
           project_dir :string, :required
           github_organization :string
           push_to_github :boolean, default: false
+          site_url :string, default: "https://example.com"
         end
       end
     end

data/src/empty_typescript_react_project_generator.rb

@@ -7,8 +7,10 @@ module Foobara
             def manifest_to_generator_classes(manifest)
               case manifest
               when EmptyTypescriptReactProjectConfig
-                # Nothing to do yet re: rendering templates. Everything is untemplated so far.
-                []
+                [
+                  Generators::RobotsTxtGenerator,
+                  Generators::RoutesTsGenerator
+                ]
               else
                 # :nocov:
                 raise "Not sure how build a generator for a #{manifest}"
@@ -16,6 +18,10 @@ module Foobara
               end
             end
           end
+
+          alias empty_typescript_react_project_config relevant_manifest
+
+          def templates_dir = "#{__dir__}/../templates"
         end
       end
     end

data/src/generate_empty_typescript_react_project.rb

@@ -18,10 +18,7 @@ module Foobara
           add_initial_elements_to_generate
 
           each_element_to_generate do
-            # currently there are no templated files to write and so this code path isn't hit
-            # :nocov:
             generate_element
-            # :nocov:
           end
 
           paths_to_source_code

data/src/generators/robots_txt_generator.rb

@@ -0,0 +1,13 @@
+require_relative "../empty_typescript_react_project_generator"
+
+module Foobara
+  module Generators
+    module EmptyTypescriptReactProjectGenerator
+      module Generators
+        class RobotsTxtGenerator < EmptyTypescriptReactProjectGenerator
+          def template_path = ["public", "robots.txt.erb"]
+        end
+      end
+    end
+  end
+end

data/src/generators/routes_ts_generator.rb

@@ -0,0 +1,13 @@
+require_relative "../empty_typescript_react_project_generator"
+
+module Foobara
+  module Generators
+    module EmptyTypescriptReactProjectGenerator
+      module Generators
+        class RoutesTsGenerator < EmptyTypescriptReactProjectGenerator
+          def template_path = ["scripts", "routes.ts.erb"]
+        end
+      end
+    end
+  end
+end

data/src/write_empty_typescript_react_project_to_disk.rb

@@ -56,7 +56,6 @@ module Foobara
         def run_pre_generation_tasks
           run_npm_create_vite
           npm_install
-          eslint_fix
           git_init
           git_add_all
           git_commit_initial_setup
@@ -85,7 +84,11 @@ module Foobara
         end
 
         def run_post_generation_tasks
-          eslint_fix
+          npm_install_react_router
+          npm_install_sitemap_and_prerender_dependencies
+          add_build_scripts_to_package_json
+          remove_static_title_from_index_html
+          oxlint_fix
           git_add_all
           git_commit_generated_files
           git_branch_main
@@ -97,10 +100,52 @@ module Foobara
           end
         end
 
-        def eslint_fix
+        def npm_install_react_router
+          puts "installing react-router..."
+
+          cmd = "npm install react-router-dom"
+
+          Dir.chdir project_directory do
+            run_cmd_and_write_output(cmd)
+          end
+        end
+
+        def npm_install_sitemap_and_prerender_dependencies
+          puts "installing sitemap/pre-render dependencies..."
+
+          cmd = "npm install --save-dev puppeteer tsx @types/node"
+
+          Dir.chdir project_directory do
+            run_cmd_and_write_output(cmd)
+          end
+        end
+
+        def add_build_scripts_to_package_json
+          puts "adding prebuild/postbuild scripts..."
+
+          Dir.chdir project_directory do
+            run_cmd_and_write_output(
+              'npm pkg set scripts.prebuild="npx puppeteer browsers install chrome && ' \
+              'tsx scripts/generate-sitemap.ts"'
+            )
+            run_cmd_and_write_output(
+              'npm pkg set scripts.postbuild="tsx scripts/prerender.ts"'
+            )
+          end
+        end
+
+        # Pages now set their own <title> in React 19
+        def remove_static_title_from_index_html
+          index_html_path = File.join(project_directory, "index.html")
+          contents = File.read(index_html_path)
+
+          File.write(index_html_path, contents.sub(%r{\s*<title>.*</title>}, ""))
+        end
+
+        def oxlint_fix
           puts "linting..."
 
-          cmd = "npx eslint . --fix"
+          cmd = "npx oxlint --fix"
           Dir.chdir project_directory do
             run_cmd_and_write_output(cmd)
           end

data/templates/.oxlintrc.json

@@ -0,0 +1,17 @@
+{
+  "$schema": "./node_modules/oxlint/configuration_schema.json",
+  "plugins": ["react", "typescript", "oxc"],
+  "rules": {
+    "react/rules-of-hooks": "error",
+    "react/only-export-components": ["warn", { "allowConstantExport": true }]
+  },
+  "overrides": [
+    {
+      "files": ["src/domains/**/*.{ts,tsx}"],
+      "rules": {
+        "typescript/no-explicit-any": "off",
+        "typescript/prefer-as-const": "off"
+      }
+    }
+  ]
+}

data/templates/public/_redirects

@@ -0,0 +1 @@
+/*    /index.html   200

data/templates/public/robots.txt.erb

@@ -0,0 +1,5 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:
+
+Sitemap: <%= site_url %>/sitemap.xml

data/templates/scripts/generate-sitemap.ts

@@ -0,0 +1,28 @@
+import { writeFileSync } from 'fs'
+import { resolve, dirname } from 'path'
+import { fileURLToPath } from 'url'
+import { SITE_URL, getSitemapPages } from './routes.ts'
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = dirname(__filename)
+
+const allPages = getSitemapPages()
+
+const sitemap = `<?xml version="1.0" encoding="UTF-8"?>
+<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
+${allPages
+  .map(
+    (page) => `  <url>
+    <loc>${SITE_URL}${page.loc}</loc>
+    <changefreq>${page.changefreq}</changefreq>
+    <priority>${page.priority}</priority>${page.lastmod ? `\n    <lastmod>${page.lastmod}</lastmod>` : ''}
+  </url>`,
+  )
+  .join('\n')}
+</urlset>
+`
+
+const sitemapPath = resolve(__dirname, '../public/sitemap.xml')
+writeFileSync(sitemapPath, sitemap)
+
+console.log(`Generated sitemap with ${allPages.length} URLs`)

data/templates/scripts/prerender.ts

@@ -0,0 +1,53 @@
+import { writeFileSync, mkdirSync } from 'fs'
+import { resolve, dirname } from 'path'
+import { fileURLToPath } from 'url'
+import { preview } from 'vite'
+import puppeteer from 'puppeteer'
+import { getRoutePaths } from './routes.ts'
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = dirname(__filename)
+const projectRoot = resolve(__dirname, '..')
+const distDir = resolve(projectRoot, 'dist')
+
+const routes = getRoutePaths()
+
+const server = await preview({ root: projectRoot })
+const serverUrl = server.resolvedUrls!.local[0]
+
+const browser = await puppeteer.launch({
+  args: ['--no-sandbox', '--disable-setuid-sandbox'],
+})
+
+// Render everything before writing anything to deal with / prerendering
+const rendered: { route: string; outputPath: string; html: string }[] = []
+
+for (const route of routes) {
+  const page = await browser.newPage()
+
+  await page.evaluateOnNewDocument(() => {
+    document.addEventListener('prerender-ready', () => {
+      ;(window as Window & { __prerenderReady?: boolean }).__prerenderReady = true
+    })
+  })
+
+  await page.goto(new URL(route, serverUrl).href, { waitUntil: 'networkidle0' })
+  await page.waitForFunction('window.__prerenderReady === true')
+
+  const outputPath = route === '/' ? 'index.html' : `${route.replace(/^\//, '')}.html`
+  rendered.push({ route, outputPath, html: await page.content() })
+
+  await page.close()
+}
+
+for (const { route, outputPath, html } of rendered) {
+  const outputFile = resolve(distDir, outputPath)
+
+  mkdirSync(dirname(outputFile), { recursive: true })
+  writeFileSync(outputFile, html)
+  console.log(`Pre-rendered ${route} -> dist/${outputPath}`)
+}
+
+await browser.close()
+server.httpServer.close()
+process.exit(0)

data/templates/scripts/routes.ts.erb

@@ -0,0 +1,25 @@
+export const SITE_URL = '<%= site_url %>'
+
+export interface SitemapPage {
+  loc: string
+  changefreq: string
+  priority: string
+  lastmod?: string
+}
+
+export const STATIC_PAGES: SitemapPage[] = [
+  { loc: '/', changefreq: 'monthly', priority: '1.0' },
+  { loc: '/about', changefreq: 'monthly', priority: '0.8' },
+]
+
+export function getDynamicPages(): SitemapPage[] {
+  return []
+}
+
+export function getSitemapPages(): SitemapPage[] {
+  return [...STATIC_PAGES, ...getDynamicPages()]
+}
+
+export function getRoutePaths(): string[] {
+  return getSitemapPages().map((page) => page.loc)
+}

data/templates/src/App.tsx

@@ -0,0 +1,24 @@
+import { NavLink, Route, Routes } from 'react-router-dom'
+import './App.css'
+import Home from './pages/Home'
+import About from './pages/About'
+import NotFound from './pages/NotFound'
+
+function App() {
+  return (
+    <div className="App">
+      <nav>
+        <NavLink to="/">Home</NavLink> | <NavLink to="/about">About</NavLink>
+      </nav>
+      <main>
+        <Routes>
+          <Route path="/" element={<Home />} />
+          <Route path="/about" element={<About />} />
+          <Route path="*" element={<NotFound />} />
+        </Routes>
+      </main>
+    </div>
+  )
+}
+
+export default App

data/templates/src/main.tsx

@@ -0,0 +1,28 @@
+import { StrictMode } from 'react'
+import { createRoot, hydrateRoot } from 'react-dom/client'
+import { BrowserRouter } from 'react-router-dom'
+import './index.css'
+import App from './App.tsx'
+
+const rootElement = document.getElementById('root')!
+
+const app = (
+  <StrictMode>
+    <BrowserRouter>
+      <App />
+    </BrowserRouter>
+  </StrictMode>
+)
+
+if (rootElement.hasChildNodes()) {
+  hydrateRoot(rootElement, app)
+} else {
+  createRoot(rootElement).render(app)
+}
+
+// Not sure if this is necessary but gives some extra time for things to settle before pre-rendering
+requestAnimationFrame(() => {
+  requestAnimationFrame(() => {
+    document.dispatchEvent(new Event('prerender-ready'))
+  })
+})

data/templates/src/pages/About.tsx

@@ -0,0 +1,12 @@
+function About() {
+  return (
+    <div>
+      <title>About</title>
+      <meta name="description" content="About this project" />
+      <h1>About</h1>
+      <p>Stuff about this project or whatever</p>
+    </div>
+  )
+}
+
+export default About

data/templates/src/pages/Home.tsx

@@ -0,0 +1,12 @@
+function Home() {
+  return (
+    <div>
+      <title>Home</title>
+      <meta name="description" content="The home page" />
+      <h1>Home</h1>
+      <p>Hello, World!</p>
+    </div>
+  )
+}
+
+export default Home

data/templates/src/pages/NotFound.tsx

@@ -0,0 +1,11 @@
+function NotFound() {
+  return (
+    <div>
+      <title>Not Found</title>
+      <h1>Not Found</h1>
+      <p>There is nothing at this URL.</p>
+    </div>
+  )
+}
+
+export default NotFound

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: foobara-empty-typescript-react-project-generator
 version: !ruby/object:Gem::Version
-  version: 0.2.0
+  version: 0.3.0
 platform: ruby
 authors:
 - Miles Georgi
@@ -58,10 +58,22 @@ files:
 - src/empty_typescript_react_project_config.rb
 - src/empty_typescript_react_project_generator.rb
 - src/generate_empty_typescript_react_project.rb
+- src/generators/robots_txt_generator.rb
+- src/generators/routes_ts_generator.rb
 - src/write_empty_typescript_react_project_to_disk.rb
 - templates/.env
 - templates/.github/workflows/tests.yml
-- templates/eslint.config.js
+- templates/.oxlintrc.json
+- templates/public/_redirects
+- templates/public/robots.txt.erb
+- templates/scripts/generate-sitemap.ts
+- templates/scripts/prerender.ts
+- templates/scripts/routes.ts.erb
+- templates/src/App.tsx
+- templates/src/main.tsx
+- templates/src/pages/About.tsx
+- templates/src/pages/Home.tsx
+- templates/src/pages/NotFound.tsx
 homepage: https://github.com/foobara/generators-empty-typescript-react-project-generator
 licenses:
 - Apache-2.0
@@ -79,13 +91,16 @@ required_ruby_version: !ruby/object:Gem::Requirement
   - - ">="
     - !ruby/object:Gem::Version
       version: 3.4.0
+  - - "<"
+    - !ruby/object:Gem::Version
+      version: 4.1.0
 required_rubygems_version: !ruby/object:Gem::Requirement
   requirements:
   - - ">="
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.6.9
+rubygems_version: 4.0.10
 specification_version: 4
 summary: Generates empty typescript react projects
 test_files: []

data/templates/eslint.config.js

@@ -1,30 +0,0 @@
-import js from '@eslint/js'
-import globals from 'globals'
-import reactHooks from 'eslint-plugin-react-hooks'
-import reactRefresh from 'eslint-plugin-react-refresh'
-import tseslint from 'typescript-eslint'
-import { defineConfig, globalIgnores } from 'eslint/config'
-
-export default defineConfig([
-  globalIgnores(['dist']),
-  {
-    files: ['**/*.{ts,tsx}'],
-    extends: [
-      js.configs.recommended,
-      tseslint.configs.recommended,
-      reactHooks.configs.flat.recommended,
-      reactRefresh.configs.vite,
-    ],
-    languageOptions: {
-      ecmaVersion: 2020,
-      globals: globals.browser,
-    },
-  },
-  {
-    files: ['src/domains/**/*.{ts,tsx}'],
-    rules: {
-      '@typescript-eslint/no-explicit-any': 'off',
-      '@typescript-eslint/prefer-as-const': 'off',
-    },
-  },
-])