updated docs

Author: pelikhan

website/docs/developer/cli.md

@@ -51,6 +51,7 @@ A device script project will look as follows:
 main.ts           usual name for your entry point application
 package.json      additional dependencies and also has the `devicescript` field entry
 tsconfig.json     configure the TypeScript compiler to compile DeviceScript syntax
+...               A few additional files supporting the coding experience in VS Code
 ```
 
 ### --force

website/docs/developer/getting-started/_category_.json

@@ -0,0 +1,4 @@
+{
+    "label": "Getting Started",
+    "position": 2
+}

website/docs/developer/getting-started/code.md

@@ -0,0 +1,65 @@
+---
+sidebar_position: 1
+---
+
+# Visual Studio Code
+
+[Visual Studio Code](https://code.visualstudio.com/) (`code`) is a popular editor for TypeScript program. It is the
+preferred editor for DeviceScript projects.
+
+The command line tool is compatible with container and virtual machines so you can run it
+in Docker, GitHub Codespaces, ...
+
+## Setting up the project
+
+Let's get started by installing the [DeviceScript command line](/developer/cli) and create an empty project
+
+-   Open `code` in a new empty folder
+-   Open a terminal (`` Ctrl + ` ``)
+-   Install the command line globally. You can call it using `devsc`
+
+```bash
+npm install -g -u @devicescript/cli
+```
+
+-   Use the `init` command to setup the files
+
+```bash
+devsc init
+```
+
+You will have the following files created.
+
+```
+.devicescript     reserved folder for devicescript generated
+    /lib          supporting runtime types and libraries
+    /bin          compilation file output
+.gitignore        if you are using git, make sure to ignore .devicescript
+main.ts           usual name for your entry point application
+package.json      additional dependencies and also has the `devicescript` field entry
+tsconfig.json     configure the TypeScript compiler to compile DeviceScript syntax
+...               A few additional files supporting the coding experience in VS Code
+```
+
+## Launch the build watch
+
+Assuming `main.ts` is the root file of your application,
+launch a compilation task in watch mode using this command.
+
+```bash
+devsc build --watch
+```
+
+The command line task will also start a local web server that will send the compiled bytecode
+to a developer tools page similar to the one hosted in the docs.
+
+-   open the developer tools page (see cli output)
+
+## Edit, deploy, debug loop
+
+From here, your developer inner loop will be very similar to building/debugging a web site with hot reload.
+
+-   make an edit in your source file, say `main.ts`
+-   after a couple seconds, the compiler picks up the changes, produces a new bytecode and sends it to the developer tools
+-   the developer tools automatically deploy thew bytecode to the select device (by default the simulator)
+-   switch from VS Code to the browser and debug your new code

website/docs/developer/getting-started.md …/docs/developer/getting-started/index.mdwebsite/docs/developer/getting-started.md renamed to website/docs/developer/getting-started/index.md website/docs/developer/getting-started.md renamed to website/docs/developer/getting-started/index.md

@@ -1,5 +1,4 @@
 ---
-sidebar_position: 2
 hide_table_of_contents: true
 ---
 
@@ -176,3 +175,8 @@ in the developer tools window.
 
 Click on the chip to start flasing the DeviceScript bytecode
 to your Raspberry Pico. It will automatically reflash when it detects changes.
+
+## Part 3: Using the command line
+
+That's it for this guide. In the next getting started, we'll show how to build
+this example using the command line tool in VS Code.

website/src/remark/render-code-blocks.mjs

@@ -4,20 +4,22 @@
 
 // TODO: factor into an independent plugin
 import visit from "unist-util-visit"
-import logger from "@docusaurus/logger"
 import fs_extra_pkg from "fs-extra"
 import { spawnSync } from "child_process"
 const { readJsonSync, writeJsonSync, ensureDirSync } = fs_extra_pkg
 import { createHash } from "crypto"
 
+const info = console.debug
+const debug = console.debug 
+
 // site version
 const sitePkg = readJsonSync("../compiler/package.json")
 // for version `x.y.z`, only recompute hashes if `x` changes
 // to avoid recomputation over minor changes on the website
 // (so we only recompute for every major release)
 const VERSION = sitePkg.version.replace(/(\..)*$/g, "")
 
-logger.info(`rendering snippets ${VERSION}`)
+info(`rendering snippets ${VERSION}`)
 // language configs
 import getLangConfig from "../../language.config.js"
 const languageConfig = await getLangConfig()
@@ -144,7 +146,7 @@ async function getOutput(config, input, lang, skipErr) {
         )
     }
 
-    logger.debug`${lang}: ${hash}, ${status}, ${error}`
+    debug(`${lang}: ${hash}, ${status}, ${error}`)
 
     const errorToReport = checkRuntimeError(
         langVersion,