updates from kevinschaul/jump-start

.github/workflows/deploy.yml

@@ -58,7 +58,6 @@ jobs:
 
       - name: Build site
         run: npm run gallery:build
-
 
       - name: Upload artifact
         uses: actions/upload-pages-artifact@v3

README.md

@@ -1,20 +1,7 @@
 # jump-start-template
 
-A shortcut to your favorite code.
-
-`jump-start` is a lightweight system to organize that code that
-you keep coming back to. It’s a structured GitHub repository
-and a web frontend.
-
-A **starter** is a directory of code that you like -- whether
-it’s a single script or an entire app. Each starter lives in a
-**group** directory. Organize similar code for easier
-navigation.
-
-When you want to use your favorite code, locate that starter
-either in this README.md or in your gallery website. Copy the
-command, and run it in your terminal. Your starter code is now
-in your project.
+A shortcut to my favorite code. Want your own? Check out
+[kevinschaul/jump-start-template](https://github.com/kevinschaul/jump-start-template).
 
 ## Starters
 
@@ -35,11 +22,16 @@ starter name (e.g. `BarChart`).
 
 Then, add your code, and edit the generated `jump-start.yaml` file to your liking.
 
-## `jump-start.yaml`
+### `jump-start.yaml`
 
 Each starter must contain this file, which defines a few items used by the
 gallery.
 
+Some examples:
+
+- [kevinschaul react-d3/LineChart](https://github.com/kevinschaul/jump-start/blob/main/react-d3/LineChart/jump-start.yaml)
+- [kevinschaul r/data-analysis](https://github.com/kevinschaul/jump-start/blob/main/r/data-analysis/jump-start.yaml)
+
 **`description`**: Anything you want to write about this starter. It could be
 the code’s features, any additional installation instructions, whatever. This
 appears in the `## Starters` section of the README.md, and in the web gallery.
@@ -48,13 +40,25 @@ appears in the `## Starters` section of the README.md, and in the web gallery.
 default. For example, if you know that your React components live in
 `components/elements/`, set the `defaultDir` to that. The jump-start command
 shown in the README.md and gallery will place the files into this directory.
-
-## How to use this template
 
-1. At [GitHub](https://github.com/kevinschaul/jump-start-template), click "Use this template" -> "Create a new repository"
-2. Give your repository a name. Might I suggest "jump-start"?
-3. On the `main` branch, add your favorite code!
+**`mainFile`** (optional): The file shown initially in the gallery's "Starter files
+section.
+
+**`preview`** (optional): Configuration that gets passed down to the gallery's
+"Preview" section. The previews render via
+[Sandpack](https://sandpack.codesandbox.io/docs/getting-started/usage), so this
+configuration mimics Sandpack's. Currently only supports React. Your starter
+must include the file `Preview.js`, which default exports a React component.
+
+**`preview.template`** (optional, e.g. "react"): The template used by Sandpack.
+I've only used "react" but others may work too.
 
+**`preview.dependencies`** (optional, e.g. `d3: "5"`): An object containing
+dependencies for Sandpack to use for the preview. Think of it as the
+`package.json` file for the preview. Anything your starter needs should be
+listed here.
+
+
 ## Running the gallery locally
 
 The jump-start gallery code lives in [a separate
@@ -64,6 +68,7 @@ locally, using the starters in this repo as its data:
 
     npm run gallery:clone
     npm run gallery:install
+    npm run gallery:link
     npm run gallery:dev
 
 Open [localhost:3000](localhost:3000) in a browser.

package.json

@@ -5,9 +5,11 @@
   "scripts": {
     "gallery:clone": "git submodule update --init",
     "gallery:update": "git submodule sync --recursive",
-    "gallery:install": "cd jump-start-gallery &&  npm install",
+    "gallery:install": "cd jump-start-gallery && npm install",
+    "gallery:link": "cd jump-start-gallery && ln -sf ../../ src/starters",
     "gallery:dev": "cd jump-start-gallery && npm run dev",
-    "update-readme": "cd jump-start-gallery && npm run update-readme -- ../README.md"
+    "gallery:build": "cd jump-start-gallery && npm run build",
+    "update-readme": "cd jump-start-gallery && npm run update-readme-submodule -- ../"
   },
   "repository": {
     "type": "git",