Quer tornar seu site Angular o mais rápido e acessível possível? Este é o lugar certo!
O que é o Angular?
O Angular é um framework para criar interfaces do usuário. Ele oferece componentes básicos para ajudar você a configurar rapidamente um aplicativo sustentável e escalonável. O Angular permite que os desenvolvedores criem aplicativos para a 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 a performance do aplicativo para aumentar a conversão e o engajamento dos usuários.
- Melhorar a confiabilidade do aplicativo em redes ruins, pré-armazenando em cache os recursos com o service worker do Angular
- Como tornar seu aplicativo detectável para mecanismos de pesquisa e bots de mídias sociais usando pré-renderização e renderização do lado do servidor
- Tornar o aplicativo instalável para oferecer uma experiência do usuário semelhante à de um app para iOS/Android.
Cada postagem na 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 Primeiras etapas com o Angular em angular.io.
Começar um projeto
A interface de linha de comando (CLI) do Angular permite configurar rapidamente um aplicativo simples do Angular do lado do cliente. Este post tem uma breve introdução à CLI, enquanto outros posts da coleção mostram como adicionar recursos avançados, como renderização do lado do 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, instale-a localmente e execute-a 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, além de instalar os módulos de nó necessários.
Depois que o processo de configuração for concluído, execute o seguinte comando para iniciar o aplicativo:
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 o desempenho e o SEO do seu aplicativo Angular. Confira o que está incluído:
- Divisão de código no nível da rota no Angular
- Montantes de desempenho com a CLI do Angular
- Estratégias de pré-busca de rotas no Angular
- Otimização da detecção de mudanças no Angular
- Virtualizar listas grandes com o CDK do Angular
- Pré-armazenamento em cache 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