Tutorial CRUD MEAN com Angular 8 com Azure by Glaucia Lemos

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 💻

Visual Studio Code DOWNLOAD AQUI
Node.js DOWNLOAD AQUI
Angular CLI ~ 7.2.2 DOWNLOAD AQUI
Mongodb Community Server DOWNLOAD AQUI
MongodB Compass GUI DOWNLOAD AQUI
Boostrap 3/4 DOWNLOAD AQUI
Cadastro no Site Azure AQUI
Postman DOWNLOAD AQUI

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

Instalar os pacotes com o comando: (dentro da pasta front)

> npm install

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

Instalar os pacotes com o comando: (dentro da pasta api)

> npm install

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:

Executar os comandos abaixo:

> npm cache verify

> npm install -g @angular/cli

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

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

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

✅ Depurando Aplicação em Angular
✅ Tutorial Hospedando Aplicativo Web Azure
✅ Hospede & Faça Deploy de Site Estático no Azure
✅ Free Trial Azure
✅ Azure for Students
✅ CosmosDb
✅ Tutorial Criando um aplicativo Node.js e MongoDB no Azure
✅ Tutorial 1: Compilando um aplicativo Web do Node.js usando Azure Cosmos DB
✅ Tutorial 2: Migração offline do MongoDB para o Azure Cosmos DB

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)

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

glaucia86 / tutorial-crud-mean

Programming Languages

Labels

Projects that are alternatives of or similar to tutorial-crud-mean