Criando um CRUD com THF (1/7)- Iniciando o projeto

Jhosef Marks
TOTVS Developers
Published in
3 min readJan 22, 2019

Olá mundo!

Objetivo dessa série

A ideia é criar um pequeno CRUD com o THF, explorando alguns dos seus componentes e, conforme a série avançar, adicionar novas funcionalidades ao projeto. Nós não vamos desenvolver nada relacionado ao backend, vamos focar 100% no desenvolvimento usando o THF.

Sobre o projeto

Vamos criar uma aplicação básica de cadastro de clientes, o velho e bom Customers. Se surgirem novas ideias, nós vamos incorporando ao projeto.

Iremos usar a versão @totvs/thf-cli@3.0.0 para gerar nossa aplicação.

Lista de posts da série "Criando um CRUD com THF"

Essa lista pode sofrer alterações até o final da série. 😅

Pré requisitos

Vontade de aprender, conhecer Angular e ler o post que ensina a criar uma aplicação com o THF Cli em três passos.

Não esqueça de instalar o THF Cli.

Passo 1 — Criando e preparando o projeto

Para iniciar, vamos criar nossa aplicação, vá até seu diretório de trabalho e execute os seguintes comandos para dar início ao projeto:

thf new thf-customers --title "THF | My Customers"
cd thf-customers
ng serve

Fazendo isso e acessando a url http://localhost:4200 no seu browser favorito, você já deve ter algo parecido com isso:

Projeto inicial.

Passo 2 — Limpando o que não precisa

Abra o projeto em seu editor favorito e remova a pasta src\app\users. Não vamos precisar desse módulo agora.

Eu uso e sugiro o uso do Visual Studio Code.

Removendo a pasta users do projeto.

Agora vamos apagar o menu Users e a rota do módulo que acabamos de remover.

Acesse o arquivo src/app/app.component.ts e remova o item do menu com o label Users.

E, por último, acesse o arquivo src/app/app-routing.module.ts e remova a rota que aponta para o módulo Users.

Sua aplicação deve ficar assim:

E agora José?

Esse foi só o início do nosso projeto. No próximo post vou disponibilizar nosso backend de teste para darmos início a criação da nossa lista de clientes.

Você pode encontrar os fontes do projeto no repositório do github.

--

--

Jhosef Marks
TOTVS Developers

Desenvolvedor por vocação, e front end por opção. Projeto atual: http://thf.totvs.com.br