Hi all! I’ve been absent in this blog for a while. So I guess this new entry is a good way to back to the road.
First of all, this is my first entry in English. I’m trying to practice, so if you find errors please let me know.
Brief story and why?
At the University, when I started programming, I used Linux environments to get work in all my developer environment. Then, since I started to work as a developer, always I’ve been using macOS, with all its virtues and defects.
But, in a previous project in my work, they decided to give me a PC to work with this stack:
- NodeJS in the backend
- Angular in the frontend
So, my first thought was back to the origins and install Ubuntu in that PC. Problems? Yes, drivers: graphic card and trackpad. I said: Ok, no problem. I will work on this. But, was my fault. I couldn’t work in a weird resolution and with a trackpad that was deciding for me where to place.
So, the solution was clear: that PC will work fine only with Windows
WSL
After doing research about the best way to have commands that I already use in macOS and Linux, I read that there is a Linux embedded in Windows, called Windows Subsystem for Linux. Basically, you can have a Linux bash without the limitations of virtualization, and the problems I had with drivers.
I´ve worked with CentOS and Ubuntu, but I decided to use the last one. So, let´s start
- Enable WSL for Windows 10. You need to open PowerShell as admin and run
dism.exe /online /enable-feature /featurename:Microsoft-Windows-Subsystem-Linux /all /norestart
2. Go to Microsoft Store and choose your favourite distro. As I said, I will use Ubuntu.
Click on Get and Install it.
3. After that, start Ubuntu. It will take a time to finish the installation, and the first time will ask you for a UNIX user and password.
And now you have Linux in your Windows PC!!!
GIT, NODE, Angular
After you have installed, you would like to test a local environment.
First of all, you need to setup your local git. So, run:
git config --global user.email "you@example.com"
git config --global user.name "Your Name"
For this example, I will install Node and create a sample project in Angular.
For Node, I usually use NVM. So:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash
If you are using the default bash, it will add the env vars directly. Otherwise, add
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion" # This loads nvm bash_completion
to your rc bash file. Close and re open your terminal.
I will use the latest LTS version
nvm install 14
And I will install Angular for a test project.
npm install -g @angular/cli
And create a new project
ng new test-app
Angular creates a project with all the things you would need to start. Go to the created folder and start the server
cd test-app
npm start
Go to your browser at go to `http://localhost:4200/` and you will see your app
VSCODE
Everything is fine, but in the real life you need to modify your code. So, VSCode will help us using the code in WSL and modifying in Windows.
First of all, download and install the Windows version of VSCode
Open a new terminal of WSL and go to the folder you would like to open in VSCODE, and type
code .
That will open Windows’ VSCode with the content of your WSL folder.
You will see also a recommended install about WSL, please install it. Close VSCODE and open it again from the terminal. It will finish the installation and you will see that is connected and also is taking WSL git configuration.
You will see that hot reload works.
Fabricio Flores 