Getting Started with Node.js, Angular, and Visual Studio Code


This step-by-step guide on getting started with Node.js and Angular comes to us from Premier Developer consultant Crystal Tenn.


Here is a simple step by step guide to getting your Angular application setup with Visual Studio Code and Node. This guide will simply help you know what to install, the commands to run in PowerShell, and some basics about where to start building your app using Visual Studio Code.

  1. Install Node JS with default settings for everything
    https://nodejs.org/en/download/
  2. Download Visual Studio Code:
    https://code.visualstudio.com/download
  3. Open PowerShell in admin mode. Install Angular CLI:
    npm install -g @angular/cli
  4. Navigate to the folder where you want to make your angular app. I went to my C:/ directory in my PowerShell to run the following command. I am calling mine "my-new-angular-app" but you can name it anything you like.
    ng new my-new-angular-app


    image

  5. cd into your new app directory that you just created, in this case
    cd my-new-angular-app


    image

  6. Build app and start server
    ng serve


    image

  7. Navigate to http://localhost:4200

    image

  8. Open Visual Studio Code
  9. Click on File, Open Folder

    image

  10. Open the folder that you created. In this case it would be my-new-angular-app. Hit Select Folder, as seen in screenshot below.

    clip_image012

  11. package.json has all of your angular dependencies and other packages.

    image

  12. You can add all your components in the app folder.

    image

  13. In PowerShell, to stop your Server:
    1. Hit Ctrl +C
    2. Then type "Y" and hit enter to stop it.

      image


  14. See the following link for docs on how to use Angular: https://angular.io/guide/styleguide
Comments (0)

Skip to main content