How to start programming any language easy and fast

So you want to try a new programming language and don’t know how to start, what to install nor which language to choose. Worry no more. This tutorial is designed to enable you a fast and easy start for any new project or computer idea you might have.

Note: this is the basic tutorial for every other programming project in this website. Therefore, if you’d like to repeat my steps in another tutorial, this is the way to begin.

Install Docker

Install Docker on Linux

  1. open the linux terminal (try Ctrl + Alt + T or look for it in the search bar)
  2. type the following commands:

    ❯ sudo apt-get update
    ❯ sudo apt-get install docker-ce docker-ce-cli containerd.io
    
  3. for detailed instructions, refer to the official docker engine installation guide.

Install Docker on MacOS

  1. download Docker Desktop (Stable) for MacOS clicking here.
  2. once it is downloaded, look for Docker.dmg file on Finder and click on it.
  3. for detailed instructions, refer to the official documentation.

Install Docker on Windows

  1. download Docker Desktop (Stable) for Windows clicking here.
  2. once it is downloaded, run the installer Docker Desktop Installer.exe file. You may need to restart your PC.
  3. for detailed instructions, refer to the official documentation.

Install Visual Studio Code

Install Visual Studio Code on Linux

  1. open the linux terminal (try Ctrl + Alt + T or look for it in the search bar)
  2. install using snap

    ❯ sudo snap install --classic code # or code-insiders
    
  3. if you saw errors, make sure you have snapd installed
    • some Linux distributions don’t come with it pre-installed. If that’s your case, click here to go to the installation page and look for your distribution.
  4. if you find any problems, look the official Linux install guide.

Install Visual Studio Code on MacOS

  1. download Visual Studio Code for macOS clicking here.
  2. open Finder and type Visual Studio Code on the search bar.
  3. drag Visual Studio Code.app to the Applications folder, making it available in the macOS Launchpad.
  4. add vscode to your Dock by right-clicking on the icon to bring up the context menu and choosing Options, Keep in Dock.
  5. if you find any problems, look the official MacOS install guide.

Install Visual Studio Code on Windows

  1. download Visual Studio Code for Windows clicking here.
  2. once it is downloaded, run the installer (click on the .exe file).
  3. vscode is by default installed at C:\users\{username}\AppData\Local\Programs\Microsoft vscode
  4. if you find any problems, look the official Windows install guide.

Install Remote Development extension pack

With Docker and Visual Studio Code installed, we just need the Remote Development vscode extension. Click on the link below to go to the download page.

link to remote development extension

Start a new python project

  1. click on the new symbol in the lower left corner. A dropdown list of options will appear.
  2. select Remote-Containers: Try a Sample… from the command list. A list of the available languages will be shown.
  3. choose Python. The screen will blink and start downloading the images to start your project.
  4. this step may take from 5 to 15 minutes. Wait for it to finish.
  5. after the download is over, on vscode, an workspace will be created with the project files.
  6. if you have any doubts, check the video below to see each step exactly.

video: title: "create vscode python project": ./videos/python.mov

Explaining the vscode-remote-try-python files

Below you’ll find some explanations about all the project files. If you’re just beginning or new to python, focus on the .py file and don’t worry much about the others. Any important files ones will be highlighted or emphasized.

vscode Remote Containers extension specific folder. It uses devcontainer.json and an optional Dockerfile or docker-compose.yml to create the development containers. After the docker image is assembled by the Dockerfile, a container is created and started using the settings in devcontainer.json. It can also modify some configurations of the Dockerfile, as for this project, the Python version is redefined to 3.7 with the VARIANT arg. This file also contains settings for the Visual Studio Code environment. This file is referenced at `devcontainer.json` to assemble a docker image. Then, a container is created and started using some of the settings in `devcontainer.json`. vscode settings folder. It is used for project specific configurations. This file has running and debugging configuration information. It is very useful for automation and storing some environment variables for development purposes. A folder for all the static files: files that never change and can be send as they are. In web projects, they usually have images, icons, `HTML`, `CSS` and `javascript` files. A simple `.html` file with the landing page that will be sent by the server created by `app.py`. A git related file. It sets some attributes to the files being committed. In our case, it normalizes line endings for Windows OS specific files (.cmd, .bat). A git related file. It is a list of all files and folder that the git repo should ignore. The python file. It starts a flask server that sends the `index.html` file. An open source license file. It specifies how you, me and other developers can use this project. In our case, we have a MIT License. This is a very common file among programming projects. It is a markdown file with instructions on how to start the project and with some ideas and things to try. This is a very common file among python projects. It is a text file that disposes all the dependencies that need to be installed with `pip` before the project can run.

How to run your vscode-remote-try-python project

  1. Open the vscode terminal window. Notice it is already connected to the docker container.
  2. In the terminal, type the command below to run the app.
    python -m flask run --port 9000 --no-debugger --no-reload
    
  3. Open your browser (Safari, Edge, Firefox, Chrome, Opera, …) and go to http://localhost:9000 to see the running app.

Start a new javascript project

  1. Click on the new symbol in the lower left corner. A dropdown list of options will appear.
  2. Select Remote-Containers: Try a Sample… from the command list. A list of the available languages will be shown.
  3. Choose Node. The screen will blink and start downloading the images to start your project.
  4. This step may take from 5 to 15 minutes. Wait for it to finish.
  5. After the download is over, on vscode, an workspace will be created with the project files.
  6. If you have any doubts, check the video below to see each step exactly.

video: title: "create vscode node project": ./videos/node.mov

Explaining the vscode-remote-try-node files

Below you’ll find some explanations about all the project files. If you’re just beginning or new to javascript, focus on the .js file and don’t worry much about the others. Any important files ones will be highlighted or emphasized.

vscode Remote Containers extension specific folder. It uses devcontainer.json and an optional Dockerfile or docker-compose.yml to create the development containers. After the docker image is assembled by the Dockerfile, a container is created and started using the settings in devcontainer.json. It can also modify some configurations of the Dockerfile. This file also contains settings for the Visual Studio Code environment. This file is referenced at devcontainer.json to assemble a docker image. Then a container is created and started using some of the settings in devcontainer.json. vscode settings folder. Used for project specific configurations. This file has running and debugging configuration information. It is very useful for automation and storing some environment variables for development purposes. A folder for all the installed project dependencies. All dependencies are listed on the package.json. The eslint settings file. It configures the javascript linter eslint for the project. A linter is responsible for finding and fixing some non technical issues and enforce good practices in the code. It does not format the code however! This is the job of tools like Prettier. A git related file. It sets some attributes to the files being committed. In our case, it normalizes line endings for Windows OS specific files (.cmd, .bat). A git related file. It is a list of all files and folder that the git repo should ignore. An open source license file. It specifies how you, me and other developers can use this project. In our case, we have a MIT License. This is very common file among javascript projects. It contains several settings on how to start running the project and the dependencies that need to be installed. This is a very common file among programming projects. It is a markdown file with instructions on how to start the project and with some ideas and things to try. The javascript file. It starts an express server that sends a 'Hello World' message and prints on the console a link to it. A yarn related file. Yarn is one of the available javascript package managers and this file tells yarn how to find all the necessary dependency packages easier and faster.

How to run your vscode-remote-try-node project

  1. Press F5 to launch the app in the container. The file launch.json has configured vscode how to start it. It will be started in debugging mode.
  2. Open your browser (Safari, Edge, Firefox, Chrome, Opera, …) and go to http://localhost:9000 to see the running app.

Start a new C# .NET Core project

  1. Click on the new symbol in the lower left corner. A dropdown list of options will appear.
  2. Select Remote-Containers: Try a Sample… from the command list. A list of the available languages will be shown.
  3. Choose .NET Core. The screen will blink and start downloading the images to start your project.
  4. This step may take from 5 to 15 minutes. Wait for it to finish.
  5. After the download is over, on vscode, an workspace will be created with the project files.
  6. If you have any doubts, check the video below to see each step exactly.

video: title: "create vscode dotnetcore project": ./videos/dotnetcore.mov

Explaining the vscode-remote-try-dotnetcore files

Below you’ll find some explanations about all the project files. If you’re just beginning or new to C#, focus on the .cs file and don’t worry much about the others. Any important files will be highlighted or emphasized.

vscode Remote Containers extension specific folder. It uses devcontainer.json and an optional Dockerfile or docker-compose.yml to create the development containers. After the docker image is assembled by the Dockerfile, a container is created and started using the settings in devcontainer.json. It can also modify some configurations of the Dockerfile. This file also contains settings for the Visual Studio Code environment. This file is referenced at devcontainer.json to assemble a docker image. Then a container is created and started using some of the settings in devcontainer.json. vscode settings folder. Used for project specific configurations. This file has running and debugging configuration information. It is very useful for automation and storing some environment variables for development purposes. This file define some scripts that can be used by vscode in launch.json for instance. In our case, the tasks build, publish and watch are defined in this file. The build task is then referenced in launch.json. This folder can be ignored. The bin folder holds binary files: the executable, compiled code for the application. This folder can be ignored. This folder holds intermediate files, which will be combined to produce the final executable. The compiler generates one of these files for each source file, and they are placed into the obj folder. A git related file. It is a list of all files and folder that the git repo should ignore. This file overwrites the values defined at appsettings.json for the Development build. This file overwrites the values defined at appsettings.json and appsettings.Development.json for the Https channel in Development build. This file defines variables and configurations to be used by the application. It can be split into other versions for specific groups of variables and environments, such as Development, HttpsDevelopment, Production, etc. This file is mandatory for C# projects. It is a MSBuild project file specific for C# projects. It can specify dependencies and a few extra configurations for the project. In our case, it specifies the .NET Core version and the secret storage id. An open source license file. It specifies how you, me and other developers can use this project. In our case, we have a MIT License. The C# file. It starts an ASP.NET Core server that sends a 'Hello World' message. This is a very common file among programming projects. It is a markdown file with instructions on how to start the project and with some ideas and things to try.

How to run your vscode-remote-try-dotnetcore project

  1. Press F5 to launch the app in the container. The file launch.json has configured vscode how to start it. It will be started in debugging mode.
  2. Open your browser (Safari, Edge, Firefox, Chrome, Opera, …) and go to http://localhost:5000 to see the running app.

Conclusions

In this tutorial, we learned how to start a new project from a variety of languages easily. For that, we installed the Docker container platform, the Visual Studio Code Editor and the Remote Development vscode extension. These tools are useful if you are starting a new project or want to start learning a new programming language. A few remarks and observations are listed below about this approach.

  1. Simplicity:
    • simple installation previous to coding.
    • we can try another language in vscode just by repeating the same steps.
    • we didn’t face any of the “headaches” that beginners suffer when trying a new language.
  2. Security:
    • Docker creates a safety layer. Therefore, you can play and try anything you want without worrying about damaging anything in your computer.
  3. Containerization:
    • Docker: It will always work in your machine!
    • No virtual environments. The Docker container works as one.
    • We don’t need to download vscode extensions for each language. vscode server installs all the necessary extensions automatically based on the language you choose.
  4. Disadvantages:
    • Startup: the first time you start your application will be slow, as vscode has to download and build the Docker images. P.S.: I know I wrote fast in the title, but I am considering the amount of time the average person would have troubleshooting everything that could go wrong with installing each language, especially beginners.
    • Memory: Docker containers add some overhead to MacOS and Windows applications, but usually you won’t notice that. Look at Docker Desktop for more info about your containers.
    • Absolute Beginners: If you are just starting to learn how to program, some of the steps could come as difficult, especially the Docker part. As I said before, try not to worry too much about it: you’ll see that a lot of things in programming mix different technologies and I believe it’s important to get used to it from the start.

Happy Coding! 🧑🏻‍💻

Further Reading

Microsoft has all the process of Setting the Container Development in vscode and Developing inside a Container well documented. It’s definitely worth checking it out.