Learn Angular CLI Day 13

Lecture 13 : Learn Angular CLI

Installing Angular CLI :


  • Major versions of Angular CLI follow the supported major version of Angular, but minor versions can be released separately.

  • Install the CLI using the npm package manager: 

             npm install -g @angular/cli

  • To create, build, and serve a new, basic Angular project on a development server, go to the parent directory of your new workspace use the following commands:

             ng new my-first-project

             cd my-first-project   

                    ng serve

Agular CLI :

  • Angular CLI is the official tool for initializing and working with Angular projects.

  • It saves you from the hassle of complex configurations and build tools like TypeScript, Webpack.

Webpack : Webpack is a popular module bundler, a tool for bundling application source code in convenient chunks and for loading that code from a server into a browser.

You determine what Webpack does and how it does it with a JavaScript configuration file...

                    webpack.config.js

  • Angular CLI makes it easy to start with any Angular project. Angular CLI comes with commands that help us create and start on our project very fast.

  • Let us now go through the commands available to create a project, a component and services, change the port, etc.

Folder Structure :

Configuration :

ng commands :

ng new :

  • The Angular CLI makes it easy to create an application that already works, right out of the box.

  • Syntax

          ng new <name> [options]

                 ng n <name> [options] 

  • ng new command creates a workspace of given name with a default Angular Application.

  • It provides interactive prompts to set optional configurations.

  • All prompts have default values to choose.

  • Options are optional parameters.

ng serve :

  • Easily test your app locally while developing. Builds and serves your app, rebuilding on file changes.

  • Syntax

                ng serve <project> [options] 

                ng s <project> [options]

  • ng serve command builds and serve the application.

  • It rebuilds the application if changes occur.

  • Here project is the name of the application as defined in angular.json.

  • Options are optional parameters.

Comments

Post a Comment

Popular posts from this blog

Basic Concept In C Sharp Day 16

Image
Lecture 16 : Basic Concept In C Sharp C Sharp : C#  (pronounced  see sharp , like the musical note C♯, but written with the number sign) is a general-purpose, multi-paradigm programming language encompassing static typing, strong typing, lexically scoped, imperative, declarative, functional, generic, object-oriented (class-based), and component-oriented programming disciplines. C# was developed around 2000 by Microsoft as part of its .NET initiative and later approved as an international standard by Ecma (ECMA-334) in 2002 and ISO (ISO/IEC 23270) in 2003. It was designed by Anders Hejlsberg, and its development team is currently led by Mads Torgersen, being one of the programming languages designed for the Common Language Infrastructure (CLI). The most recent version is 9.0, which was released in 2020 in .NET 5.0 and included in Visual Studio 2019 version 16.8. C-sharp musical note : " C sharp " was inspired by the musical notation whereby a sharp symb
Read more

VS Code In JavaScript Day 6

Image
Lecture 6 : VS Code In JavaScript What is VS Code : Visual Studio Code is a lightweight but powerful source code editor which runs on your desktop and is available for Windows, macOS and Linux. VS Code was announced on April 29,2015 by Microsoft at the 2015 Build conference. Why did we build VS Code : Visual Studio Code combines the simplicity of a source code editor with power developer tooling, like IntelliSense code completion and debugging. First and foremost, it is an editor that gets out of your way. The delightfully frictionless edit- build- bebug cycle means less time fiddling with your environment, and more time executing on your ideas. IntelliSense : IntelliSense is a general term for a variety of code editing features including : code completion, parameter information, quick information, and member list. IntelliSense features are sometimes called by other name such as "code completion", "content assist", and "code hinting".
Read more

ASP.NET MVC Interview Questions Part - II Day 26

Image
Lecture 26 : ASP.NET MVC Interview Questions Part - II 1) How is the URL structure of MVC core ? URL structure of MVC core is controller name with action name. Example : localhost:1234/{controller}/{action name}. The "localhost:1234" is considered as a controller name. 2) If the view name is different than action name how to invoke it  ? If the view name is different from action name we have to write and the view in double quotes. 3) How do we define navigation using anchor tag ? The HTML <a> element (also called the anchor element), containing its href attribute, creates a hyperlink to other web pages, locations within the same page, location to a specified title of another web page, or to an email web page.  The <a> tag defines a hyperlink, which is used to link from one page to another. The navigations can be defined using anchor tag as <a href="/Controller name/Action name"></a>. 4)  How to pass mode
Read more