diff --git a/.gitignore b/.gitignore index b0f719bd..f45023cc 100644 --- a/.gitignore +++ b/.gitignore @@ -15,3 +15,4 @@ static/gitbook/assets/.DS_Store static/gitbook/assets/pybytes/.DS_Store scripts/githubToken.json .project +.history \ No newline at end of file diff --git a/content/gettingstarted/software/vscode.md b/content/gettingstarted/software/vscode.md index a421764b..11486f3c 100644 --- a/content/gettingstarted/software/vscode.md +++ b/content/gettingstarted/software/vscode.md @@ -8,50 +8,39 @@ aliases: Pycom supports Microsoft's Visual Studio Code IDE platform with the Pymakr Plugin. -1. First [download and install Visual Studio Code](https://code.visualstudio.com/). +1. First [download and install Visual Studio Code](https://code.visualstudio.com/). +2. Install the [Pymakr VSCode Extension](https://marketplace.visualstudio.com/items?itemName=pycom.Pymakr) + + _(We're installing the preview, but once the project reaches "stable" we'll, be using the regular extension.)_ -2. You will also need NodeJS installed on your PC. Please download the latest LTS version available [from the NodeJS website.](https://nodejs.org/) + ![](/gitbook/assets/pymakr-vsc/install-pymakr.gif) -Please follow these steps to install the [Pymakr VSCode Extension](https://marketplace.visualstudio.com/items?itemName=pycom.Pymakr): +3. That's it! You've installed the Pymakr Extension for VSCode -3. Ensure that you have the latest VSCode installed and open. +## Creating a project -![](/gitbook/assets/vsc_setup_step_1-1.png) +Pymakr revolves around projects that can be uploaded to your devices. To create your first project click the `+` icon and select a folder for your project: -4. Navigate to the Extensions page, using the 5th button in the left navigation +![](/gitbook/assets/pymakr-vsc/create-project.gif) -![](/gitbook/assets/vsc_setup_step_2-1.png) +_Note: If a project is created outside the current workspace(s), its folder will be mounted as a new workspace._ -5. Search for `Pymakr` and click the install button next to it. +## Creating a script -![](/gitbook/assets/vsc_setup_step_3.png) +Below we add a `main.py`. This file will run whenever the device is reset. -6. Within a few minutes, a reload button should appear. Press it to reload VSCode. +![](/gitbook/assets/pymakr-vsc/saving-a-file.gif) -![](/gitbook/assets/vsc_setup_step_4.png) +## Upload the project to a device -7. That's it! You've installed the Pymakr Extension for VSCode +Once the project is ready to run, it needs to be uploaded to a device. -![](/gitbook/assets/vsc_setup_step_5.png) +![](/gitbook/assets/pymakr-vsc/connect-device-and-sync-up.gif) -## Connecting via Serial USB - -After installing the Pymakr Plugin, you need to take a few seconds to configure it for first time use. Please follow these steps: - -1. Connect your Pycom device to your computer via USB. - -2. Open Visual Studio Code and ensure that the Pymakr Plugin has correctly installed. - -![](/gitbook/assets/vsc_config_step_1-1.png) - -3. Generally, your device will be auto-detected. If this does not work, click `All commands` on the bottom of the Visual Studio Code window - -![](/gitbook/assets/vsc_config_step_2-1.png) - -4. In the list that appears, click `Pymakr > Extra > List Serial Ports` +--- -![](/gitbook/assets/vsc_config_step_3-1.png) +## Hint: Organizing your setup -5. This will list the available serial ports. If Pymakr is able to auto-detect which to use, this will be copied to your clipboard. If not please manually copy the correct serial port. +Having to switch between different tabs can be cumbersome. To solve this, you can drag your devices and projects to the file explorer view. -![](/gitbook/assets/vsc_config_step_4.png) \ No newline at end of file +![](/gitbook/assets/pymakr-vsc/move-view.gif) \ No newline at end of file diff --git a/static/gitbook/assets/pymakr-vsc/connect-device-and-sync-up.gif b/static/gitbook/assets/pymakr-vsc/connect-device-and-sync-up.gif new file mode 100644 index 00000000..838c3ffe Binary files /dev/null and b/static/gitbook/assets/pymakr-vsc/connect-device-and-sync-up.gif differ diff --git a/static/gitbook/assets/pymakr-vsc/connect-device.gif b/static/gitbook/assets/pymakr-vsc/connect-device.gif new file mode 100644 index 00000000..81007ae5 Binary files /dev/null and b/static/gitbook/assets/pymakr-vsc/connect-device.gif differ diff --git a/static/gitbook/assets/pymakr-vsc/create-project.gif b/static/gitbook/assets/pymakr-vsc/create-project.gif new file mode 100644 index 00000000..6f9cabd1 Binary files /dev/null and b/static/gitbook/assets/pymakr-vsc/create-project.gif differ diff --git a/static/gitbook/assets/pymakr-vsc/install-pymakr.gif b/static/gitbook/assets/pymakr-vsc/install-pymakr.gif new file mode 100644 index 00000000..8623442d Binary files /dev/null and b/static/gitbook/assets/pymakr-vsc/install-pymakr.gif differ diff --git a/static/gitbook/assets/pymakr-vsc/move-view.gif b/static/gitbook/assets/pymakr-vsc/move-view.gif new file mode 100644 index 00000000..24a1b095 Binary files /dev/null and b/static/gitbook/assets/pymakr-vsc/move-view.gif differ diff --git a/static/gitbook/assets/pymakr-vsc/saving-a-file.gif b/static/gitbook/assets/pymakr-vsc/saving-a-file.gif new file mode 100644 index 00000000..3fcf1cb7 Binary files /dev/null and b/static/gitbook/assets/pymakr-vsc/saving-a-file.gif differ