TypeScript com NodeJS do jeito certo! | Diego Fernandes
HTML-код
- Опубликовано: 6 фев 2025
- O TypeScript é uma ferramenta que adiciona tipagem estática ao JavaScript que por padrão é uma linguagem que possui tipagem dinâmica, ou seja, as variáveis e funções podem assumir tipos distintos durante o tempo de execução.
Nesse vídeo construímos uma aplicação utilizando TypeScript, Sucrase, ESLint, Express, MongoDB, Mongoose e outras ferramentas.
Post sobre TypeScript: blog.rocketsea...
Código do projeto: github.com/Roc...
Post do Blog: blog.rocketsea...
-----
Acompanhe a Rocketseat nas redes sociais:
Site: www.rocketseat...
Twitter: / rocketseat
Facebook: / rocketseat
Instagram: / rocketseat_oficial
Comunidade: comunidade.rock...
Blog: rocketseat.com...
![Blox Fruits Dragon Rework Update [Full Stream]](http://i.ytimg.com/vi/EqDAp8udhm0/mqdefault.jpg)
O typescript realmente traz uma qualidade muito maior ao código, o que mata é essa configuração inicial
Podia ser que nem o react que voce pode serar o type direto
@@nathanmiguel76porque ele já vem com TS interno, aí só mudar e consumir
Sensacional! Acabei de iniciar em uma startup que usa 100% TypeScript, tanto no front quando no back, e esse video acabou de me ajudar demais!
Como está o projeto?
Sensacional, Leandro! Gratificante ler esse tipo de comentário! 💜
Sucesso, sempre! 🚀
Depois de algum tempo retorno aqui pra agradecer ao Diego e a toda equipe da Rocketseat por esses vídeos maravilhosos!
A adoção do Typescript para os meus projetos foi excelente!
Cara, muito obrigado por compartilhar esse conteúdo.
Fico feliz de encontrar um conteúdo sobre programação em português e de qualidade aqui no RUclips, de graça e acessível a todos.
Continue com esse trabalho sensacional, espero muito sucesso e agradeço mais uma vez!
Abraços a galera da Rocketseat e ao Diego. Good job!
pra quem estiver em 2020, ao instalar o prettier e seus determinados pacotes e salvar o arquivo server.js, o prettier pode adicionar " ; " no final das linhas, isso causará um erro no eslint devido ao padrão de estilo que o Diego escolheu no vídeo, eu resolvi da seguinte maneira:
- Criei um arquivo na raiz do projeto chamado prettier.config.js
e dentro dele:
module.exports = {
semi: false, // aqui retira o ponto e vírgula do final da linha
singleQuote: true, // define aspas simples
trailingComma: false // aqui eu tiro a virgula da última propriedade de qualquer objeto
}
Espero ter ajudado :)!
O meu está funcionando de boa, mas vou anotar essa dica. Valeu!
Vídeo bastante explicativo, com um ótima dinâmica e abrangência do conteúdo para quem conhece a tecnologia mas precisa de um ponto de partida. Muito bom!
vim aqui depois de assistir as aulas da next-level-week da rocketseat e me apaixonei por TypeScript. Nunca tinha percebido como ele ajuda na produtividade.
Ajuda demais demais, né!? Evita taaaanta dor de cabeça! HAHAHAHA 😛
Falando em NLW! Já se inscreveu pra próxima que começa segunda!? 😍
Ótimo vídeo! Consegui fazer um projeto em typescript + pug + mongoose + node graças a ele. Vc pensa e raciocina rápido q nem o meu chefe.
Perdão, agora que tive tempo de continuar o projeto é que percebi o erro: TypeError: Restaurante.create is not a function
Já tentei das duas formas e não funcionaram:
export default model('Restaurante', RestauranteSchema);
//export default model('Restaurante', RestauranteSchema)
Sensacional! Que vídeo massa! Apenas tinha uma noção básica sobre NodeJS, mas não sabia de nada sobre TypeScript. O resultado do post mais esse vídeo é muito bom! Muito proveitoso mesmo. Como foi colocado no post, o TypeScript pode sim diminuir a produtividade, mas é muito bom trabalhar com a correção de erros, classes e métodos, parece que o código fica mais encorpado! Lembrei muito do Java na hora de declarar Classes e tudo mais! Ótimo vídeo! Parabéns Rocketseat!
Que aula, perfeito sua didática.
Excelente video. Um dos melhores em typescript + express e olha que eu procurei muito material em ingles e não achei nenhum perto desse. Parabéns!
Como sempre vocês estão gerando conteúdo que agrega muito. Eu tinha uma visão um tanto preonceituosa sobre o typescript, mas depois desse video, por meio de exemplos práticos me fez ententer melhor a tecnologia. Parabéns pelo trabalho vocês.
muito obrigado! o conteúdo do seu vídeo, me ajudou bastante em como entender o typescript e a estruturar melhor a aplicação realmente estou muito agradecido, muito sucesso para vocês!
Estava criando uma api para um TCC. Já tinha utilizado o Mongo DB com JS, porém queria utilizar TS e estava com dificuldades. Esse vídeo ajudou muito.
Os comentários das configurações também!
Esse vídeo foi excelente. Atualmente sou Dev e uso Angular e estou querendo me tornar Fullstack. Como sou familiarizado com Typescript por conta do Angular, estou querendo aprender Node para partir para o desenvolvimento back-end e esse vídeo me ajudou de mais. Além de aprender como usar typescript com Node, ainda me ensinou criando uma api base com tipagem. Muito obrigado Diego. Sou inscrito novo e já gosto muito do canal e do seu trabalho. Valeu!
Uma das minhas metas para o final do ano era apreender a utilizar o TS, integrado no NodeJS. Esse video foi muito bom pra ter uma base. Valeu Diego!
Cara, você é o melhor! Parabéns pelo conteúdo super didático e pontual.
Opa, Diego
Muito bom o contéudo e a forma tranquila que você explica, cara.
Parabéns e valeu ai pelo vídeo.
menino(voce é muito jovem), voce é muito bom. muito seguro. parabens
Tá valendo até hj as dicas!
Que massa! 💜 😍
Fala Dev!! top top top!! voce é o cara!!! sempre objetivo, claro e principalmente seguro... parabéns Pia!! heheheheeheh... Redux + TS também seria uma boa!! fica a dica meu chefe!!
Cara, fantástico! Até que enfim encontrei o que procurava. Cara, parabéns e obrigado por compartilhar esse conhecimento. Venho do Python e Django e está sendo um desafio grande aprender JavaScript/NodeJS e TypeScript. Gosto muito de trabalhar com classes e não conseguia evoluir nos estudos e nos meus projetos por falta de um conhecimento desses. Irei estudar mais e fazer uma aplicação nesses moldes. Tenho uma ideia de contribuir para aperfeiçoar esse seu código. Assim que implementá-la no meu projeto, poderei compartilhar com você, se quiser. Abc.
cara seu conteudo no site é muito bom devia passar aqui pro youtube, to fazendo e to entendo tudo fantastico
Que vídeo sensacional! Como sempre a rockeseat ajudando demais os devs
Vou Começar a Usar Node e TypeScript em meus projetos
Fala Diego,
Obrigado por mais esse vídeo e também por começar a abordar temas utilizando o typescript.
Gostaria de ver mais conteúdo da Rocketseat com Typescript, principalmente Redux + Typescript.
Abraço.
Ou React Hooks + Typescript :D
@@noodde Com useContext e useReducer pra cuidar do gerenciamento de estado em vez do Redux :)
@@eduardoverdeja9596 a ferramenta de gerenciamento de estado do próprio react é limitada e não muito escalável. Redux é a ferramenta mais flexível e robusta para gerenciamento, sem dúvidas. Sempre use redux.
redux é um tanque de guerra e nem sempre tu precisa disso tudo
Show de bola Diego!!
Valeu demais, Anderson! 💜 🚀
Baita vídeo Diego. Show de bola!
Valeeeu, Vini! 😍 💜
Me ajudou de mais cara, muito obrigado. E que codigo bonito em, gostei muito do seu jeito de programar.
Que massa, Randal! 😍 💜
É bem bonito e limpo, né!? 😉
Diego, parabéns pelo canal! Excelente! Seria muito bom se você abordasse testes usando Typescript + Node.Js + Jest! Assim completaria o ciclo de implementação e teste! Parabéns!
Muito top!, eu estava tentando configurar e so dor de cabeca
Mas com seu video deu bom
Parabéns pelo trabalho que você tem feito, especialmente para a comunidade que fala português. Caso você tenha algum patreon, divulgue isto nos vídeos! Afinal, todo trabalhador merece seu “salário”. Sei que você talvez faça isto por puro altruísmo, mas todos que conheço tiram muito benefício disto.
Muito Top, vou começar a utilizar nos meus projetos!
Tu é muito bom em explicar as coisas!! Vídeo perfeito
Didática do Diego é sensacional, né!? 😍 💜
Vc tem uma didática muito boa!! Muito obrigado!
Didática do Diego é sensacional, né, Matheus!? 😍 💜
Parabéns pelo vídeo!
Gostei muito das facilidades do TS e vou começar a usar em todos os meus projetos!!!
despite this tutorial in in portages it was really awesome and the project structure is good Thanks bro
Vlw Diego, muito top essa aula de typescript!
Show demais Diego. Valeu pelo conteúdo.
Muito bom eu adorei a vídeo aprendi muito coisa parabéns Diego
Maravilha, Josicler! 😍 💜
Vc é o cara Diegoo
Ele é fera demais mesmo, né!? 😉 💜
Excelente aula, Typescript é incrivel!
Ajuda demais, né, Philip!? 💜 🚀
Vídeo excelente, meus parabéns pelo conteúdo!!
Fala Diego, comecei a programar a pouco tempo mais ou menos 2 ano , no momento trabalho como programador de vb e pesquisando como crescer na carreira procuro vários cursos em que o bolso pode pagar, nessas procura achei seu canal e seu site, já fiz quase todos cursos de lá, estou no final do recat e falta o react native. cara curti muito seus cursos. Parabens pelo canal e pelo força que da aos devs.
Ótima aula, aprendi muito mesmo
Que massa, Marcos! 😍 💜
caraca mano, tu ensina demais!!!
Diego parabéns, aprendi demais, obrigado
Showw!! achei o TypeScript muito elegante!!
Excelente video. Mais! Mais! Mais!
E tivemos mais mais mais, hein!? 😉
Valeu, Antonio! 💜 😍
Fala Diego, excelente vídeo para mim que estou batendo cabeça na arrancada com node + ts.
Podia ter um anexo no vídeo, um projeto com MySQL =)
A questão do roteamento para mim ainda é bem misteriosa, podia criar um método de update e delete para deixar o CRUD completinho e ajudar os newbies =)
No mais, parabéns pela iniciativa. Já entrei no site, comunidade, etc... vou acompanhar-te! Abs
Caramba! Que vídeo foda! Parabéns :D
Ótimo vídeo, bem detalhado!
Que massa que curtiu, Robinson! 😍
Excelente canal e conteúdo!
Sensacional Diego :D
Valeeeeu, Ramon! 💜 😍
Parabéns pelo vídeo. Bom trabalho.
Valeeeu demais, Uilton! 😍 💜
Obrigado xará.
Eai Joww,,,
Muito legal seu video>!
Eu consegui implementar aqui no meu ambiante, foram muitos insight dentro de um video.
Opa, vou assistir mais tarde... Já deixei o LIKE!
Video muito legal bem explicado e conciso. valeu ! :)
Que massa que curtiu, Robson! 💜
Opa excelente video obrigado pelo conteudo. Eu gostaria de saber se as recomendacoes desse video ainda se aplicam nas aplicacoes dos dias de hoje?
Muito bom!!
Valeu demais, Gu! 💜 🚀
Material excelente. Obrigado!
Muito bom!!! Good job.
Muito bom o artigo... =)
Valeeeeu, Atila! 😍 💜
Importante dizer que infelizmente o "Sucrase" até o momento não suporta decorators, por isso quem usa sequelize-typescript, como no meu caso, não poderá tirar proveito da ferramenta. De qualquer forma, o vídeo foi espetacular. Fiz aqui os ajustes no meu eslint :)
muito foda!!!
Showw de bola.. combinou muito bem
Demais, né, Alex!? 💜 🚀
Cara muito bom. Vou meter uma pilha no pessoal da empresa pra usarmos com node
E deu certo!? 😉 💜
Vendo e acompanhando o projeto só agora, rsss. Diego, muito bom, gostei demais do TS, certamente adotarei em meus projetos. Só tive dificuldade em conseguir debugar o projeto no vscode. Tem alguma dica pra configurar o ambiente pra isso?
Parabéns muito bom!
Valeeeeu! 🚀
ótimo vídeo, parabéns!
no final do video tentei fazer um console.log(user.fullName) mas nao funciona pq o arquivo user.ts na parte de return this.firstName + ' ' + this.lastName o firstt e o last name ta com erro como nao declarados fica com sublinhado em vermelho..
Pessoalmente eu não sei qual o motivo de usar o Prettier junto do ESLint, pois o ESLint já faz a formatação do código, esse exemplo mesmo que vc mostrou dele removendo o ponto e vígula no final, o meu ESLint aqui já faz isso há muito tempo sem eu nunca ter tocado no Prettier, mesmo com o auto save do VS Code, basta eu apertar CTRL + S que ele já formata; não vivo sem o ESLint, ele muito bom mesmo, o Prettier nunca usei...
Toooopp!!
Valeeeeu, Adjair! 💜 😍
Top!
💜 🔝
Show Diego! Uma divida vc conhece alguma abstracao para nao depender diretamente de um pacote de acesso a datos. Tipo que vc possa definir teu Schema do teu model User e esse mesmo esquema se vc quiser guardar no mongo vc guarda se vc quiser usar o Sequilize tb funcione, etc..
Massa demais!
Valeeeu, Fellipe! 😍 💜
Não consegui configurar o eslint no vs code, parece que as settings estão deprecadas
Tem vídeo ensinando somente as configurações?
Qual microfone você tá usando??? Agradeço, você é demais, aprendo muito, sou de automação, mas estou desenvolvendo WEB na empresa em que trabalho.
só faltou falar sobre os redeclarations files que ia ser top, acho umas das maiores dificuldades do express e typescript
Muito legal. É possível utilizar o TS junto com uma aplicação NodeJS legada (JS)? A ideia é ir construindo os novos recursos com TS, e ao longo do tempo refatorar a aplicação legada. Caso seja possível, poderia indicar onde acho conteúdo a respeito? Vlw
Você pode usar o TS e JS juntos, e aos poucos ir migrando tudo para TS sem problemas! 💜
Eai Diego,
Muito legal o vídeo, complementou de mais o post lá no blog.
Por que em alguns momentos tu usa o Yarn e outros NPM ?
Abraços.
Top hein, Diego fala do parceljs please.
Muito bom.
Valeeeu, Daniel! 😍 💜
Vlw Diego, sempre mandado bem. E em relação ao react com typescript? Você aconselha a utilização? Abraço.
Ótimo vídeo Diego.
Só uma dúvida, essas configurações devem ser feitas em todos novos projetos?
Bom noite Diego... Me tira uma duvida.... Onde entraria o Nest no mundo Node? Criei uma API com este framework para estudo. Sou um novato no mundo Node tentando andar um pouco.... Abraço!
cara o react roda no visual studio junto do node?
Ótimo vídeo, poderia fazer uma review do nest framework?
Queria uma review dessa também! :D
Kkkk sonha, eles são fã do adonis mesmo ele sendo o mais fraquinho dos fws
Você bem que poderia fazer uma série de Django. Tem muito pouco no yt e é um framework MUITO legal, sem falar que é Python e programar em Python é sempre um tesão kkkkkkkkkk
Tudo bem usar classes no backend? levei um puxão de orelha quando fiz estágio em uma empresa ao utilizar classes por conta do baixo desempenho.
Ele ta usando typescript com orientação a objetos, dá pra usar o typescript sem a orientação a objetos ? Eu perco desemprenho se fizer como se fosse js normal e não usar poo ?
Talvez perca desempenho se for usar POO, a única vantagem do POO é deixar o projeto mais organizado.
@Rocketseat, sabe me dizer se tem algum work around para trabalhar com experimentalDecorators usando sucrase? Isso viabiliza algumas ORMs como, sequelize e typeorm.
Em um video mais recente ( ruclips.net/video/0mYq5LrQN1s/видео.html ) ele usou o ( ts-node-dev ) ( github.com/wclr/ts-node-dev#readme ), inclusive tem um artigo sobre ( blog.rocketseat.com.br/ferramentas-de-compilacao-execucao-em-tempo-de-desenvolvimento-dos-projetos-em-node-js/)
@@JefteKeller obrigado, tambem vi o vídeo.
Boa tarde Diego, voce poderia fazer esse exemplo utilizando o banco mysql tambem, acredito que mtas pessoas utilizam mysql.
Bicho, na boa, é muito trabalho pra configurar um setup de um projeto. Já gastei minha energia de hoje só nisso. Cria um plugin ou alguma coisa que já configura essas partes.
De qualquer forma, obrigado pelo vídeo :)
Faaala, Lucas!! 🚀
Puts, é bem trabalhoso mesmo, né!? Mas pensa que só vai precisar configurar uma vez ali no projeto! 😉
O propósito desse vídeo foi justamente mostrar como as coisas funcionam "por baixo dos panos", por isso a configuração manual!
Valeeu! 💜
Olá Diego, estou precisando muito capturar o evento click de um botão para poder realizar algumas outras ações em função disso, estou usando o Typescript e não consigo fazer o meu formulário se comunicar com o mesmo, as rotas estão funcionando normalmente, mas o documento.getElementById não funciona porque não consigo fazer essa comunicação igual faço apenas chamando no formulário o arquivo de script que preciso, como posso em um arquivo .ts fazer a captura do elemento, estou usando Express + Nodejs, muito grato pela ajuda, MUITO MESMOOOOOOOOOO!
Muito bom
Valeeeu, Henrique! 💜 🚀
Excelente vídeo, man. Tem como fazer um outro como configurar o express no Nuxt JS e/ou no Next JS?
Video fantástico, só que eu tive um probleminha, comecei a testar uso de decorators, e o sucrase começou a dar problema. ele não reconhece decorators...