Generating a New Application

Now that we have installed and configured Angular CLI, we can start generating our new application.

Running the ng new command will do the following:

• Create a folder called angular-social

• Create a new basic application inside this folder

• Add a routing module (because the --routing flag is passed in)

• Run npm install inside this folder to install the dependencies

• Run git init to initialize a new Git repository

Creating a New Application

To create a new application, perform the following steps:

1. Open your terminal and navigate to the directory where you want to work on your application:

   cd dev

2. Once inside your workspace directory, invoke the ng command as follows:

   ng new angular-social --routing

3. The output of this command will be similar to the following:

   

Let's have a look at the folders that are created after running this command:

• src: This folder contains the source files for our application

• src/app/: This folder contains the application files

• src/assets/: This folder contains the static assets we can use in our application (such as images)

• src/environments/: This folder contains the definition of the default environments of our application

• e2e: This folder contains the end-to-end tests for our application

Serving the Application

To serve the application, perform the following steps:

1. When the installation is finished, we can open our terminal and enter the working directory:

   cd angular-social

2. Run the ng serve command to start the development server:

   ng serve

   The output of the command will be as follows:

   

Viewing Your Application

To view your application, perform the following steps:

1. Open your browser and navigate to http://localhost:4200/.

2. You should be greeted with a default page that says Welcome to app!:

   

In this section, we have created a basic application using Angular CLI and viewed the same in the browser.