DEV Community

Cover image for Curso gratuito de Typescript 2025
Textos em Português profile image Leandro Lopes
Leandro Lopes for Textos em Português

Posted on

Curso gratuito de Typescript 2025

#typescript #braziliandevs #javascript

Para ajudar você a conquistar seus objetivos em 2025 como Desenvolvedor de Software, estou disponibilizando um curso completo de Typescript totalmente GRATUITO!

📚 O que você vai aprender?
🔷 Aula 001 - Tipos Primitivos
🔷 Aula 002 - Objetos e Arrays
🔷 Aula 003 - Funções
🔷 Aula 004 - Outros tipos
🔷 Aula 005 - Union Types, Type Assertion e Literal Types
🔷 Aula 006 - Inferência de tipo
🔷 Aula 007 - Interface e Types
🔷 Aula 008 - Generics
🔷 Aula 009 - Utility Types
🔷 Aula 010 - Classes (Parte 1)
🔷 Aula 011 - Classes (Parte 2)
🔷 Aula 012 - Dicas Extras
🔷 Aula 013 - Desafio prático

Você vai aprender tudo que você mais vai utilizar ao trabalhar com Typescript no seu dia a dia de forma prática.

Se você já conhece Javascript, o Typescript será um divisor de águas na sua carreira, trazendo mais segurança e escalabilidade ao seu código.

Setup

Antes de iniciar a aula, precisamos primeiro configurar o setup do nosso ambiente de desenvolvimento, instalando e configurando algumas ferramentas que vamos utilizar.

Instalação do Node

Se você não tiver o Node instalado em sua máquina, você pode acessar https://nodejs.org/en/download e fazer a instalação conforme o seu sistema operacional.

Instalação do VS Code

Irei utilizar o VS Code como editor, você pode baixar ele acessando https://code.visualstudio.com.

Instalação do Typescript

Com o Node instalado, podemos inciar o projeto e configurar o Typescript.

Crie uma pasta e abra o terminal nessa pasta recém criada e rode o seguinte comando pressionando ENTER:

npm init -y && code .
Enter fullscreen mode Exit fullscreen mode

Imagem do terminal

O comando irá criar um arquivo package.json e abrir o VS Code na pasta. No VS Code click em View > Terminal para abir o terminal integrado.

Imagem do VS Code

Agora, no terminal integrado do VS Code, rode o seguinte comando:

npm i -D typescript
Enter fullscreen mode Exit fullscreen mode

Imagem do terminal com o comando npm i -D typescript

Esse comando vai instalar o Typescript como uma dependência de desenvolvimento no nosso package.json.

Crie um arquivo chamado tsconfig.json e adicione a seguinte configuração ao arquivo:

{
  "compilerOptions": {
    "rootDir": "./src",
    "outDir": "./dist",
    "target": "ES2020",
    "strict": true,
    "noEmitOnError": true
  }
}
Enter fullscreen mode Exit fullscreen mode

Imagem do arquivo tsconfig.json

O arquivo tsconfig.json serve para configurar o compilador do Typescript, existe diversas configurações que podemos fazer, nesse momento estamos interessado apenas nas seguintes configurações:

  • rootDir - Define o caminho para os arquivos Typescript.
  • outDir - Define a pasta de saida para os arquivos Javascript.
  • target - Define a versão do Javascript que o compilador deve utilizar para compilar os arquivos.
  • strict - Habilita o strict mode.
  • noEmitOnError - Não executa a compilação, caso tenha algum erro de tipo.

Você pode conhecer todas as opções disponíveis, acessando https://www.typescriptlang.org/docs/handbook/compiler-options.html

Acesse o arquivo package.json e crie um novo script para build com o comando:

npx tsc && node ./dist/index.js
Enter fullscreen mode Exit fullscreen mode

Imagem do package.json

O navegador assim como o Node não entende Typescript, precisamos compilar o código Typescript para Javascript para que ele possa entender e executar. Esse comando vai compilar nosso código Typescript para Javascript para que a gente possa executar ele no Node.

Lembre-se, no fim todo o nosso código Typescript vai virar Javascript. Typescript é apenas uma ferramenta utilizada no desenvolvimento para melhorar a segurança de tipo e escalabilidade do nosso código.

Para finalizar, crie uma pasta chamada src e um arquivo index.ts com o seguinte código:

console.log('Hello World')
Enter fullscreen mode Exit fullscreen mode

Imagem do arquivo index.ts

Agora, vamos testar se está tudo funcionado. Abra o terminal e rode:

npm run build
Enter fullscreen mode Exit fullscreen mode

Imagem do terminal executando o comando npm run build

Ao rodar, se tudo estiver certo, você deve ver no terminal Hello World.

Imagem do terminal mostrando a saída do comando npm run build

Sempre que quiser ver algo no console, vai ser preciso rodar esse comando para compilar o arquivo para Javascript, beleza?

Tipos primitivos

Em TypeScript, existem seis tipos primitivos que são: string, number, boolean, symbol, bigint, null e undefined.

const nome: string = 'Leandro'; // Qualquer tipo de string: '' "" ``
const idade: number = 10; // 10, 1.57, -5.55
const adulto: boolean = true; // true ou false
const simbolo: symbol = Symbol('symbol-id');
const big: bigint = 10n;
const nulo: null = null;
const indefinido: undefined = undefined;
Enter fullscreen mode Exit fullscreen mode

String

Uma string é qualquer coisa entre aspas. Pode ser aspas simples ('’), duplas ("”) ou crase ().

Number

Aqui não tem distinção: inteiros, decimais, positivos, negativos, tudo é tratado como number.

Boolean

O clássico verdadeiro ou falso.

Symbol

Um pouco abstrato, mas symbol é um identificador único. Pense nele como uma impressão digital para objetos.

Bigint

Se um number já é grande, o bigint é quase infinito. Use para lidar com números que nem calculadora científica resolve.

Null

Representa uma variável que não possui valor.

Undefined

Representa um valor não inicializado.

Você pode acessar o código da aula, acessando o link abaixo:
https://github.com/d3vlopes/curso-typescript/tree/aula-001

Próxima aula

Na próxima aula, vamos aprender sobre Objetos e Arrays em Typescript.

💡 Dúvidas ou problemas?
Teve algum problema com a configuração do setup? Ficou com alguma dúvida sobre a aula? Coloca aqui nos comentários, vamos juntos construir um material de qualidade e acessível a todos.

Top comments (0)