Add basic data router example (#10285)

remix-run · Mar 29, 2023 · 5a43e19 · 5a43e19
1 parent a44859f
commit 5a43e19
Show file tree

Hide file tree

Showing 13 changed files with 1,264 additions and 1 deletion.
diff --git a/.github/ISSUE_TEMPLATE/bug_report.yml b/.github/ISSUE_TEMPLATE/bug_report.yml
@@ -23,7 +23,7 @@ body:
 
         ### Test Case Starters:
 
-        * [Using `<RouterProvider>`](https://stackblitz.com/github/remix-run/react-router/tree/main/examples/data-router?file=src/App.tsx)
+        * [Using `<RouterProvider>`](https://stackblitz.com/github/remix-run/react-router/tree/main/examples/basic-data-router?file=src/app.tsx)
         * [Using `<BrowserRouter>`](https://stackblitz.com/github/remix-run/react-router/tree/main/examples/basic?file=src/App.tsx)
   - type: input
     attributes:

diff --git a/examples/basic-data-router/.gitignore b/examples/basic-data-router/.gitignore
@@ -0,0 +1,5 @@
+node_modules
+.DS_Store
+dist
+dist-ssr
+*.local
diff --git a/examples/basic-data-router/.stackblitzrc b/examples/basic-data-router/.stackblitzrc
@@ -0,0 +1,4 @@
+{
+  "installDependencies": true,
+  "startCommand": "npm run dev"
+}
diff --git a/examples/basic-data-router/README.md b/examples/basic-data-router/README.md
@@ -0,0 +1,15 @@
+---
+title: Basic (Data Router)
+toc: false
+order: 1
+---
+
+# Data Routers
+
+This example demonstrates a simple usage of a Data Router, using `createBrowserRouter` and `<RouterProvider>`.
+
+## Preview
+
+Open this example on [StackBlitz](https://stackblitz.com):
+
+[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/remix-run/react-router/tree/main/examples/basic-data-router?file=src/App.tsx)
diff --git a/examples/basic-data-router/index.html b/examples/basic-data-router/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>React Router - Basic Data Router Example</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>