Using Visual Studio (VS) Code
Using VS Code as your development environment
VS Code can be used as an IDE (integrated development environment) which provides helpful tooling (including debugging) to assist developers in writing code. It also has many other functions which non-developers may also find useful such a text editing and markdown rendering.
VS Code comes built-in with every installation of Nebari. To start, log in to Nebari and spin up a JupyterLab instance.
Next, bring up the
New Launcher window by clicking the
+ in the top left of
the screen. Now click on the VS Code logo on the Launcher window.
You will now have been redirected to a new web browser page showing the VS Code platform. If you're starting VS Code for the first time, you'll see a Welcome Page with some helpful links and tips.
Feel free to explore!
VS Code components
On the far left, you'll see the
Activity Bar in black. Also, on the left is
Explorer. As you click on the items in the
Activity Bar, the
items will update.
Let's review some of the most useful features.
The Activity Bar components
Activity Bar is where you'll go to switch between the main tools
available in VS Code. Below is a brief overview of the icons on the
Activity Bar (adding extensions may add additional icons to your menu).
|File Menu||Like every other file menu - create files, run files, edit preferences...|
|File Explorer||View list of files, navigate folder structures|
|Search||Search for words in the contents of files|
|Source Control||Source Control Management (SCM) features (e.g. git)|
|Debug||Run code using the debugger|
|Extensions||Add plugins to extend VS Code functionality|
Now that we have that out of the way, let's explore!
We'll start by clicking on the
File Explorer icon. The
Explorer sidebar now
is updated with our file system. In our case, this is our Nebari user root
One of the first things you'll notice here is that there are a lot of files
starting with the
. character. This is particularly handy because JupyterLab
hides these files in its Explorer view.
Let's click on a file we all have,
.bashrc. This file was created by Nebari
We now have an
Editor window in which we can modify the file. The default
VS Code preferences include an auto-save feature which will continually save
the files as soon as you stop typing edits.
Activity Bar, navigate to the
now shows lists of Extensions, grouped by those installed by your admin, those
installed by you, and a list of "Popular" extensions you may want to try.
Through this interface we can also search the Marketplace for a particular
The Python extension is at the top of the list in our example (rightly so!), but if you don't see it here, you can search for it.
If you click on the Python extension, you'll see additional information about
this extension in the main window. This extension provides some extra tooling
around Python. It will allow us to select a Python environment and run and
debug code right inside of VS Code. Go ahead and click
Install. It should
only take a few seconds to install.
Now let's run some code!
Running Python code
Explorer pane, selected the
New File icon:
You can name it anything you'd like, here we've named it
*.py extension let's VS Code know that it's a Python file, and you can set up
some automatic linting tasks through Preferences if you'd like.
Add some sample code to your file:
We also see the VS Code
Terminal in the previous image. This can be
File -> Terminal -> New Terminal.
Before we run our file, we need to select what Conda environment it should run inside.
Now we can run our code through the VS Code UI by selecting either
Run Python File or
Debug Python File in the top right.
We can see output in the terminal:
As another alternative, we could run code directly from the terminal as well.
We've covered the basic setup and run some arbitrary code. If you're curious about more advanced features or have specific questions, you can always refer back to the VS Code Documentation.