{"id":20118,"date":"2020-02-26T12:09:34","date_gmt":"2020-02-26T15:09:34","guid":{"rendered":"https:\/\/king.host\/wiki\/?post_type=article&#038;p=20118"},"modified":"2025-05-27T14:35:42","modified_gmt":"2025-05-27T17:35:42","slug":"angular","status":"publish","type":"article","link":"https:\/\/king.host\/wiki\/artigo\/angular\/","title":{"rendered":"Como utilizar Angular na KingHost"},"content":{"rendered":"\n<p><em>Possui alguma d\u00favida do que \u00e9 angular ou onde voc\u00ea pode fazer a hospedagem da<\/em>  <em>sua aplica\u00e7\u00e3o em angular, nesse artigo tiraremos suas d\u00favidas.<\/em> <\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"O_que_e\"><\/span>O que \u00e9?<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Angular \u00e9 um dos frameworks mais populares do Javascript. Muito famoso entre os desenvolvedores por ser uma \u00f3tima op\u00e7\u00e3o para desenvolver <em>single-page applications<\/em>.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"O_que_e_uma_single-page_application\"><\/span>O que \u00e9 uma single-page application?<span class=\"ez-toc-section-end\"><\/span><\/h4>\n\n\n\n<p>\u00c9 uma aplica\u00e7\u00e3o que roda em uma \u00fanica p\u00e1gina, onde toda parte principal da aplica\u00e7\u00e3o ser\u00e1 carregada apenas 1 vez e o resto da aplica\u00e7\u00e3o ser\u00e1 carregada conforme for sendo solicitado, apenas se o usu\u00e1rio solicitar seu carregamento.<\/p>\n\n\n\n<p>Normalmente isso tr\u00e1s uma experiencia otimizada para o usu\u00e1rio considerando que a navega\u00e7\u00e3o dele vai ficar mais limpa e din\u00e2mica.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Como_e_utilizado\"><\/span>Como \u00e9 utilizado?<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>O Angular \u00e9 compat\u00edvel com algumas linguagens de programa\u00e7\u00e3o como o JavaScript, Dart e o TypeScript. Por\u00e9m ela foi criada utilizando TypeScript ent\u00e3o essa \u00e9 a linguagem principal na qual os desenvolvedores normalmente a utilizam e tamb\u00e9m onde ser\u00e1 encontrado a maioria das documenta\u00e7\u00f5es.<\/p>\n\n\n\n<p>Por\u00e9m esses c\u00f3digos em TypeScript precisam ser transpilados para javascript j\u00e1 que os navegadores n\u00e3o conseguem executar c\u00f3digos TypeScript.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Como_pode_ser_usado_na_KingHost\"><\/span>Como pode ser usado na KingHost?<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Enfim sabendo de tudo isso \u00e9 poss\u00edvel utilizar na KingHost?<\/p>\n\n\n\n<p><strong>Sim<\/strong>, podemos utilizar o Angular em qualquer plano da KingHost por ser uma aplica\u00e7\u00e3o que no final ficar\u00e1 como JavaScript.<\/p>\n\n\n\n<p>Para fazer isso \u00e9 necess\u00e1rio ir na pasta de sua aplica\u00e7\u00e3o pelo terminal e rodar o comando:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\" lang=\"wp-block-preformatted\">ng build --prod<\/pre>\n\n\n\n<alerta class=\"wp-block-k-alerta\">\ud83d\udca1 O comando deve ser executado em ambiente de desenvolvimento.<\/alerta>\n\n\n\n<p>Esse comando far\u00e1 a transpila\u00e7\u00e3o do TypeScript para JavaScript. Criando assim a pasta <strong>dist<\/strong> dentro da sua aplica\u00e7\u00e3o. Nessa pasta ficar\u00e3o os arquivos que podem ser usados em produ\u00e7\u00e3o.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img data-original=\"https:\/\/king.host\/wiki\/wp-content\/uploads\/2020\/03\/image-1.png\" alt=\"Angular: como utilizar na KingHost. Exibindo os arquivos da aplica\u00e7\u00e3o.\" class=\"wp-image-20147\" v-on:click=\"toggle_modal\"\/><\/figure>\n\n\n\n<p><em>Caso tenha alguma d\u00favida sobre como se conectar ao ftp, pode verificar <a rel=\"noreferrer noopener\" aria-label=\"esse artigo (abre numa nova aba)\" href=\"https:\/\/king.host\/wiki\/artigo\/acessar-ftp-via-filezilla\/\" target=\"_blank\">esse artigo<\/a><\/em>.<\/p>\n\n\n\n<p>Sendo assim \u00e9 s\u00f3 colocar os arquivos dentro do seu FTP e ent\u00e3o o angular estar\u00e1 funcionando.<\/p>\n\n\n\n<p class=\"has-background\" style=\"background-color:#fbe7c6\"><strong>Aten\u00e7\u00e3o: <\/strong><br>O\u00a0<a href=\"https:\/\/angular.io\/\">Angular<\/a>\u00a0\u00e9 uma plataforma baseada em\u00a0<a href=\"https:\/\/kinghost.wiki\/recursos-indisponiveis\/#Typescript\" target=\"_blank\" rel=\"noreferrer noopener\">TypeScript<\/a>\u00a0e sucessora do AngularJS.<br><strong>A KingHost oferece suporte at\u00e9 a vers\u00e3o 2 (quando ainda era conhecido como AngularJS)<\/strong>\u00a0em todos os servidores. A partir dessa vers\u00e3o, \u00e9 necess\u00e1rio utilizar o NPM para a instala\u00e7\u00e3o,\u00a0<strong>tornando o Angular compat\u00edvel apenas com planos NodeJS<\/strong>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Onde_hospedar\"><\/span>Onde hospedar?<span class=\"ez-toc-section-end\"><\/span><\/h3>\n\n\n\n<p>Como dito acima o Angular pode ser utilizar em qualquer um de nossos planos, caso tenha interesse em contratar pode dar uma olhada em nossos <a href=\"https:\/\/king.host\/node-js?utm_source=wiki&amp;utm_medium=texto&amp;utm_term=link-planos-de-nodejs&amp;utm_content=angular&amp;utm_campaign=oferta-produto\" target=\"_blank\" rel=\"noreferrer noopener\">planos de NodeJS<\/a> e nos nossos <a href=\"https:\/\/king.host\/hospedagem-de-sites?utm_source=wiki&amp;utm_medium=texto&amp;utm_term=link-planos-de-hospedagem&amp;utm_content=angular&amp;utm_campaign=oferta-produto\" target=\"_blank\" rel=\"noreferrer noopener\">planos de Hospedagem<\/a>.<\/p>\n","protected":false},"author":9,"featured_media":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","format":"standard","article-category":[181,172],"article-tag":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/king.host\/wiki\/wp-json\/wp\/v2\/article\/20118"}],"collection":[{"href":"https:\/\/king.host\/wiki\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/king.host\/wiki\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/king.host\/wiki\/wp-json\/wp\/v2\/users\/9"}],"replies":[{"embeddable":true,"href":"https:\/\/king.host\/wiki\/wp-json\/wp\/v2\/comments?post=20118"}],"version-history":[{"count":2,"href":"https:\/\/king.host\/wiki\/wp-json\/wp\/v2\/article\/20118\/revisions"}],"predecessor-version":[{"id":26572,"href":"https:\/\/king.host\/wiki\/wp-json\/wp\/v2\/article\/20118\/revisions\/26572"}],"wp:attachment":[{"href":"https:\/\/king.host\/wiki\/wp-json\/wp\/v2\/media?parent=20118"}],"wp:term":[{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/king.host\/wiki\/wp-json\/wp\/v2\/article-category?post=20118"},{"taxonomy":"article-tag","embeddable":true,"href":"https:\/\/king.host\/wiki\/wp-json\/wp\/v2\/article-tag?post=20118"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}