/tutorial-crud-mean

Repositório responsável pelo tutorial realizado no canal do youtube

Primary LanguageTypeScriptOtherNOASSERTION

Tutorial CRUD MEAN com Angular 8 com Azure by Glaucia Lemos

Tutorial-MEAN.jpg

Repositório responsável pelo tutorial realizado no meu canal do Youtube

O que eu vou aprender?! 📙

Durante o tutorial, você aprenderá a desenvolver uma aplicação que consiste em realizar um cadastro de um Funcionário para uma empresa XYZ. A qual, usaremos as operações CRUD (Create, Read, Update & Delete). A aplicação estará integrada com o Back-End(Node.js) e estará hospedada na plataforma Cloud da Microsoft - Azure.

Os dados do Funcionário consiste em:

Classe: Funcionario

  • idFuncionario: (number - guid gerado pelo MongoDb)
  • nomeFuncionario: string
  • cargo: string
  • numeroIdentificador: number

Recursos Utilizados no Desenvolvimento da Aplicação 💻

Ementa do Workshop: ✏️

  • Breve Introdução sobre MEAN
  • O que iremos Desenvolver
  • Preparação ao Ambiente de Desenvolvimento
  • Desenvolvimento da Aplicação (Front-End & Back-End)
  • Considerações Finais

Vídeos do Workshop: 🎥

Módulo 1 - Desenvolvimento do Front-End

Módulo 2 - Desenvolvimento do Back-End

Módulo 3 - Integração do Back-End com o Front-End (Em Breve)

Módulo 4 - Hospedagem & Deploy da Aplicação no Azure (Em Breve)

Executando a Aplicação Localmente ❗️

Executando a aplicação no lado do Front-End

  1. Instalar os pacotes com o comando: (dentro da pasta front)
> npm install
  1. Depois executar o seguinte comando para executar a aplicação (dentro da pasta front):
> ng serve -o

Depois bastam abrir o browser em localhost:4200 (porta padrão de uma aplicação Angular)

Executando a aplicação no lado do Back-End

  1. Instalar os pacotes com o comando: (dentro da pasta api)
> npm install
  1. Depois executar o seguinte comando para executar a aplicação (dentro da pasta api):
> nodemon

Depois bastam abrir o postamn em localhost:8000 e testar as requisições

Atualização Limpa para a versão atual do Angular 7:

Executar os passos abaixo:

  1. Executar os comandos abaixo:
> npm cache verify

> npm install -g @angular/cli
  1. Porém, se executou os comandos acima e não resolveu o problema, tenta executar os seguintes comandos abaixo:
> npm uninstall -g angular-cli (abrindo o Power Shell como Administrador)
> npm cache verify
> npm cache clean
> npm install -g @angular/cli@latest
> ng --version
  1. Se mesmo assim depois de executar os passos acima, com o Power Shell executando como Administrador e você não conseguiu atualizar para o Angular 7, execute os seguintes comandos abaixo:
> ng update @angular/cli
> ng --version
  1. Se tudo der certo (numa dessas 3 maneiras sempre vai dar). Sempre execute os comandos abaixo:
> npm cache verify
> npm cache clean (para versões antigas do npm)

E vòilá! ❤️ ❤️

Links e Recursos Adicionais

Dúvidas?! ❓

Se tiverem alguma dúvida referente ao código desenvolvido ou para configurar o ambiente em suas máquinas, por favor, bastam criar uma ISSUE AQUI no GitHub que estarei respondendo a vocês ASAP!! ❤️ ❤️ ❤️ 😊

(documentação em desenvolvimento)