Notes for Visual Studio Code By Scott Granneman & Jans Carton Find the presentation at http://www.granneman.com/presentations/ ## Slide 11 Rothfeld, Becca. “‘The New Annotated H.P. Lovecraft’”. The Washington Post, 27 Oct 2014, https://www.washingtonpost.com/entertainment/books/the-new-annotated-hp-lovecraft/2014/10/23/1fa79d8a-52f6-11e4-892e-602188e70e9c_story.html. Web. 27 Nov 2022. ## Slide 17 Rothfeld, Becca. “‘The New Annotated H.P. Lovecraft’”. The Washington Post, 27 Oct 2014, https://www.washingtonpost.com/entertainment/books/the-new-annotated-hp-lovecraft/2014/10/23/1fa79d8a-52f6-11e4-892e-602188e70e9c_story.html. Web. 27 Nov 2022. ## Slide 18 Rothfeld, Becca. “‘The New Annotated H.P. Lovecraft’”. The Washington Post, 27 Oct 2014, https://www.washingtonpost.com/entertainment/books/the-new-annotated-hp-lovecraft/2014/10/23/1fa79d8a-52f6-11e4-892e-602188e70e9c_story.html. Web. 27 Nov 2022. ## Slide 54 For a lot more on Spotlight, see my slides titled Getting More From Your Mac: Spotlight Slides: https://granneman.com/downloads/apple/GMFYM-Spotlight.pdf (19 MB PDF) Notes: https://granneman.com/downloads/apple/GMFYM-Spotlight.txt ## Slide 72 https://www.granneman.com/tech/windows/showextensions/ ## Slide 73 Granneman, Scott. “Visual Studio Code - Initial Info - Turn on Filename Extensions”. Vimeo, 18 Oct 2022, https://vimeo.com/761686499. Web. 11 Nov 2022. ## Slide 75 Rakozy, Greg [@grakozy]. “silhouette photography of person photo – Free Sky Image on Unsplash”. Unsplash, 12 Oct 2015, https://unsplash.com/photos/oMpAz-DN-9I. Web. 1 Nov 2015. Licensed from Unsplash: https://unsplash.com/license. ## Slide 80 Sensa. “Face with symbols on mouth”. Sensa, 4 Mar 2021, https://sensa.co/emoji/. Web. 12 Oct 2022. MIT License: https://github.com/sensadesign/sensaemoji/blob/main/LICENSE Copyright (c) 2021 sensadesign ## Slide 81 Granneman, Scott. “Visual Studio Code - Initial Info - Main Project Folder”. Vimeo, 11 Oct 2022, https://vimeo.com/758991172. Web. 11 Nov 2022. ## Slide 90 https://code.visualstudio.com ## Slide 91 Wikipedia contributors. “Microsoft Visual Studio”. Wikipedia, The Free Encyclopedia, 17 July 2022, https://en.wikipedia.org/wiki/Microsoft_Visual_Studio. Web. 20 July 2022. Microsoft. “Visual Studio: IDE and Code Editor for Software Developers and Teams”. Visual Studio. Microsoft, 2022, https://visualstudio.microsoft.com. Web. 20 July 2022. ## Slide 92 https://code.visualstudio.com ## Slide 101 Icon by Dave Gandy: https://www.flaticon.com/authors/dave-gandy ## Slide 102 https://code.visualstudio.com/docs/setup/linux ## Slide 103 https://code.visualstudio.com/docs/setup/linux ## Slide 107 For a video of this process, see “Visual Studio Code - Installation - Running in GitHub” at https://vimeo.com/769775274. ## Slide 108 For a video of this process, see “Visual Studio Code - Installation - Running in GitHub” at https://vimeo.com/769775274. ## Slide 111 Dias, Chris. “vscode.dev(!)”. Visual Studio Code, 20 Oct 2021, https://code.visualstudio.com/blogs/2021/10/20/vscode-dev. Web. 09 Nov 2022. ## Slide 112 Microsoft. “Get Started — Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 113 Microsoft. “Get Started — Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 114 Microsoft. “Get Started — Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 115 Microsoft. “Get Started — Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 116 Microsoft. “Get Started — Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 117 Microsoft. “Get Started — Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 118 Microsoft. “Get Started — Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 119 Microsoft. “Get Started — Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 120 Microsoft. “Get Started — Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 121 Microsoft. “settings.json — Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 122 Microsoft. “Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 123 Microsoft. “Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 124 Microsoft. “Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 125 Microsoft. “Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 126 Microsoft. “Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 127 Microsoft. “Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 128 Microsoft. “Visual Studio Code Server”. Visual Studio Code, 2 Nov 2022, https://code.visualstudio.com/docs/remote/vscode-server. Web. 09 Nov 2022. ## Slide 129 Microsoft. “Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 130 Microsoft. “Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 131 Microsoft. “Workspace — Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 132 Microsoft. “index.html — herbert-west [GitHub] - Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 133 Microsoft. “index.html — herbert-west [GitHub] - Visual Studio Code”. Visual Studio Code, https://vscode.dev/. Web. 09 Nov 2022. ## Slide 212 VS Code documentation calls this the “suggestion documentation fly-out”: Microsoft. “Emmet in Visual Studio Code”. Visual Studio Code, 30 Mar. 2022, https://code.visualstudio.com/docs/editor/emmet. Web. 6 Apr 2022. ## Slide 213 https://developer.mozilla.org/en-US/docs/Web/HTML/Element/p ## Slide 222 https://emmet.io ## Slide 239 “Abbreviations Syntax”. Emmet Documentation, https://docs.emmet.io/abbreviations/syntax/. Web. 5 Apr 2022. ## Slide 257 Granneman, R. Scott. “GrannePack Web Dev Snippets”. Visual Studio Marketplace, 20 Jan 2023, https://marketplace.visualstudio.com/items?itemName=granneman.grannepack-html. Web. 20 Jan 2023. ## Slide 297 https://marketplace.visualstudio.com/search?term=grannepack&target=VSCode&category=All%20categories&sortBy=Relevance ## Slide 298 Granneman, R. Scott. “GrannePack HTML”. Visual Studio Marketplace, , https://marketplace.visualstudio.com/items?itemName=granneman.grannepack-html. ## Slide 299 FIXME: redo as table ## Slide 306 https://chnsa.ws/1b1 ## Slide 307 Granneman, R. Scott. “HTML5 template for Web dev courses”. GitHub, 30 Oct 2018, https://gist.github.com/rsgranne/e5a9c5706679bfc5eb545537d09576ce. Web. 8 Oct 2022. ## Slide 308 Granneman, R. Scott. “HTML5 template for Web dev courses”. GitHub, 30 Oct 2018, https://gist.github.com/rsgranne/e5a9c5706679bfc5eb545537d09576ce. Web. 8 Oct 2022. ## Slide 309 Granneman, R. Scott. “[Code for HTML5 template for Web dev courses]”. GitHub, 30 Oct 2018, https://gist.githubusercontent.com/rsgranne/e5a9c5706679bfc5eb545537d09576ce/raw/4718225d4deb0b7a4b1cee5aa01b7f050ede53be/html5.html. Web. 8 Oct 2022. ## Slide 310 Granneman, R. Scott. “[Code for HTML5 template for Web dev courses]”. GitHub, 30 Oct 2018, https://gist.githubusercontent.com/rsgranne/e5a9c5706679bfc5eb545537d09576ce/raw/4718225d4deb0b7a4b1cee5aa01b7f050ede53be/html5.html. Web. 8 Oct 2022. ## Slide 322 https://chnsa.ws/1yn ## Slide 323 Granneman, R. Scott. “Bootstrap 5 CDN template for Web dev courses”. GitHub, 08 Oct 2022, https://gist.github.com/rsgranne/c98ddd1cdf30eea5c68fd59640663f11. Web. 08 Oct 2022. ## Slide 324 Granneman, R. Scott. “Bootstrap 5 CDN template for Web dev courses”. GitHub, 08 Oct 2022, https://gist.github.com/rsgranne/c98ddd1cdf30eea5c68fd59640663f11. Web. 08 Oct 2022. ## Slide 325 Granneman, R. Scott. “[Code for Bootstrap 5 CDN template for Web dev courses]”. GitHub, 8 Oct 2022, https://gist.githubusercontent.com/rsgranne/c98ddd1cdf30eea5c68fd59640663f11/raw/1fb44ff50fe0690d8c79ebde3cc894f7984f69bd/bootstrap-5-cdn.html. Web. 8 Oct 2022. ## Slide 326 Granneman, R. Scott. “[Code for Bootstrap 5 CDN template for Web dev courses]”. GitHub, 8 Oct 2022, https://gist.githubusercontent.com/rsgranne/c98ddd1cdf30eea5c68fd59640663f11/raw/1fb44ff50fe0690d8c79ebde3cc894f7984f69bd/bootstrap-5-cdn.html. Web. 8 Oct 2022. ## Slide 336 Bootstrap 3 CDN template: https://chnsa.ws/1b2 Bootstrap 4 CDN template: https://chnsa.ws/1b3 Bootstrap 4 NPM template (https://chnsa.ws/1bz) is only needed unless I specifically tell you to, which will be unlikely ## Slide 359 Wikipedia contributors. “Context menu”. Wikipedia, The Free Encyclopedia, 10 May 2022, https://en.wikipedia.org/wiki/Context_menu. Web. 8 Oct. 2022. ## Slide 383 Granneman, Scott. “Visual Studio Code - Installation - Running in GitHub”. Vimeo, 11 Oct 2022, https://vimeo.com/758916351. Web. 11 Nov 2022. ## Slide 398 FIXME: add video ## Slide 399 FIXME Do this section! ## Slide 405 FIXME: add video ## Slide 446 https://marketplace.visualstudio.com/items?itemName=AdamCaviness.theme-monokai-dark-soda ## Slide 454 https://marketplace.visualstudio.com/items?itemName=PKief.material-icon-theme ## Slide 455 https://marketplace.visualstudio.com/items?itemName=PKief.material-icon-theme ## Slide 459 https://marketplace.visualstudio.com/items?itemName=granneman.grannepack-css ## Slide 518 No, you can’t fold everything in just a particular section of code ## Slide 528 https://en.wikipedia.org/wiki/Git; basic definition modified by me ## Slide 556 https://code.visualstudio.com ## Slide 562 Icon by Dave Gandy: https://www.flaticon.com/authors/dave-gandy ## Slide 563 https://code.visualstudio.com/#alt-downloads ## Slide 603 https://web.archive.org/web/20190914070227/https://code.visualstudio.com/blogs/2017/11/15/live-share ## Slide 613 Screenshot by me. ## Slide 614 Screenshot by me. ## Slide 615 Screenshot by me.