DEV Community

Cover image for Curso gratuito de Typescript 2025
6

Curso gratuito de Typescript 2025

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.

Image of Timescale

Timescale – the developer's data platform for modern apps, built on PostgreSQL

Timescale Cloud is PostgreSQL optimized for speed, scale, and performance. Over 3 million IoT, AI, crypto, and dev tool apps are powered by Timescale. Try it free today! No credit card required.

Try free

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay