Node.js - AngularJS - Editando o Primeiro Modelo no my-app para Aplicativos Móveis
Este tutorial apresenta um exemplo prático para editar módulos no projeto my-app criado no post anterior @CanalQb - Mobile AngularJS Instalação completa.
A instalação do módulo AngularJS criou uma pasta chamada my-app. Dentro desta, há uma pasta src, onde a aplicação móvel genérica está localizada.
Alterando o título do aplicativo de forma prática e segura
Para alterar o título do app, abra o arquivo src/app/app.component.ts. Recomendo o uso do Notepad++ ou outro editor de código leve e eficiente para scripts.
Procure a linha que contém title = 'app';, onde 'app' é o título atual do seu aplicativo. Você pode modificar essa string para o nome que preferir, por exemplo:
No meu caso, alterei a palavra 'app' para 'Rodrigo Carlos Moraes'.
Configurando o layout visual do app com CSS no AngularJS
Em seguida, abra o arquivo src/app/app.component.css para editar o estilo da aplicação. Adicione o seguinte código para personalizar o título:
h1 {
color: #369;
font-family: Arial, Helvetica, sans-serif;
font-size: 250%;
}
Salve as alterações e valide o comportamento da aplicação abrindo o navegador no endereço http://localhost:4200.
Resumo:
Título do APP: src/app/app.component.ts
Layout (CSS): src/app/app.component.css
Executando e reiniciando a aplicação AngularJS localmente
Ao reiniciar o computador ou encerrar a janela do prompt de comando onde a aplicação está rodando, a execução será interrompida. Para reiniciar, siga os passos:
- Abra o prompt de comando (CMD).
- Navegue até a pasta do projeto, por exemplo:
cd c:\app\my-app. - Inicie a aplicação com o comando
ng serve --open. Este processo pode demorar alguns instantes. - Após a inicialização, seu navegador será aberto automaticamente com o link http://localhost:4200.
Importante: Este tutorial é destinado a desenvolvedores que estão iniciando com AngularJS em aplicativos móveis. Para resultados completos, é recomendável ter conhecimentos básicos em JavaScript, AngularJS e ambiente Node.js.
Lembre-se sempre de fazer backup dos arquivos antes de realizar alterações e testar em ambiente local antes de publicar sua aplicação em produção.
Aviso de responsabilidade: Investimentos em tecnologia, ferramentas e produtos digitais envolvem riscos. Analise cuidadosamente antes de implementar qualquer solução. Os resultados podem variar conforme o perfil e contexto do usuário.
Recomendações de ferramentas:
- Notepad++ – Editor leve e eficiente para edição de scripts.
- Node.js – Ambiente para execução de JavaScript no servidor.
- Angular – Framework para construção de aplicações web modernas.
- WalletConnect – Para integração com wallets seguras e compatíveis com apps descentralizados.