jwt-node-vue - GitLite

KO | EN

gitlite — search

#python #react #typescript #llm #golang #go #machine-learning #nodejs #java #vue #mcp #ios #openai #open-source

jwt-node-vue

(★ 97)

Repositório responsável pelo primeiro projeto da série de vídeos: Coding Stuff.

File Explorer

Download Latest Version (.zip)

- - codeql-analysis.yml
  - node.js.yml
- dependabot.yml
- FUNDING.yml
- - launch.json
- - app.js
- .eslintrc.json
- .gitignore
- package-lock.json
- package.json
- server.js
- - .browserslistrc
  - .editorconfig
  - .eslintrc.js
  - .gitignore
  - babel.config.js
  - package-lock.json
  - package.json
  - README.md
.editorconfig
LICENSE
README.md
SECURITY.md

# Installation Guide

1. Get the code

git clone https://github.com/glaucia86/jwt-node-vue

Downloads the entire project code from GitHub to your computer.

cd jwt-node-vue

Moves into the project folder you just downloaded.

2. Node.js

Easy Recommended

Prerequisites

Git Needed to download the project code from GitHub.
Node.js Node.js must be installed to use npm. The LTS version is recommended.

cd backend

This project's files live in a subfolder, so move into it first.

npm install

Downloads and installs the libraries listed in package.json.

npm start

Starts the development/run server.

✅ After running the command, open the address shown in the terminal (usually something like http://localhost:3000) in your browser.

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# Série de Vídeos - Coding Stuff: Projeto #01 - Desenvolvendo Aplicação JWT com Node + MongoDB + Vue

[![C-pia-de-Tutorial-Node-js-Express-com-Docker-1.png](https://i.postimg.cc/CKLjkKzX/C-pia-de-Tutorial-Node-js-Express-com-Docker-1.png)](https://postimg.cc/WdCFPTmw)

Repositório responsável pelo primeiro projeto da série de vídeos: **Coding Stuff**.

O objetivo da série é ensinar inúmeros tutoriais e projetos direto ao ponto no meu **[Canal do Youtube](https://bit.ly/youtube-canal-glaucialemos)**!

Nesse primeiro projeto da série do **Coding Stuff!** vamos aprender um pouco sobre como podemos criar aplicações de autenticação usando o JWT com Node.js. Assim sendo, estaremos desenvolvendo uma aplicação E2E (desde o Back-End ao Front) de login e senha, a qual faremos uso do JWT e persistindo no MongoDb.
Após isso, faremos o lado do client usando o Vue.Js.

Ao término do projeto local, estaremos hospedando a aplicação no **[Azure](https://azure.microsoft.com/?WT.mc_id=javascript-12243-gllemos)** tanto no lado do server e client-side!

## ☕ Apoie e Ajude esse Projeto!

Se você curte ou curtiu os vídeos feitos desse curso e deseja apoiar com um valor de um Cafezinho Brasileiro, então sinta-se à vontade em fazer o seu donation no botão abaixo:

<a href='https://ko-fi.com/I3I644UCW' target='_blank'><img height='36' style='border:0px;height:36px;' src='https://cdn.ko-fi.com/cdn/kofi3.png?v=2' border='0' alt='Buy Me a Coffee at ko-fi.com' /></a>

## 🚀 Recursos utilizados

- **[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=javascript-12243-gllemos)**
- **[Node.js](https://nodejs.org/en/)**
- **[Vue.js](https://vuejs.org/)**
- **[Postman](https://www.getpostman.com/)**
- **[MongoDB](https://www.mongodb.com/try/download/community)**
- **[MongoDB Compass](https://www.mongodb.com/products/compass)**
- **[Azure CosmosDB](https://azure.microsoft.com/services/cosmos-db/?WT.mc_id=javascript-12243-gllemos)**
- **[Conta - Azure](https://azure.microsoft.com/?WT.mc_id=javascript-12243-gllemos)**
- **[Static Web Apps](https://docs.microsoft.com/azure/static-web-apps/?WT.mc_id=javascript-12243-gllemos)**
- **Libs do Node usadas no Projeto**
  - **[bcryptjs](https://www.npmjs.com/package/bcryptjs)**
  - **[bcrypt](https://www.npmjs.com/package/bcrypt)**
  - **[jsonwebtoken](https://www.npmjs.com/package/jsonwebtoken)**
  - **[mongoose](https://www.npmjs.com/package/mongoose)**
  - **[dotenv](https://www.npmjs.com/package/dotenv)**

## ⭐️ Conta - Azure For Students

Caso você seja um(a) estudante de alguma Instituição de Ensino de Faculdade ou Universidade, poderá criar sua conta no **[Azure for Students](https://azure.microsoft.com/free/students/?WT.mc_id=javascript-12243-gllemos)**. Essa conta te dará o benefício em possuir crédito de USD 100,00 para usar os serviços de maneira gratuita, sem necessidade de possuir um cartão de crédito. Para ativar essa conta, bastam acessar o link ao lado: **[AQUI](https://azure.microsoft.com/free/students/?WT.mc_id=javascript-12243-gllemos)**

## 💻 Série de Vídeos

Os vídeos sairão todas às quintas-feiras no meu **[Canal do Youtube](https://bit.ly/youtube-canal-glaucialemos)**!

Abaixo seguem os links da cada vídeo da série do projeto realizados até o momento _(atualizado semanalmente)_

### **Back-End**

| Vídeo Aula                                                                   | Descrição                                                          |
| ---------------------------------------------------------------------------- | ------------------------------------------------------------------ |
| **[Vídeo 01 - JWT + Node.js + MongoDB + Vue](https://youtu.be/JmUSx5wXU68)** | Estruturação do Projeto                                            |
| **[Vídeo 02 - JWT + Node.js + MongoDB + Vue](https://youtu.be/Vr-UMoAv8pk)** | Desenvolvimento da Rota Default da Api                             |
| **[Vídeo 03 - JWT + Node.js + MongoDB + Vue](https://youtu.be/6u4aM2eT-gg)** | Criando a Conexão da Base de Dados                                 |
| **[Vídeo 04 - JWT + Node.js + MongoDB + Vue](https://youtu.be/VGgseqbWEt8)** | Criando a Classe 'User' e as Regras de Negócio com JWT & BcryptJs  |
| **[Vídeo 05 - JWT + Node.js + MongoDB + Vue](https://youtu.be/-nRSKeT9OkE)** | Criando a Rota 'Register' e a Lógica na Controller                 |
| **[Vídeo 06 - JWT + Node.js + MongoDB + Vue](https://youtu.be/_-3DWpuXXvU)** | Criando a Rota Aprendendo a Depurar a API no Vs Code               |
| **[Vídeo 07 - JWT + Node.js + MongoDB + Vue](https://youtu.be/OckHsZPIRrQ)** | Desenvolvendo o middleware 'Auth'                                  |
| **[Vídeo 08 - JWT + Node.js + MongoDB + Vue](https://youtu.be/6fUcm4aSEjM)** | Desacoplamento de Responsabilidade e Ajustes Importantes no Código |

### **Front-End**

| Vídeo Aula                                                                   | Descrição                                                            |
| ---------------------------------------------------------------------------- | -------------------------------------------------------------------- |
| **[Vídeo 09 - JWT + Node.js + MongoDB + Vue](https://youtu.be/PH-kSpoEpYI)** | Iniciando o Projeto no lado do Front-End com Vue.Js                  |
| **[Vídeo 10 - JWT + Node.js + MongoDB + Vue](https://youtu.be/oLXCKIvOPK4)** | Criando e Organizando as pastas e arquivos no Projeto com Vue.js     |
| **[Vídeo 11 - JWT + Node.js + MongoDB + Vue](https://youtu.be/5VSzUFIAh1U)** | Desenvolvimento da Página de Login                                   |
| **[Vídeo 12 - JWT + Node.js + MongoDB + Vue](https://youtu.be/LtSeR3jy28Y)** | Desenvolvimento da Página de Cadastro                                |
| **[Vídeo 13 - JWT + Node.js + MongoDB + Vue](https://youtu.be/8gG1OwMIDts)** | Inclusão do Pacote NProgress no Projeto (Front-End)                  |
| **[Vídeo 14 - JWT + Node.js + MongoDB + Vue](https://youtu.be/UcKm1ADpWlQ)** | Desenvolvimento Lógica de validação com vuelidate - Tela de Login    |
| **[Vídeo 15 - JWT + Node.js + MongoDB + Vue](https://youtu.be/cQxoBu2rexE)** | Desenvolvimento Lógica de validação com vuelidate - Tela de Cadastro |
| **[Vídeo 16 - JWT + Node.js + MongoDB + Vue](https://youtu.be/hQaDG-oZQ_g)** | Integração do Back-End com Front da tela Register e uso do SweetAlert
| **[Vídeo 17 - JWT + Node.js + MongoDB + Vue](https://youtu.be/XykcWilTg68)**   Integração do Back-End com Front da tela LOGIN                       |
| **[Vídeo 18 - JWT + Node.js + MongoDB + Vue](https://youtu.be/TmGnuRhX_hI)** | Finalização da aplicação no Front - Page Home                        |

### **Migração para Nuvem (Em breve)**

| Vídeo Aula       | Descrição      |
| ---------------- | -------------- |
| **[EM BREVE]()** | Vídeo EM BREVE |
| **[EM BREVE]()** | Vídeo EM BREVE |
| **[EM BREVE]()** | Vídeo EM BREVE |
| **[EM BREVE]()** | Vídeo EM BREVE |

## ❗️ Links & Recursos Importantes

Como dito durante as live codings, sempre estaremos citando links e recursos importantes que direcionarão para: documentações, cursos gratuitos, livros e conteúdos relacionados a Node.js & PostgreSQL. Abaixo, segue uma lista desses recursos, que são considerados leituras, cursos ou livros recomendados:

- ✅ **[Curso Grátis de Vue.Js - Microsoft Learn](https://bit.ly/2PoJVI9)**
- ✅ **[Curso Grátis de Criando Aplicações JavaScript com Node.js](http://bit.ly/2JN0874)**
- ✅ **[Curso Grátis Azure Functions com Node](http://bit.ly/2LlgLHa)**
- ✅ **[Curso Grátis CosmosDB com Node](http://bit.ly/3nd3nT0)**
- ✅ **[Curso de Deploy Automático com SWA + GitHub Actions](http://bit.ly/3odzNxL)**
- ✅ **[Azure para devs JavaScript & Node.js](https://docs.microsoft.com/javascript/azure/?WT.mc_id=javascript-12243-gllemos&view=azure-node-latest)**
- ✅ **[Documentação do Node.js usando o Vs Code](http://bit.ly/354hrYH)**
- ✅ **[Depurando Aplicações Node com Vs Code](https://code.visualstudio.com/docs/nodejs/nodejs-debugging?WT.mc_id=javascript-12243-gllemos)**
- ✅ **[Documentação do Vs Code com Vue](http://bit.ly/2MtXYtT)**
- ✅ **[Documentação Oficial do JWT](https://jwt.io/)**
- ✅ **[Documentação Oficial do ExpressJs](https://expressjs.com/pt-br/)**

## ❓ Tenho Dúvidas... O que Faço?!

Caso tenham dúvidas aos códigos desenvolvidos durante a série de vídeos, sintam-se a vontade em abrir uma **[ISSUE AQUI](https://github.com/glaucia86/jwt-node-vue/issues)**. Assim que possível, estarei respondendo as todas as dúvidas que tiverem!

**(documentação em desenvolvimento)**