Getting started with Angular. Part 1 of 2: tools
Angular is a modern, complex, framework and its toolchain is based on Node.js. Here’s what you’ll need to get started.
1. A Mac with High Sierra or later
If you already know modern web development — JavaScript web development in particular — is best done on a Mac, go ahead to the next section.
If you don’t, chances are you don’t agree with me and you think you should let me know that you are perfectly fine with Windows or that I really should try Linux.
Well, I tried those. As a matter of fact, I made a living with web development on Linux for thirteen years.
And I’m still going to write this entire series of articles from a Mac user perspective, because it just works and we don’t have time to spare — remember?
2. NVM, Node Version Manager
Install it as explained on GitHub.
NVM is great for having more than one Node version installed at any time, and quickly switching from one to another while keeping different sets of installed modules.
But this is not why I use it. I use NVM because:
- It makes installing and upgrading Node as easy as it can get:
nvm install node - I can copy / paste commands I find online without having to prepend
sudo:npm install -g @angular/cli
3. Node.js
Now that you have NVM, go ahead and install Node.js from a terminal:
nvm install node4. Angular CLI
And since we are installing things from the terminal, let’s also install Angular CLI:
npm install -g @angular/cliNPM and Angular CLI are two of the most important tools in developing with Angular and we’ll come to know them step by step in the coming articles.
5. Visual Studio Code
Install it from the official website.
The third most important tool being the editor.
Again, you may be in love with WebStorm, Sublime Text, Vim, Emacs, Brackets, whatever. Feel free to skip this last part, I’ll keep writing pretending everyone is using Visual Studio Code where Angular and TypeScript just work.
Install essential extensions
Once you got Visual Studio Code up and running, it’s time to install one essential extension pack:
- Hit
shift + cmd + Xto open the “Extensions” panel. - Search for “Angular Essentials” by John Papa and install it.
Angular Essentials includes everything you’ll need to start with Angular.
Feel free to look into it and explore, but we are going to use some of these extensions in future articles so it’s ok if you just install the pack and call it a day.
Wrapping it up
And that’s it! You installed NVM, Node.js, Angular CLI, Visual Studio Code and the Angular Essentials extension pack: you have everything it takes to start writing web applications with Angular.
In part 2, you will create your very first Angular application.
