Angular Tutorials #1: Setup Development Environment; Create Your First Project in Visual Studio Code

In this video I am talking about how to setup development environment for Angular and create your first project.

First we will download Visual Studio Code - one of the most widely used development environments. The software is for free. We will install it. We will also install Angular Cli (Angular Command Line Interface) and then create our first project, which will contain a module with 1 component, consisting of html, scss and a typescript file. We will start the project and edit it together.

If you like my videos, please don't forget to subscribe!

Chapters:

00:00 - Intro
00:10 - Explanation - what we are going to talk about
00:20 - How to download the Visual Studio Code for our coding
00:40 - Installing @angular/cli while downloading Visual Studio Code
00:48 - Starting the Terminal (Mac) / Command Line (Windows)
01:00 - Mac: sudo npm install @angular/cli
01:03 - Windows: npm install @angular/cli
01:24 - Checking download folder
01:40 - Start Visual Studio Code for the first time
01:58 - Visual Studio Code: Installing Angular Extensions
02:41 - Visual Studio Code Extensions: Installing Angular Language Service
02:47 - Visual Studio Code Extensions: Installing Angular Snippets
03:11 - Starting Terminal
03:20 - Creating First Angular Project named: example
03:26 - Angular Routing
03:36 - Angular Styles
04:04 - Checking the newly created Angular project
04:18 - Opening the new Angular Project
04:42 - Explanation: Angular source code
05:31 - Starting our angular project for the first time
05:49 - Compilation of the Angular source code
06:01 - Checking the running Angular Project in the Chrome Browser (Incognite mode)
06:20 - Deleting the Html file contents
06:29 - Creating Hello World in the application
07:00 - How to define SCSS Styles for the html file
08:14 - Preview of the app in the browser
08:36 - Finish

More in the video!

#angular #angulartutorial #visualstudiocode

- by Vladimir Heinz