7.2: Visual Studio Code (VSC)
- Page ID
- 467080
\( \newcommand{\vecs}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \)
\( \newcommand{\vecd}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash {#1}}} \)
\( \newcommand{\id}{\mathrm{id}}\) \( \newcommand{\Span}{\mathrm{span}}\)
( \newcommand{\kernel}{\mathrm{null}\,}\) \( \newcommand{\range}{\mathrm{range}\,}\)
\( \newcommand{\RealPart}{\mathrm{Re}}\) \( \newcommand{\ImaginaryPart}{\mathrm{Im}}\)
\( \newcommand{\Argument}{\mathrm{Arg}}\) \( \newcommand{\norm}[1]{\| #1 \|}\)
\( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\)
\( \newcommand{\Span}{\mathrm{span}}\)
\( \newcommand{\id}{\mathrm{id}}\)
\( \newcommand{\Span}{\mathrm{span}}\)
\( \newcommand{\kernel}{\mathrm{null}\,}\)
\( \newcommand{\range}{\mathrm{range}\,}\)
\( \newcommand{\RealPart}{\mathrm{Re}}\)
\( \newcommand{\ImaginaryPart}{\mathrm{Im}}\)
\( \newcommand{\Argument}{\mathrm{Arg}}\)
\( \newcommand{\norm}[1]{\| #1 \|}\)
\( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\)
\( \newcommand{\Span}{\mathrm{span}}\) \( \newcommand{\AA}{\unicode[.8,0]{x212B}}\)
\( \newcommand{\vectorA}[1]{\vec{#1}} % arrow\)
\( \newcommand{\vectorAt}[1]{\vec{\text{#1}}} % arrow\)
\( \newcommand{\vectorB}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \)
\( \newcommand{\vectorC}[1]{\textbf{#1}} \)
\( \newcommand{\vectorD}[1]{\overrightarrow{#1}} \)
\( \newcommand{\vectorDt}[1]{\overrightarrow{\text{#1}}} \)
\( \newcommand{\vectE}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash{\mathbf {#1}}}} \)
\( \newcommand{\vecs}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \)
\( \newcommand{\vecd}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash {#1}}} \)
\(\newcommand{\avec}{\mathbf a}\) \(\newcommand{\bvec}{\mathbf b}\) \(\newcommand{\cvec}{\mathbf c}\) \(\newcommand{\dvec}{\mathbf d}\) \(\newcommand{\dtil}{\widetilde{\mathbf d}}\) \(\newcommand{\evec}{\mathbf e}\) \(\newcommand{\fvec}{\mathbf f}\) \(\newcommand{\nvec}{\mathbf n}\) \(\newcommand{\pvec}{\mathbf p}\) \(\newcommand{\qvec}{\mathbf q}\) \(\newcommand{\svec}{\mathbf s}\) \(\newcommand{\tvec}{\mathbf t}\) \(\newcommand{\uvec}{\mathbf u}\) \(\newcommand{\vvec}{\mathbf v}\) \(\newcommand{\wvec}{\mathbf w}\) \(\newcommand{\xvec}{\mathbf x}\) \(\newcommand{\yvec}{\mathbf y}\) \(\newcommand{\zvec}{\mathbf z}\) \(\newcommand{\rvec}{\mathbf r}\) \(\newcommand{\mvec}{\mathbf m}\) \(\newcommand{\zerovec}{\mathbf 0}\) \(\newcommand{\onevec}{\mathbf 1}\) \(\newcommand{\real}{\mathbb R}\) \(\newcommand{\twovec}[2]{\left[\begin{array}{r}#1 \\ #2 \end{array}\right]}\) \(\newcommand{\ctwovec}[2]{\left[\begin{array}{c}#1 \\ #2 \end{array}\right]}\) \(\newcommand{\threevec}[3]{\left[\begin{array}{r}#1 \\ #2 \\ #3 \end{array}\right]}\) \(\newcommand{\cthreevec}[3]{\left[\begin{array}{c}#1 \\ #2 \\ #3 \end{array}\right]}\) \(\newcommand{\fourvec}[4]{\left[\begin{array}{r}#1 \\ #2 \\ #3 \\ #4 \end{array}\right]}\) \(\newcommand{\cfourvec}[4]{\left[\begin{array}{c}#1 \\ #2 \\ #3 \\ #4 \end{array}\right]}\) \(\newcommand{\fivevec}[5]{\left[\begin{array}{r}#1 \\ #2 \\ #3 \\ #4 \\ #5 \\ \end{array}\right]}\) \(\newcommand{\cfivevec}[5]{\left[\begin{array}{c}#1 \\ #2 \\ #3 \\ #4 \\ #5 \\ \end{array}\right]}\) \(\newcommand{\mattwo}[4]{\left[\begin{array}{rr}#1 \amp #2 \\ #3 \amp #4 \\ \end{array}\right]}\) \(\newcommand{\laspan}[1]{\text{Span}\{#1\}}\) \(\newcommand{\bcal}{\cal B}\) \(\newcommand{\ccal}{\cal C}\) \(\newcommand{\scal}{\cal S}\) \(\newcommand{\wcal}{\cal W}\) \(\newcommand{\ecal}{\cal E}\) \(\newcommand{\coords}[2]{\left\{#1\right\}_{#2}}\) \(\newcommand{\gray}[1]{\color{gray}{#1}}\) \(\newcommand{\lgray}[1]{\color{lightgray}{#1}}\) \(\newcommand{\rank}{\operatorname{rank}}\) \(\newcommand{\row}{\text{Row}}\) \(\newcommand{\col}{\text{Col}}\) \(\renewcommand{\row}{\text{Row}}\) \(\newcommand{\nul}{\text{Nul}}\) \(\newcommand{\var}{\text{Var}}\) \(\newcommand{\corr}{\text{corr}}\) \(\newcommand{\len}[1]{\left|#1\right|}\) \(\newcommand{\bbar}{\overline{\bvec}}\) \(\newcommand{\bhat}{\widehat{\bvec}}\) \(\newcommand{\bperp}{\bvec^\perp}\) \(\newcommand{\xhat}{\widehat{\xvec}}\) \(\newcommand{\vhat}{\widehat{\vvec}}\) \(\newcommand{\uhat}{\widehat{\uvec}}\) \(\newcommand{\what}{\widehat{\wvec}}\) \(\newcommand{\Sighat}{\widehat{\Sigma}}\) \(\newcommand{\lt}{<}\) \(\newcommand{\gt}{>}\) \(\newcommand{\amp}{&}\) \(\definecolor{fillinmathshade}{gray}{0.9}\)Visual Studio Code is also known as VS Code or VSC is a powerful light weight IDE developed by Microsoft that has Git and GitHub integration. The download link is https://code.visualstudio.com/ and we will be developing this tutorial as the class proceeds. This is also a useful editor for HTML web pages and it even allows you to watch the webpage change as you edit it. Once again, you should surf the web for tutorials and if you find any that you really like you should annotate them and tag them with the tags physical-computing and vs-code. Note, if you want to work with Git you will need to install it (https://git-scm.com/downloads).
Getting Started
https://code.visualstudio.com/docs is the place to get started. Figure \(\PageIndex{1}\) shows the Quick Start Guide for using python. You should familiarize yourself with this resource if you plan to use VSCode. You need to do three things to use VSC with Python:
- Instal VS Code
- Instal Python
- Instal a Python extension from the VS Code Market Place
Note, if you already have Python installed the VS code will connect to the most recent version, and if you try to open a Python file it will direct you to get the extension.
![clipboard_e8dba5b749544ab7af96adb6ab6570ef0.png](https://chem.libretexts.org/@api/deki/files/466442/clipboard_e8dba5b749544ab7af96adb6ab6570ef0.png?revision=1&size=bestfit&height=595)
Figure \(\PageIndex{1}\): Screenshot (1/22/2024) of VS Code Docs Quick Start page. (Belford CC 0.0)
Live Preview (html)
go to extensions (bottom icon on left panel) and search for "live preview" and then instal
![clipboard_ee88917022c03b292c52b26db3a3e0a30.png](https://chem.libretexts.org/@api/deki/files/466530/clipboard_ee88917022c03b292c52b26db3a3e0a30.png?revision=1)
Installing VSC on Raspberry Pi 4
VS Code is recommended software and thus simple to install. Click the Pi icon, choose preference/Recommended Software. After the list is compiled scroll down and click Visual Studio Code and apply.
![clipboard_ed0fb883aebfac401295baac835eba2fa.png](https://chem.libretexts.org/@api/deki/files/466439/clipboard_ed0fb883aebfac401295baac835eba2fa.png?revision=1)
Now choose Visual Studio Code
![clipboard_e5d1130725d21af2095749f40c3a955e4.png](https://chem.libretexts.org/@api/deki/files/466441/clipboard_e5d1130725d21af2095749f40c3a955e4.png?revision=1)
and apply.
Note, the first time you open a python file with VS Code it will ask you if you want to
![clipboard_ef3f09882e632c001162e8d506286de3f.png](https://chem.libretexts.org/@api/deki/files/466444/clipboard_ef3f09882e632c001162e8d506286de3f.png?revision=1)
Figure \(\PageIndex{3}\): Screenshot (1/22/2024) of the first time VSC is run on a Pi and it asks if we want to install the recommended Python Extension. (Belford CC 0.0)
It will then instal the extension, and this make take a bit of time
![clipboard_e01dd2b311072996fba7020c65c91c4fd.png](https://chem.libretexts.org/@api/deki/files/466445/clipboard_e01dd2b311072996fba7020c65c91c4fd.png?revision=1)
![clipboard_e1b48c01a7470e764b8d947996dc670a6.png](https://chem.libretexts.org/@api/deki/files/466447/clipboard_e1b48c01a7470e764b8d947996dc670a6.png?revision=1)
This program involves a 40 iteration loop (the 20th was just completed) that prints the data to the terminal and then uploads the data to a Google sheet.
![clipboard_e24c8ee209a40c3a7d69aa8b395382d06.png](https://chem.libretexts.org/@api/deki/files/466434/clipboard_e24c8ee209a40c3a7d69aa8b395382d06.png?revision=1)