para começar a gente vai precisar ter o nodejs instalado entra aí no seu navegador e procura aqui por nodejs normalmente ele é o primeiro link aqui ó é só você clicar aqui e aí faz o download aqui da versão recomendada a versão atual é 20. 16 para instalar é muito simples você vai baixar aqui um executável vai dando next next e depois conclui depois a gente vai precisar de um editor de código Eu recomendo vscode é só procurar aqui ó vscode no seu navegador entra no primeiro site E aí clica aqui para fazer o download para instalar também é o mesmo processo vai dando next next e beleza bom depois que você tiver instalado tanto o node quanto o vscode com vscode aberto eu tenho essa pasta aqui da minha área de trabalho onde eu tenho diversos projetos Mas vamos criar aqui uma nova eu vou chamar aqui de typescript E aí basta você arrastar essa pasta pro vscode aberto né então ela vai ser aberta aqui no vs code vamos maximizar essa janela vamos estar preparando aqui o nosso ambiente de desenvolvimento e para isso a gente vai instalar aqui algumas extensões bem simples clica aqui nesses quadradinhos aqui do lado e vamos procurar aqui primeiro a extensão do typescript Então você escreve aqui ó typescript e aí se a gente expandir um pouco vocês podem ver a gente vai precisar instalar essa aqui ó JavaScript and typescript nightly clica aqui para instalar essa extensão aqui ela vai ser responsável para dar o Intel sência e o aut complete quando a gente for est digitando nossos códigos agora as próximas extensões são recomendações minhas pesquisa aí error Lens essa extensão aqui vai ser muito legal PR exibir os erros que a gente for est obtendo direto aí na linha onde eles estiverem acontecendo né então já clica aqui para instalar baixa aqui também a material icon tem isso aqui vai fazer com que as pastas e arquivos fiquem com ícones customizados vai ser melhor de visualizar as coisas aí né então quando você clicar para instalar ele vai falar aqui para você selecionar clica aqui ó material icon tem e por último aqui o meu tema do vs code vai mudar as cores aqui se você não quiser instalar esse tema se você tiver outro tema Aí usa o que você preferir Mas eu prefiro usar esse Então já vou selecionar ele aqui né então beleza as extensões já foram instaladas eu vou est criando uma configuração local para essa pasta aqui se vocês não quiserem fazer não precisa eu vou est criando um arquivo settings json dentro da pasta pon vscode e eu vou só estar colocando aqui algumas configurações simples para ficar melhor de visualizar Aí no vídeo né então eu vou pôr aqui o zoom level 3. 8 e eu vou tirar aqui esse Command Center né então fazer Window Command Center false E aí ele some aqui da nossa tela né então eu vou pôr aqui o terminal padrão Eu tenho um terminal customizado porém durante esse curso vou querer est utilizando o CMD normal aqui do Windows né Vamos abrir aqui o terminal para isso é muito simples você pode clicar aqui Terminal Novo terminal ou a forma mais fácil é só pegar aqui ó vai aparecer uma setinha arrasta ela aqui para cima vamos ver ficar a primeira versão do nosso node Então você escreve um node menos V Então já tá aqui ó a versão que a gente instalou vamos começar utilizando o comando npm init - Y ele vai gerar pra gente o package Jason então beleza Tá aqui o nosso package Jason vou excluir tudo que é desnecessário aqui então vou tirar todas essas informações aqui e essa version e já Vamos definir aqui o Type do nosso projeto para module né não vamos estar utilizando como JS a gente vai estar utilizando o JavaScript moderno e aí o Main aqui vai ser build bar index JS e o script aqui a gente já já vai colocar alguns scripts vou puxar o terminal novamente vamos instalar aqui dependências de desenvolvimento Então uso o comando npm instal menos d e a Flag para instalar dependências em desenvolvimento vamos instalar aqui primeiramente o typescript Então deixa eu puxar aqui o terminal para vocês ver que tá certinho ó npm instal typescript E dá um espaço aqui ó segunda Lib que a gente vai instalar vai ser o tsx então ele tá instalando aqui beleza por último vamos instalar só mais uma aqui ó vai ser @types bar node que a gente vai est instalando a tipagem aí do node então Dá um enter aqui beleza já tá aqui as dependências deixa eu puxar aqui de volta né Vamos criar um script de build ele vai só executar o comando tsc a gente vai ter um script de Dev que vai ser para executar o código sem buildar a gente vai tá utilizando essa Lib aqui do tsx então põe aqui ó tsx Source barra index.
ts e um último script para executar o projeto build é só executar aqui ó node ponto ele vai pegar aqui o Main antes da gente criar de fato o nosso arquivo typescript a gente precisa criar aqui um tsconfig. js aqui a gente vai estar colocando algumas configurações pro nosso projeto typescript funcionar corretamente eu preciso que vocês não se preocupe em entender tudo que a gente vai estar colocando aqui inicialmente não é necessário vocês entenderem ISO ao longo dos vídeos cada uma dessas opções vai fazendo mais sentido mas vamos começar aqui com compiler options vamos P essa opção aqui ó es módulo interop define como true skip Lib check define como true também strict define como true essa opção aqui é bem importante depois a gente tem aqui Lib põe es next a gente vai ter também target vai ser es next também module vai ser node next e o mod resolution também vai ser node nexo agora a gente precisa aqui especificar qual que vai ser o root dear do nosso projeto então põe aqui ó root dear vai ser a pasta source e a gente precisa especificar um out dear que vai ser a pasta build então basicamente o nosso projeto em typescript vai est na pasta source e quando a gente buildar o projeto ele vai fazer o processo de transpiração que vai transformar todos os arquivos typescript da pasta source em arquivos JavaScript na pasta build põe uma vírgula aqui depois desse objeto a gente vai precisar da propriedade include também vamos pôr aqui para incluir a pasta source e aqui a gente vai Pô um exclude para excluir a pasta node modules certo esse é o nosso TS config Bem Simples se vocês repararem aqui existem milhares de outras opções olha são muitas opções mesmo não vale a pena eu tentar explicar todas elas aqui né Vocês podem procurar por si mesmo depois na documentação para vocês entenderem o melhor uso de cada uma delas né mas para um projeto simples inicialmente a gente vai utilizar essas opções aqui com o projeto configurado a gente pode fechar isso isso e vamos criar um novo arquivo aqui clica no papelzinho a gente já vai criar dentro de uma pasta é só digitar o nome da pasta separando por barra e aí põe o nome do arquivo index.
