{"id":49,"date":"2022-11-28T10:07:20","date_gmt":"2022-11-28T10:07:20","guid":{"rendered":"http:\/\/www.devopsconsulting.in\/blog\/?p=49"},"modified":"2022-11-28T10:07:20","modified_gmt":"2022-11-28T10:07:20","slug":"how-to-create-first-in-angular","status":"publish","type":"post","link":"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/","title":{"rendered":"How to create first in angular"},"content":{"rendered":"\n<p>The first step to working with the CLI is to install it. For this, use the command below:<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\"><p>npm install -g @angular\/cli<\/p><\/blockquote>\n\n\n\n<p>Once the CLI is installed, from the command line we want to install our project in.<br>From there we will run ng new with the name of our project.<\/p>\n\n\n\n<p>ng new [project_name]<\/p>\n\n\n\n<p>And that is it! Our Angular application is ready to run. You can either start your application with npm start or ng serve.<br>I prefer to use npm start because it is more conventional and enables me to add in additional commands.<br>You can then navigate to http:\/\/localhost:4200 to see the application running<\/p>\n\n\n\n<p><strong>Output<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"756\" height=\"291\" src=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-7.png\" alt=\"\" class=\"wp-image-50\" srcset=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-7.png 756w, https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-7-300x115.png 300w\" sizes=\"auto, (max-width: 756px) 100vw, 756px\" \/><\/figure>\n\n\n\n<p><strong>Index.php<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"902\" height=\"469\" src=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-10.png\" alt=\"\" class=\"wp-image-53\" srcset=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-10.png 902w, https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-10-300x156.png 300w, https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-10-768x399.png 768w\" sizes=\"auto, (max-width: 902px) 100vw, 902px\" \/><\/figure>\n\n\n\n<script src=\"https:\/\/gist.github.com\/abhishek7079\/bb998df8210197d6ac2a44b87e5cbd0c.js\"><\/script>\n\n\n\n<p><strong>app.componet.html<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"721\" height=\"375\" src=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-8.png\" alt=\"\" class=\"wp-image-51\" srcset=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-8.png 721w, https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-8-300x156.png 300w\" sizes=\"auto, (max-width: 721px) 100vw, 721px\" \/><\/figure>\n\n\n\n<script src=\"https:\/\/gist.github.com\/abhishek7079\/b7bf5120d123d78431faf00b3f13719d.js\"><\/script>\n\n\n\n<p><strong>app.componet.ts<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"834\" height=\"382\" src=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-9.png\" alt=\"\" class=\"wp-image-52\" srcset=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-9.png 834w, https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-9-300x137.png 300w, https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-9-768x352.png 768w\" sizes=\"auto, (max-width: 834px) 100vw, 834px\" \/><\/figure>\n\n\n\n<script src=\"https:\/\/gist.github.com\/abhishek7079\/d27cd80bdb6eae40312904f1f7224812.js\"><\/script>\n\n\n\n<p><strong>app.module.ts<\/strong><\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"875\" height=\"494\" src=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-11.png\" alt=\"\" class=\"wp-image-54\" srcset=\"https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-11.png 875w, https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-11-300x169.png 300w, https:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-11-768x434.png 768w\" sizes=\"auto, (max-width: 875px) 100vw, 875px\" \/><\/figure>\n\n\n\n<script src=\"https:\/\/gist.github.com\/abhishek7079\/8f4e2060dbba4831d309ccb19770e3a1.js\"><\/script>\n","protected":false},"excerpt":{"rendered":"<p>The first step to working with the CLI is to install it. For this, use the command below: npm install -g @angular\/cli Once the CLI is installed,&#8230; <\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6],"tags":[],"class_list":["post-49","post","type-post","status-publish","format-standard","hentry","category-angular"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.4 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>How to create first in angular - DevOps Consulting<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to create first in angular - DevOps Consulting\" \/>\n<meta property=\"og:description\" content=\"The first step to working with the CLI is to install it. For this, use the command below: npm install -g @angular\/cli Once the CLI is installed,...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/\" \/>\n<meta property=\"og:site_name\" content=\"DevOps Consulting\" \/>\n<meta property=\"article:published_time\" content=\"2022-11-28T10:07:20+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-7.png\" \/>\n<meta name=\"author\" content=\"Abhishek Singh\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Abhishek Singh\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/how-to-create-first-in-angular\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/how-to-create-first-in-angular\\\/\"},\"author\":{\"name\":\"Abhishek Singh\",\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/#\\\/schema\\\/person\\\/fc397ba8be42f9fdd53450edfc73006f\"},\"headline\":\"How to create first in angular\",\"datePublished\":\"2022-11-28T10:07:20+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/how-to-create-first-in-angular\\\/\"},\"wordCount\":128,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/how-to-create-first-in-angular\\\/#primaryimage\"},\"thumbnailUrl\":\"http:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/image-7.png\",\"articleSection\":[\"Angular\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/how-to-create-first-in-angular\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/how-to-create-first-in-angular\\\/\",\"url\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/how-to-create-first-in-angular\\\/\",\"name\":\"How to create first in angular - DevOps Consulting\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/how-to-create-first-in-angular\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/how-to-create-first-in-angular\\\/#primaryimage\"},\"thumbnailUrl\":\"http:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/image-7.png\",\"datePublished\":\"2022-11-28T10:07:20+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/#\\\/schema\\\/person\\\/fc397ba8be42f9fdd53450edfc73006f\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/how-to-create-first-in-angular\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/how-to-create-first-in-angular\\\/#primaryimage\",\"url\":\"http:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/image-7.png\",\"contentUrl\":\"http:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/image-7.png\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/\",\"name\":\"DevOps Consulting\",\"description\":\"DevOps Consulting | SRE Consulting | DevSecOps Consulting | MLOps Consulting\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/#\\\/schema\\\/person\\\/fc397ba8be42f9fdd53450edfc73006f\",\"name\":\"Abhishek Singh\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/790feefe779852cdf344ca7318bf6c13832223c9b3c6bf4d217658412041026d?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/790feefe779852cdf344ca7318bf6c13832223c9b3c6bf4d217658412041026d?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/790feefe779852cdf344ca7318bf6c13832223c9b3c6bf4d217658412041026d?s=96&d=mm&r=g\",\"caption\":\"Abhishek Singh\"},\"description\":\"I\u2019m Abhishek, a DevOps, SRE, DevSecOps, and Cloud expert with a passion for sharing knowledge and real-world experiences. I\u2019ve had the opportunity to work with Cotocus and continue to contribute to multiple platforms where I share insights across different domains: \u2022 DevOps School \u2013 Tech blogs and tutorials \u2022 Holiday Landmark \u2013 Travel stories and guides \u2022 Stocks Mantra \u2013 Stock market strategies and tips \u2022 My Medic Plus \u2013 Health and fitness guidance \u2022 TrueReviewNow \u2013 Honest product reviews \u2022 Wizbrand \u2013 SEO and digital tools for businesses I\u2019m also exploring the fascinating world of Quantum Computing.\",\"url\":\"https:\\\/\\\/www.devopsconsulting.in\\\/blog\\\/author\\\/abhishek\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to create first in angular - DevOps Consulting","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/","og_locale":"en_US","og_type":"article","og_title":"How to create first in angular - DevOps Consulting","og_description":"The first step to working with the CLI is to install it. For this, use the command below: npm install -g @angular\/cli Once the CLI is installed,...","og_url":"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/","og_site_name":"DevOps Consulting","article_published_time":"2022-11-28T10:07:20+00:00","og_image":[{"url":"http:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-7.png","type":"","width":"","height":""}],"author":"Abhishek Singh","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Abhishek Singh","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/#article","isPartOf":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/"},"author":{"name":"Abhishek Singh","@id":"https:\/\/www.devopsconsulting.in\/blog\/#\/schema\/person\/fc397ba8be42f9fdd53450edfc73006f"},"headline":"How to create first in angular","datePublished":"2022-11-28T10:07:20+00:00","mainEntityOfPage":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/"},"wordCount":128,"commentCount":0,"image":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/#primaryimage"},"thumbnailUrl":"http:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-7.png","articleSection":["Angular"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/","url":"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/","name":"How to create first in angular - DevOps Consulting","isPartOf":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/#primaryimage"},"image":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/#primaryimage"},"thumbnailUrl":"http:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-7.png","datePublished":"2022-11-28T10:07:20+00:00","author":{"@id":"https:\/\/www.devopsconsulting.in\/blog\/#\/schema\/person\/fc397ba8be42f9fdd53450edfc73006f"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.devopsconsulting.in\/blog\/how-to-create-first-in-angular\/#primaryimage","url":"http:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-7.png","contentUrl":"http:\/\/www.devopsconsulting.in\/blog\/wp-content\/uploads\/2022\/11\/image-7.png"},{"@type":"WebSite","@id":"https:\/\/www.devopsconsulting.in\/blog\/#website","url":"https:\/\/www.devopsconsulting.in\/blog\/","name":"DevOps Consulting","description":"DevOps Consulting | SRE Consulting | DevSecOps Consulting | MLOps Consulting","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.devopsconsulting.in\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.devopsconsulting.in\/blog\/#\/schema\/person\/fc397ba8be42f9fdd53450edfc73006f","name":"Abhishek Singh","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/790feefe779852cdf344ca7318bf6c13832223c9b3c6bf4d217658412041026d?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/790feefe779852cdf344ca7318bf6c13832223c9b3c6bf4d217658412041026d?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/790feefe779852cdf344ca7318bf6c13832223c9b3c6bf4d217658412041026d?s=96&d=mm&r=g","caption":"Abhishek Singh"},"description":"I\u2019m Abhishek, a DevOps, SRE, DevSecOps, and Cloud expert with a passion for sharing knowledge and real-world experiences. I\u2019ve had the opportunity to work with Cotocus and continue to contribute to multiple platforms where I share insights across different domains: \u2022 DevOps School \u2013 Tech blogs and tutorials \u2022 Holiday Landmark \u2013 Travel stories and guides \u2022 Stocks Mantra \u2013 Stock market strategies and tips \u2022 My Medic Plus \u2013 Health and fitness guidance \u2022 TrueReviewNow \u2013 Honest product reviews \u2022 Wizbrand \u2013 SEO and digital tools for businesses I\u2019m also exploring the fascinating world of Quantum Computing.","url":"https:\/\/www.devopsconsulting.in\/blog\/author\/abhishek\/"}]}},"_links":{"self":[{"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/posts\/49","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/comments?post=49"}],"version-history":[{"count":1,"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/posts\/49\/revisions"}],"predecessor-version":[{"id":55,"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/posts\/49\/revisions\/55"}],"wp:attachment":[{"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/media?parent=49"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/categories?post=49"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.devopsconsulting.in\/blog\/wp-json\/wp\/v2\/tags?post=49"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}