Quer tornar seu site do Angular o mais rápido e acessível possível? Você está no lugar certo.
O que é o Angular?
O Angular é um framework para a criação de interfaces do usuário. Ele fornece elementos fundamentais que ajudam você a configurar rapidamente um aplicativo sustentável e escalonável. O Angular permite que os desenvolvedores criem aplicativos para Web, dispositivos móveis ou computadores.
O que tem nesta coleção?
Esta coleção se concentra em cinco áreas principais para otimizar um aplicativo Angular:
- Melhorar o desempenho do seu aplicativo para aumentar o engajamento e as conversões dos usuários
- Aumentar a confiabilidade do seu aplicativo em redes ruins, fazendo o pré-armazenamento em cache dos recursos com o service worker do Angular
- Tornar seu aplicativo detectável para mecanismos de pesquisa e bots de mídias sociais usando a pré-renderização e a renderização do lado do servidor
- Tornar seu aplicativo instalável para oferecer uma experiência do usuário semelhante à de um app iOS/Android
Cada postagem da coleção descreve técnicas que você pode aplicar diretamente aos seus próprios aplicativos.
O que não está nesta coleção?
Esta coleção pressupõe que você já conhece o Angular e o TypeScript. Se você ainda não se sente confiante com eles, confira a documentação do TypeScript e o guia Primeiros passos com o Angular em angular.io (links em inglês).
Começar um projeto
A interface de linha de comando (CLI) do Angular permite configurar rapidamente um aplicativo Angular simples do lado do cliente. Esta postagem tem uma breve introdução à CLI, enquanto outras postagens da coleção mostram como adicionar recursos mais avançados, como renderização no servidor e suporte à implantação.
Configurar a CLI
Para começar, instale a CLI globalmente e verifique se você tem a versão mais recente executando estes comandos:
npm i -g @angular/cli
ng --version
Verifique se o último comando gera a versão 8.0.3 ou mais recente.
Como alternativa, se você não quiser instalar a CLI globalmente, é possível instalá-la localmente e executá-la com o comando npx
:
npm i @angular/cli
npx ng --version
Criar o projeto
Para criar um novo projeto, execute:
ng new my-app
Esse comando vai criar os arquivos iniciais e a estrutura de pastas do aplicativo e instalar os módulos de nó necessários.
Quando o processo de configuração for concluído, inicie o aplicativo executando:
cd my-app
ng serve
Agora você pode acessar o aplicativo em http://localhost:4200.
A seguir
No restante desta coleção, você vai aprender a melhorar a performance e o SEO do seu aplicativo Angular. Confira o que será abordado:
- Divisão de código no nível da rota no Angular
- Orçamentos de desempenho com a CLI Angular
- Estratégias de pré-busca de rotas no Angular
- Otimização da detecção de mudanças no Angular
- Virtualize listas grandes com o CDK do Angular
- Armazenamento em cache antecipado com o service worker do Angular
- Pré-renderizar rotas com a CLI do Angular
- Renderização do lado do servidor com o Angular Universal
- Adicionar um manifesto de app da Web com a CLI do Angular