about
Bits Tooling
02/05/2022
Bits Repo Code Bits Repo Docs

Bits Tooling

Development tools for C++, Rust, C#, Python, and JavaScript on Windows, macOS, and Linux

1.0 Prologue

In this Bit we look at processes for building programs and software systems using C#, C++, Rust, Python and JavaScript. The intent is to provide build processes for each of these languages that are as nearly identical as practical, and to enable builds on Windows, Linux, and macOS. One major ingredient is the use of Visual Studio Code as a code editor for all five languages on all three OS platforms. VS Code supports plugins for each of these languages that provide intellisense and error flags. It also provides a contained terminal window we will use to initiate builds from the command line and executions of successful build products. Plugins provide debugging with the help of VS Code launch profiles written in JSON. We will show how to set up and configure all of this, in this page, and in the "Hello World" Bits.
Note: All of the compiler tools, github account, and git have free versions. those are what I used for all of these demonstrations.

Tool Chains

VS Code is essentially a code editor. In order to support builds it needs tool chain support for each of these languages. Plugins for each language bind VS Code operations to its tool chain.
The video below will give you, in less than ten minutes, a brief introduction to Visual Studio Code, a.k.a, VS Code. It demonstrates the VS Code editor building, running, and debugging C# and Python code. The video also looks at documentation with step-by-step commands for setting up and using VS Code.
You will probably want to view "picture-in-picture" or "full-screen" so details are large enough to be seen easily.
Running as "picture in picture" allows you to move to other web pages while still watching and listening to the video.

2.0 Visual Studio Code Editor:

Figure 1. VS Code IDE

Installation:

Download Visual Studio Code, a.k.a. VS Code. This works for Windows, Linux, and macOS. Then run installer from Downloads folder.

IDE Setup:

There are two things you may wish to change in the default configuration:
  1. The terminal panel, Figure 1 on the right, is placed by default at the bottom of the IDE window. It works better for me to have it on the right. You can place it wherever you like with settings (click Gear icon at left bottom -> settings):
    Settings -> User -> Workbench -> Panel Default Location
  2. By default the IDE shows a code Minimap on the right of the code editing panel. You can disable that with:
    Settings -> User -> TextEditor -> Minimap
You will find it convenient to use the key board shortcuts:
  • "ctrl /" to toggle comments on selected lines
  • "ctrl [ and ctrl ]" to control indenting of selected lines
  • Also, to open integrated terminal in any folder, right click any file in the folder and select "Open in Integrated Terminal". This is particularly useful when you open a workspace folder (any folder with .vscode subfolder).

Other Settings:

To change other settings:
  • "settings -> Editor -> uncheck Accept Suggestion on Commit Character" to avoid many spurious insertions of unwanted suggestions.
  • "settings -> search for menu -> select Menu Bar Visibility" to show/hide top menu
  • "F11" to toggle full screen mode
  • "View -> Command Palette -> .Net: Generate Assets for Build and Debug" enables Run -> Start Debugging. Have to have editor open in project directory. This creates a launch.json file, but only for dotnet builds.
    In the pages that follow you will find launch.json files for each of the other languages, with the exception of JavaScript which doesn't need a build process other than loading in a browser.
  • "ctrl K, ctrl T -> select editor theme" to select one of many alternatives
  • "settings -> workbench -> appearance -> color customizations" to set terminal colors
  • "File -> Preferences -> Settings" to change lots of defaults
  • "File -> Preferences -> Settings -> user -> Features -> Terminal" to change Terminal defaults
  • "View -> Command Pallet -> Preferences: Open Settings (JSON)" to edit any user setting you've changed
Settings Details
Figure 4. VS Code Project launch Settings Figure 5. VS Code User Settings The settings you will manage most often are local settings for each project, found in a .vscode folder at the top level of your project. Initially that folder doesn't exist, and you don't need to explicitly create it. VS Code creates it for you the first time you click on the Run or Terminal -> Run Task menus. You will be asked if you want to configure and, when you affirm by selecting a configuration, the folder is created and populated. That will happen as long as you have selected one or more plugins (see below). The C#, C++, and Rust plugins supply configurations for debugging. You can then edit them if you wish to modify the way debugging or builds happen. I do all builds in the terminal, so only have a launch.json file, no tasks.json file for building. VS Code settings are stored in three places:
  1. local project settings:
    Debugging settings in launch.json and build settings in tasks.json
    Find in project's .vscode folder, as JSON files launch.json and tasks.json
    Access by opening json file in code editor
  2. user settings:
    Hundreds of settings for Terminal, Keyboard mappings, ...
    Find in C:\Users\[userid]\AppData\Roaming\Code\User\settings.json
    Access: View -> Command Pallet -> Preferences -> Open Settings(JSON)
  3. default settings:
    All available settings (most of which you don't want to change)
    Doesn't appear to be a physical json file.
    Access: View -> Command Pallet -> Preferences -> Open Default Settings(JSON)
You can get to forms for changing preferences from Manage icon (gear) at left bottom of IDE.

2.1 Setup for Editing, Building, and Debugging Code:

VS Code, as delivered has a very good code editor, but does not have the ability to build, execute, and debug code for the languages of interest to us here. You get those by adding plugins from the plugin selector on the left. Figure 2. VS Code Plugins If you click on the plugins icon on the left border of the IDE you will see something like the view shown in Figure 2. That shows that I have installed plugins for C++, C#, CMake, and Rust. The C++ plugin provides intellisense for the code view and for building and debugging. The plugin uses MsBuild, but the path to that needs to be configured, and you can't easily configure the terminal to use MsBuild if it isn't on your path. For that, CMake is an excellent alternative. You may wish to look at my CMakeDemo repository for a use example. You build the project target by running CMake in the attached terminal. Then run or debug using the Run menu at the top of the IDE. The C# plugin provides intellisense. You need to build your project target in the attached terminal by issuing a "dotnet build" command. Then you can run or debug using the Run menu. The Rust plugin provides intellisense and the ability to build and run the resulting executable from the Run menu. Usually I do all the building in the terminal window and run from there as well. I just use the VS Code run menu to start Rust debugging.

Debugging:

Figure 3. VS Code Debugging One final remark: you get finer control over the debugging process by selecting the debug option on the left border of the IDE, just above the plugin selector. That allows you to select one of multiple debug configurations if you have them defined in launch.json (you find that inside the .vscode folder). You also can view local variables, set watches, and look at machine registers. If you expand Figure 3. by clicking on the image body, you will see the debug control bar at the top which provides controls for single stepping, step-into, step-outof, restart, and quit. The first button on the control bar is a continue button that will move to the next available breakpoint. You set those by clicking in the left margin of the edit window, just to the left of the line numbers.

Platforms:

All of the above works almost identically on both Windows and Linux. I've used VS Code on macOS, but haven't yet done much development there, but expect that all of these observations carry over to that platform as well. Complementing all of this with a github account makes it easy to move code between platforms, and use virtually the same development processes on each.

3.0 Github Repository

In order to use code from the github repositories built for this site, you will need to open a github account and install git on your local machine, if you haven't done that already. This git help page will help you get going quickly if you are new to git. There is a free account level for github which gives you all the tools you need while using material from this site.

4.0 Cloning Bits Repository

The Bits Track purpose is to enable comparing different languages, e.g., C++, Rust, C#, Python, and JavaScipt by comparing small compilable code fragments which are as similar as practical across these five languages. The examples are partitioned into "Hello World", "Data", "Objects", ... Figure 4. Cloning Bits Repository All example code is stored in the JimFawcett/Bits Repository on github so you can simply clone that into your local filesystem to get started. Cloning the github Bits repository to your local drive is simple, as shown in Fig 4.. That takes about 1 minute. You will find subdirectories in the cloned Bits for Cpp, CSharp, JavaScript, Python, and Rust. In each of these are subdirectories for each example: HelloWorld, Data, Objects, ... Each example directory is set up as a project for its implementation language, so you can simply open the folder in VS Code and run the example. That assumes you have set up the language tool chains as described below. Note that the Work Flow examples below include creating a project, but that has already been done for all the examples in the Bits Repository you cloned.

5.0 Development Process:

Topic C# C++ Rust Python JavaScript










Installation dotnet:
If you develop on Windows, Download Visual Studio Community Edition latest SDK and Desktop Runtime, assuming you haven't already done that for C++. Run installer from Downloads directory. We will use VS Code, not Visual Studio, but this download gives us the complete compiler tool chain.
Download dotnet core latest SDK and Desktop Runtime, assuming you haven't already done that for C#. Run installer from Downloads directory. The download page has links for Windows, Linux, and macOS.
CMake, C++ tools:
If you develop on Windows, Download Visual Studio Community Edition latest SDK and Desktop Runtime. Run installer from Downloads directory. We will use VS Code, not Visual Studio, but this download gives us the complete compiler tool chain.
Download CMake. For Windows, if you have Visual Studio Community Edition you already have the tools you need. For Linux download gcc/g++ from your connected repositories. On Ubuntu, install build-essential for a late version.
Rust: cargo, rustc, clippy
Download Rust. That includes rustc, the rust compiler, cargo, a package manager, and other tools like clippy. This works for Windows, Linux, and macOS.
Python:
Download Python. That includes everything you need for basic programming. Works for Windows, Linux, and macOS.
JavaScript:
All you need is a browser, an editor, and basic knowledge of HTML, CSS, and JavaScript, as described in these bits.
Work Flow C#:
In VS Code navigate to the parent folder where you want to create a dotnet project. Open the terminal (ctrl `) and issue the commands:
dotnet new console --name <projectname>
cd <projname>
That navigates into the new project directory. Now issue the command:
dotnet run
See the console project build and run, printing "Hello World!"
Now you can run the debugger by clicking on the top Run menu, select .net core launch, and step through the code. The first time you attempt to debug you will be asked if you want to generate .net assets for Build and Debug. If you don't do that you can always do that later with View > Command Palette > .Net Generate Assets for Build and Debug.
Results are, by default, shown in the integrated terminal, but you can change that to an external terminal if you wish by editing launch.json in the .vscode folder.
Start editing, adding files, and debugging to implement your design.
C++:
In VS Code, open the parent folder where you want to create a new C++ project. You can easily open VS Code terminal in any folder by navigating to the folder with the file menu, then right-clicking on any file and selecting open file in terminal.
In the terminal issue the command:
mkdir TestDir to create a new directory
From the File menu open the new directory and add a new file test.cpp
Open the file and add some C++ code in the editor. Now add a CMakeTests.txt file. Initially you may wish to simply copy from the CMakeDemo repository and use the non-hierarchal version. You will need to edit that to use the <projectname> and source <filename>.
Create a build directory: mkdir build and cd into that folder in the terminal. Issue the commands: CMake ..
CMake ../build .
That initializes CMake for this project and then builds it. The result, test.exe will be in /build/debug.
Now you can run or start debugging.
Here's a couple of nice, brief, CMake tutorials:
Rust:
In VS Code, open the parent folder where you want to create a new Rust project. In the terminal issue the command:
cargo new TestPkg
That creates a new directory TestPkg with a cargo.toml metadata file and /src folder with hello world Rust code in main.rs.
Now you can open the new folder from the File menu, open the integrated terminal in the project folder by right-clicking on any file and selecting open file in integrated terminal. Then run or start debugging. when you don't need to debug just issue the command:
cargo run TestPkg
in the terminal.

You create a library with the terminal command:
cargo new --lib TestLib
cargo builds the library starter code with test fixtures for unit tests. Once you have some library code and corresponding tests, you run tests with the terminal command:
cargo test

If you manually create an /examples folder as a sibling to the /src folder, you can put demonstration code that uses the library and displays results on the termianl. To do that use the command:
cargo run --example test1
where test1.rs is the demonstration code inside /examples.
Python:
In VS Code, open the parent folder where you want to create a new Python project. In the terminal issue the command:
mkdir TestDir to create a new directory
From the File menu open the new directory and add a new file <filename.py>.
Open the file and add some Python code in the editor.
Now you can run your Python code with terminal command: python <filename.py>.
You can also run or debug your Python code from the Run dropdown in the VS Code top menu, e.g., Run > Start Debugging which takes you to the first breakpoint and lets you single step through your code, or Run > Run Without Debugging. Any number of breakpoints can be set by clicking in the left border.
JavaScript:
In terminal navigate to directory containing an HTML file with JavaScript. Then:
  • Windows VS Code terminal: start <browser name> <file name>
  • Linux VS Code terminal: sudo <browser name> <file name>
Make additions and changes in the editor and observe that by refreshing the browser. You may often need to debug your JavaScript using developer tools provided by the browser.

6.0 Epilogue

The following pages provide sequences of small code examples in each of the languages cited here, e.g. C#, C++, Rust, Python, and JavaScript. Object model differences will often be pointed out in comments within code blocks.
  Next Prev Pages Sections About Keys Goto Mark