fix toc

Author: efrymire

observablehq.config.js

@@ -6,19 +6,25 @@ export default {
   // The pages and sections in the sidebar. If you don’t specify this option,
   // all pages will be listed in alphabetical order. Listing pages explicitly
   // lets you organize them into sections and have unlisted pages.
-  // pages: [
-  //   {
-  //     name: "Lab 0: Getting Started",
-  //     pages: [
-  //       {name: "Installations", path: "/lab_0/1_INSTALLATIONS"},
-  //       {name: "Github Setup", path: "/lab_0/2_GIT_SETUP"}
-  //     ],
-  //     name: "Lab 1: Intro to Observable Framework",
-  //     pages: [
-  //       {name: "Intro to Observable Framework", path: "/lab_1/1_INTRO_TO_OBSERVABLE_FRAMEWORK"}
-  //     ]
-  //   }
-  // ],
+  pages: [
+    // { name: "Home", path: "/index.md"},
+    { 
+      name: "Lab 0: Getting Started", 
+      open: false, 
+      pages: [
+        { name: "Instructions", path: "/lab_0/instructions"},
+        { name: "Dashboard", path: "/lab_0/index"},
+      ]
+    },
+    { 
+      name: "Lab 1: Intro to Observable Framework", 
+      open: false, 
+      pages: [
+        { name: "Instructions", path: "/lab_1/instructions"},
+        { name: "Dashboard", path: "/lab_1/index"},
+      ]
+    }
+  ],
 
   // Content to add to the head of the page, e.g. for a favicon:
   head: '<link rel="icon" href="observable.png" type="image/png" sizes="32x32">',

src/lab_0/assets/local_serve.png

@@ -1,197 +1,5 @@
+---
+title: "Lab 0: Getting Started"
+---
 
-# Lab 0: Getting Started
-
-The goals for this tutorial are: 
-* to set up installations for your local development environment
-* to learn how to serve your pages so that you can see/interact with them while you are coding
-* to get comfortable with the Github workflow
-* to set up a public site to showcase your work
-
-The assignment requirements are as follows: 
-1. Replicate the local environment created in class on your own computer ([Installations](#installations))
-2. Fork this repository, set up github pages, and initialize your upstream repository ([Github Setup](#github-setup))
-3. Submit your [deployed link](#4-set-up-your-github-pages-for-your-deployment) as a comment on the lab 0 commons post.
-
-# Installations
-
-The first step is to install all the appropriate software to get our environment together. Please install the following on the computer you intend to complete all the tutorials from.
-
-*Note*: while VS code is an application, the other softwares are installed via your terminal or bash. If this is your first time working with your terminal, check out [working with your terminal](#working-with-your-terminal). 
-
-- [VS Code](https://code.visualstudio.com/) - free code editor and IDE (our recommendation). This is an application to view files and code. This application also includes many handy extensions that can help us with [version control](https://code.visualstudio.com/docs/editor/versioncontrol#_git-support) and [file serving](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer).
-    - You may also use another code editor that has AI integration, like [cursor](https://cursor.com/), but these ai integrations typically require payment after reacting an interaction limit. 
-- [Git](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git) version control software. You will also need an account on [Github.com](https://github.com/).
-    - if you have a mac, and you have installed Xcode, you _already have git_. You can test this by opening your terminal and running `git --version`.
-    - if you are using a PC, an application called "git bash" will be part of the default git install. You may prefere to use this application rather than the "command prompt" for git commands.
-    - all installation details are included in the [Getting Started Installing Git link](https://git-scm.com/book/en/v2/Getting-Started-Installing-Git).
-    - an alternative for both mac and pc is to use the [source control](https://code.visualstudio.com/docs/editor/versioncontrol#_git-support) options that come with the default VS Code installation. This is often easier than opening terminal each time and offers many of the same actions.
-- [Node](https://nodejs.org/en/download/) - javascript development software. You can check if the install was succesful by running `node -v` in your command line or terminal. It should return your version number.
-
-# Github Setup
-
-You can read more about `forking`, `syncing`, and the overall github flow [here](https://help.github.com/en/github/getting-started-with-github/fork-a-repo).
-
-## 1. On Gitub, within to our [main repository](https://github.com/InteractiveDataVis/Interactive-Data-Vis-Fall2025.git) and [`fork`](https://docs.github.com/en/github/getting-started-with-github/fork-a-repo) this repository into your own account.
-
-To do this, click on the "fork" button on the top right of this github account.
-
-<img src='assets/fork.png' width='700px'>
-
-This creates a clone of our class repository in your own github account. After the fork, you can see this worked by confirming your github username appears before the repository name:
-
-<img src='assets/forked.png' width='700px'>
-
-This repository is _your_ personal copy of the existing repository. This will be where you do all your lab work, and will include the deployed links that you will submit when turning in your assignments. 
-
-## 2. On GitHub, navigate to **your fork** of the repository and clone it to your local computer.
-
-To do this, navigate to the folder where you want to save your files (I like to save mine in `Documents/Repositories`). (Hint: `cd` or 'change directory' will help you get there through terminal).
-
-```sh
-# from Terminal:
-
-# navigate to where you want to save your code
-$ cd PATH_TO_YOUR/FOLDER
-
-# clone your fork to your local computer
-$ git clone https://github.com/[YOUR_USERNAME]/Interactive-Data-Vis-Fall2025
-
-# `cd` (change directory) into this repository
-$ cd Interactive-Data-Vis-Fall2025
-```
-
-## 3. Set up your local repository so that it links back to the course repository.
-
-We do this so that you can keep your local branch synced up with the main course repository when we update the material. With this set up, you can simply `pull` in the new changes from our original class repository.
-
-```sh
-#See current remote branches:
-
-$ git remote -v
-> origin	https://github.com/[YOUR_USERNAME]/Interactive-Data-Vis-Fall2025 (fetch)
-> origin	https://github.com/[YOUR_USERNAME]/Interactive-Data-Vis-Fall2025 (push)
-
-# notice currently this is only tracking your version of the repository.
-```
-
-Add an `upstream` remote branch so you can keep yours synced with the main class repository:
-
-```sh
-$ git remote add upstream https://github.com/InteractiveDataVis/Interactive-Data-Vis-Fall2025.git
-```
-
-Check remote branches again to ensure that the update worked. You should see 2 sets of branches, `origin` which links back to your fork, and `upstream` which references back to the course repository:
-
-```sh
-$ git remote -v
-> origin	https://github.com/[YOUR_USERNAME]/Interactive-Data-Vis-Fall2025 (fetch)
-> origin	https://github.com/[YOUR_USERNAME]/Interactive-Data-Vis-Fall2025 (push)
-> upstream	https://github.com/InteractiveDataVis/Interactive-Data-Vis-Fall2025.git (fetch)
-> upstream	https://github.com/InteractiveDataVis/Interactive-Data-Vis-Fall2025.git (push)
-
-# now notice see that we are tracking both the original and your version of the repository
-```
-
-
-## 4. Set up your Github Pages for your deployment
-
-We use [Github Pages](https://docs.github.com/en/pages/getting-started-with-github-pages/what-is-github-pages) to serve our websites publicly. Github Pages is static site hosting service that takes HTML, CSS, and JavaScript files straight from a repository on GitHub, optionally runs the files through a build process, and publishes a website. 
-
-To [set up your github pages site](https://docs.github.com/en/pages/getting-started-with-github-pages/creating-a-github-pages-site#creating-your-site), you can go to your repository's `Settings` tab and then scroll down to `Pages` section. Select `Github Actions` as source ("Deploy from a branch"). 
-
-<img src='assets/pages.png' width='700px'>
-
-The workflow code is already included in the main class repository. When you push your changes up to github, then your site will automatically be redeployed and be avallable at `https://[YOUR_USERNAME].github.io/[YOUR_REPOSITORY_NAME]/`. 
-
-You can see all the deployments triggered from pushed in the deployments section of your repository page.
-
-<img src='assets/deployments.png' width='700px'>
-
-*NOTE*: You must navidate in the URL to a folder with an index.html, or else you will get a 404. This will take a few minutes to update with any pushed changes.
-
-### 5. Push up and deploy your changes
-
-[Note: VS Code has some great [tools](https://code.visualstudio.com/docs/editor/versioncontrol#_git-support) built in to help with this process.]
-
-When you have made a change that you want to keep, you can commit your changes:
-
-```sh
-# see which files have changes associated with them
-git status
-
-# add, or 'stage', files or folders for this commit
-git add [path/fileName]
-
-# commit the files with a brief explanation of what you are changing
-# ex: `git commit -m 'add bar chart legend`
-git commit -m 'message regaring what changes you are commiting'
-```
-
-When you are ready to push up your code to your remote repository, you can run:
-
-```sh
-$ git push
-```
-
-**That's it! Now you are ready to create, update, and deploy your own websites 🎉!**
-
-# Appendix
-
-### Working with your terminal
-
-Your computer, mac or pc, includes a command line interface that lets you communicate with your operating system. For macs, that app is called "terminal", and on windows machines, its the "command prompt". 
-
-![Mac Terminal](assets/mac_terminal.png)
-![Command Prompt](assets/pc_command_prompt.png)
-
-
-More resources to understand these interfaces: 
-* Mac: [What is terminal on mac?](https://support.apple.com/guide/terminal/what-is-terminal-trmld4c92d55/mac)
-* PC: [cmd.exe Wiki](https://en.wikipedia.org/wiki/Cmd.exe)
-* PC: [Command Prompt Basics (youtube tutorial)](https://www.youtube.com/watch?v=QBWX_4ho8D4)
-* [Complete List: Command Line Prompt (CMD)](https://www.codecademy.com/article/command-line-commands)
-
-
-### Keeping your repository synced
-
-As the semester progresses, updates may be pushed to the class repository. The following terminal commands can keep your repo [synced](https://help.github.com/en/github/getting-started-with-github/fork-a-repo#keep-your-fork-synced). Make sure to do this before working on new code to ensure that you are working off of the latest updates. 
-
-```sh
-# pulls the upstream changes and stores them in `upstream/main`
-$ git fetch upstream
-```
-
-```sh
-# merges the changes from upstream into your current branch
-$ git merge upstream/main
-```
-
-(You can read more information about this process [here](https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/syncing-a-fork))
-
-### Helpful terminal commands for navigation
-
-**Windows Command Prompt (CMD)**
-
-- `dir`: List files and folders in current directory
-- `cd [folder]`: Change directory (e.g., cd Documents)
-- `cd ..`: Go up one directory level
-- `cd \`: Go to root directory
-- `mkdir [name]`: Create new folder
-- `rmdir [name]`: Remove empty folder
-- `del [filename]`: Delete file
-- `copy [source] [destination]`: Copy files
-- `move [source] [destination]`: Move/rename files
-
-**macOS/Linux Terminal**
-
-- `ls`: List files and folders (ls -la for detailed view)
-- `cd [folder]`: Change directory
-- `cd ..`: Go up one directory
-- `cd ~`: Go to home directory
-- `pwd`: Show current directory path
-- `mkdir [name]`: Create folder
-- `rmdir [name]`: Remove empty folder
-- `rm [filename]`: Delete file (rm -r [folder] for folders)
-- `cp [source] [destination]`: Copy files
-- `mv [source] [destination]`: Move/rename files
-
+Lab instructions in the [readme.md](./README.md).