-
Stack Overflow Annual Developer Surveys: VS Code is the most popular integrated development environment (IDE) since 2018.
Year VS Code* Rank 2015 Release - 2016 7% 13 2017 23% 5 2018 35% 1 2019 51% 1 2020 - - 2021 71% 1 2022 74% 1 2023 74% 1 *Percentage of respondents using VS Code as a developer environment (multiple answers possible).
-
2022 State of the Octoverse: github.com/microsoft/vscode is
#1
repository on GitHub by number of contributors -
The VS Code Marketplace has 49k extensions as of July 2023
What brought us to VS Code?
A brief overview of VS Code.
- Launching VS Code
- Local (Desktop icon /
code .
) - Browser: Primary option for workshop (https://vscode.dev/,
.
on any GitHub page)
- Local (Desktop icon /
Follow the setup instructions in the [README](README.md#setup-instructions). For quick set-up we recommend using Codespaces directly from GitHub!
How to navigate VS Code’s user interface.
- Command Palette / Command center
- Activity bar
- Open folder
- Search
- Help:
?
- Status bar
- Panel
- Accessibility (color themes, screen readers, screencast mode, etc.)
- VS Code terminal (xtermjs)
- Navigating without a mouse
1. Browse to the tutorial repo on GitHub and try opening it either in your browser (press `.` when on repo page) or cloning it locally and opening with `code .`.
2. Use the Command Palette to Zoom in and Zoom out (editor and/or view).
3. Search for Color Themes using the Extensions tab. You can find extensions or color themes that are accessible for color vision deficiencies, for example, take a look at the color blind-friendly extensions. If you are using a [screen reader](https://code.visualstudio.com/docs/editor/accessibility#_screen-readers) such as NVDA, JAWS and VoiceOver, try using it with VS Code!
4. Use the Command Palette or "gear" icon to change your Color Theme to a non-default one.
More fun and helpful UI features and settings.
- Some key settings to check:
- Customizing Telemetry
- Color themes: Dark, Colorblind
- Auto save
- Files default language
- Settings sync
- Profiles
- Extensions marketplace
- Don't see what you need? Make your own!
1. Create a new profile or use one of the templates.
2. Either in your local or browser-based VS Code, try customizing some settings, themes, font sizes, etc.
3. Export your current profile as a gist (or locally if you prefer).
4. Copy-paste the URL for your profile gist, and add it to the [discussion page](https://github.com/crazy4pi314/scipy-vscode-tutorial/discussions/17).
5. Try making a profile for presenting/screencasting or maybe a distraction-free writing space and take turns sharing all your cool new profiles with your team 😄
6. Try importing a profile created by someone else via the `Profiles` > `Import Profile...` option in the Gear menu! You can find @crazy4pi314's profiles [here](https://gist.github.com/crazy4pi314/a3b1157dcd0873d471fb79cf5dffaba4).
We will set up a Python project and install the necessary extensions. This piece is fairy quick and self-guided.
- Python Environments in VS Code
- Default intrepreter settings
- Python environment manager
- Common Python extensions
- Python extension pack by Don Jayamanne
- Jupyter
- formatters / linters: pylint, flake8, black, autopep8, ...
1. In the Codespace for this workshop or locally (in a Dev Container) on your machine, create a new virtual environment by running:
```bash
cd scipy-vscode-tutorial
conda install -n base -c conda-forge mamba
mamba env create -f environment.yml
conda activate tutorial
```
2. Install the tutorial package by running:
```bash
pip install -e .
```
3. Use the Command Palette to run the `Python: Select Interpreter` command and set it to the `tutorial` environment you just created.
4. Use the Command Palette to create a new Interactive Window using the `Jupyter: Create Interactive Window` command.
5. Run the following lines to test your environment:
```python
from tutorial import welcome
welcome()
```