{"id":5928,"date":"2021-02-06T18:09:21","date_gmt":"2021-02-06T18:39:21","guid":{"rendered":"https:\/\/ultering.com\/it4us\/?p=5928"},"modified":"2021-02-06T22:31:20","modified_gmt":"2021-02-06T23:01:20","slug":"angular-step-by-step-environment-setup","status":"publish","type":"post","link":"https:\/\/ultering.com\/it4us\/?p=5928","title":{"rendered":"Angular: Step-by-Step: Environment Setup"},"content":{"rendered":"<div class=\"container\">\n<div class=\"row\">\n<div class=\"col-md-4\"><\/div>\n<div class=\"col-md-4\">\n<h2><noscript><img decoding=\"async\" class=\"alignnone size-full wp-image-5947\" src=\"https:\/\/ultering.com\/it4us\/wp-content\/uploads\/2021\/02\/angular_setup_first_step_350-1.jpg\" alt width=\"350\" height=\"242\" srcset=\"https:\/\/ultering.com\/it4us\/wp-content\/uploads\/2021\/02\/angular_setup_first_step_350-1.jpg 350w, https:\/\/ultering.com\/it4us\/wp-content\/uploads\/2021\/02\/angular_setup_first_step_350-1-300x207.jpg 300w\" sizes=\"(max-width: 350px) 100vw, 350px\"><\/noscript><img decoding=\"async\" class=\"alignnone size-full wp-image-5947 lazyload\" src=\"data:image\/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20350%20242%22%3E%3C%2Fsvg%3E\" alt width=\"350\" height=\"242\" srcset=\"data:image\/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20350%20242%22%3E%3C%2Fsvg%3E 350w\" sizes=\"(max-width: 350px) 100vw, 350px\" data-srcset=\"https:\/\/ultering.com\/it4us\/wp-content\/uploads\/2021\/02\/angular_setup_first_step_350-1.jpg 350w, https:\/\/ultering.com\/it4us\/wp-content\/uploads\/2021\/02\/angular_setup_first_step_350-1-300x207.jpg 300w\" data-src=\"https:\/\/ultering.com\/it4us\/wp-content\/uploads\/2021\/02\/angular_setup_first_step_350-1.jpg\"><\/h2>\n<\/div>\n<\/div>\n<\/div>\n<h3><\/h3>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_73 counter-hierarchy ez-toc-counter ez-toc-white ez-toc-container-direction\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Table of Contents<\/p>\n<label for=\"ez-toc-cssicon-toggle-item-6a04eae789b6c\" class=\"ez-toc-cssicon-toggle-label\"><span class><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\" \/><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\" \/><\/svg><\/span><\/span><\/label><input type=\"checkbox\" id=\"ez-toc-cssicon-toggle-item-6a04eae789b6c\" checked aria-label=\"Toggle\"><nav><ul class=\"ez-toc-list ez-toc-list-level-1 \"><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/ultering.com\/it4us\/?p=5928\/#1_Download_and_install_Nodejs\" title=\"1. Download and install Node.js.\">1. Download and install Node.js.<\/a><ul class=\"ez-toc-list-level-3\"><li class=\"ez-toc-heading-level-3\"><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/ultering.com\/it4us\/?p=5928\/#Windows\" title=\"Windows\">Windows<\/a><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-3\"><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/ultering.com\/it4us\/?p=5928\/#Linux\" title=\"Linux\">Linux<\/a><\/li><\/ul><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/ultering.com\/it4us\/?p=5928\/#2_CLI_INSTALL\" title=\"2. CLI INSTALL\">2. CLI INSTALL<\/a><ul class=\"ez-toc-list-level-3\"><li class=\"ez-toc-heading-level-3\"><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/ultering.com\/it4us\/?p=5928\/#Global_Installation\" title=\"Global Installation\">Global Installation<\/a><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-3\"><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/ultering.com\/it4us\/?p=5928\/#Local_Intallation\" title=\"Local Intallation\">Local Intallation<\/a><\/li><\/ul><\/li><li class=\"ez-toc-page-1 ez-toc-heading-level-2\"><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/ultering.com\/it4us\/?p=5928\/#3_Creating_The_Project\" title=\"3. Creating The Project\">3. Creating The Project<\/a><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"1_Download_and_install_Nodejs\"><\/span>1. Download and install Node.js.<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h3><span class=\"ez-toc-section\" id=\"Windows\"><\/span>Windows<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<div>On Windows, It comes with installer.<\/div>\n<div>\n<p class=\" b_topTitle\"><a href=\"https:\/\/nodejs.org\/en\/download\/\">Download | Node.js<\/a><\/p>\n<p>Test the installations.<br>\nOn console, type:<br>\nnode -v<\/p>\n<div class=\"b_caption\">\n<h3><span class=\"ez-toc-section\" id=\"Linux\"><\/span>Linux<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>*** NOTES:<br>\n1. node 8x is not available for wheezy.<br>\nSo, it was made an attempt, then installed the version 6x, which is the compatible version.<br>\nIf using a later version, use version 8x.<br>\n08\/25\/17 21:05:30<\/p>\n<p>cd \/home<br>\n&#8211; set apt repository:<\/p>\n<p>curl -sL https:\/\/deb.nodesource.com\/setup_8.x | sudo -E bash &#8211;<br>\n@FAIL: ## Your distribution, identified as &#8220;wheezy&#8221;, is not currently supported, please contact NodeSource at https:\/\/github.com\/nodesource\/distributions\/issues if you think this is incorrect or would like your distribution to be considered for support<\/p>\n<p>&#8211; for wheezy:<br>\ncurl -sL https:\/\/deb.nodesource.com\/setup_6.x | sudo -E bash &#8211;<br>\n&#8211; output:<br>\n## Run `apt-get install nodejs` (as root) to install Node.js v6.x and npm<\/p>\n<p>&#8211; install node:<br>\n!sudo apt-get install -y nodejs<br>\napt-get install nodejs<\/p>\n<p>Test the installations.<br>\nOn console, type:<br>\nnode -v<\/p>\n<p>@FROM:<br>\n<a href=\"https:\/\/nodejs.org\/en\/download\/package-manager\/#debian-and-ubuntu-based-linux-distributions\">nodejs.org\/en\/download\/package-manager\/#debian-and-ubuntu-based-linux-distributions<\/a><br>\n<a href=\"https:\/\/nodesource.com\/blog\/installing-node-js-tutorial-debian-linux\/\">nodesource.com\/blog\/installing-node-js-tutorial-debian-linux\/<\/a><\/p>\n<p><span style=\"color: #999999;\"><em><br>\n@For internal site control.:<br>\nn;node-install&lt;memo&lt;ramnode;.<\/em><\/span><\/p>\n<\/div>\n<\/div>\n<h3><\/h3>\n<h2 class=\"b_attribution b_nav\"><span class=\"ez-toc-section\" id=\"2_CLI_INSTALL\"><\/span>2. CLI INSTALL<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p><a href=\"https:\/\/cli.angular.io\/\">CLI<\/a> stands for Common Line Interface and brings important commands to be used on console.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Global_Installation\"><\/span>Global Installation<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<div>\n<p>&#8211; Install CLI globally, but if already installed just use &#8220;npm install&#8221;:<br>\nnpm install -g @angular\/cli<\/p>\n<p>The last one:<br>\nnpm install -g @angular\/cli@latest<\/p>\n<p><strong>To install a specific version<\/strong>:<br>\nnpm install -g @angular\/cli@10.0.8<\/p>\n<h3><span class=\"ez-toc-section\" id=\"Local_Intallation\"><\/span>Local Intallation<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Install angular locally&nbsp; if it is desired a different version of the global one.<br>\nIn this case, a local node_modules folder is created at current dir.<br>\nThis folder shall not be used for the project. Let it under the root directory.<br>\nWhen creating a new project, a new node_modules is created inside the project&#8217;s dir, usually a subdirectory of the local CLI installation.<\/p>\n<p>npm install @angular\/cli<\/p>\n<p><strong>If @angular\/cli already installed globally, then go straight to the next cmd.<\/strong><\/p>\n<p><em>@DEPRECATED: npm install -g angular-cli<\/em><br>\n<em>(cause &#8220;fallbackLoader option has been deprecated&#8221; message).<br>\n@Check <a href=\"https:\/\/ultering.com\/itstuff\/?p=18977\">angularx***faq<\/a><\/em><\/p>\n<p><span style=\"color: #999999;\"><em>@For internal site control.:<\/em><\/span><br>\n<span style=\"color: #999999;\"><em>y;project setup&lt;memo&lt;angularx;.<\/em><\/span><br>\n<span style=\"color: #999999;\"><em>n;install&lt;memo&lt;revision05a10;.<\/em><\/span><\/p>\n<h2><span class=\"ez-toc-section\" id=\"3_Creating_The_Project\"><\/span>3. Creating The Project<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>&#8211; generate a new project and skeleton application:<br>\nng new MY_PROJECT<\/p>\n<p>&#8211; project using SASS, you need to run the following command:<br>\nng new MY_PROJECT &#8211;style=scss<\/p>\n<p>&#8211; then launch the server:<br>\ncd MY_PROJECT<br>\nng serve<\/p>\n<p>&#8211; starts serve and opens on browser:<br>\nng serve -o<\/p>\n<p>&#8211; or to start&nbsp; specific port (not default = 4200):<br>\nng serve &#8211;port 9001<\/p>\n<p>&#8211; or to start with host and port definition:<br>\n<span class=\"fontstyle0\">ng serve &#8211;host 0.0.0.0 \u2013port 4205<\/span><\/p>\n<p>&#8211; point to:<br>\nhttp:\/\/localhost:4200\/<\/p>\n<p>&#8211; returns:<br>\nOur app works!<\/p>\n<\/div>\n<p>&nbsp;<\/p>\n<div><\/div>\n<div>\n<div><div style=\"margin-top: 50px;\">&nbsp;<\/div><\/div>\n<\/div>\n<h2><\/h2>\n<p>&nbsp;<\/p>\n<!--CusAds0-->\n<div style=\"font-size: 0px; height: 0px; line-height: 0px; margin: 0; padding: 0; clear: both;\"><\/div>","protected":false},"excerpt":{"rendered":"<p>1. Download and install Node.js. Windows On Windows, It comes with installer. Download | Node.js Test the installations. On console, type: node -v Linux *** NOTES: 1. node 8x is not available for wheezy. So, it was made an attempt, then installed the version 6x, which is the compatible version. If using a later version, &#8230; <a href=\"https:\/\/ultering.com\/it4us\/?p=5928\" class=\"more-link\">Read More<span class=\"screen-reader-text\"> &#8220;Angular: Step-by-Step: Environment Setup&#8221;<\/span> &raquo;<\/a><\/p>\n","protected":false},"author":4,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"footnotes":""},"categories":[192,26],"tags":[],"class_list":["post-5928","post","type-post","status-publish","format-standard","hentry","category-angular","category-javascript"],"_links":{"self":[{"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=\/wp\/v2\/posts\/5928","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5928"}],"version-history":[{"count":6,"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=\/wp\/v2\/posts\/5928\/revisions"}],"predecessor-version":[{"id":5965,"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=\/wp\/v2\/posts\/5928\/revisions\/5965"}],"wp:attachment":[{"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5928"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=5928"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ultering.com\/it4us\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=5928"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}