O que é TypeScript?

TypeScript é uma linguagem de programação que ajuda a escrever códigos mais seguros e organizados. Ela é uma versão do JavaScript (que é uma linguagem que roda na web) com algumas melhorias. Essas melhorias incluem a possibilidade de especificar tipos de dados, o que ajuda a evitar erros enquanto você escreve o código.

1. Como Começar com TypeScript

1.1. Instale o Node.js

Antes de mais nada, você precisa do Node.js instalado no seu computador. O Node.js é uma plataforma que permite rodar códigos JavaScript (e TypeScript) fora do navegador.

Você pode fazer o download e instalação do Node.js aqui.

1.2. Criando o Projeto

Vamos criar uma pasta para o seu projeto e configurar o TypeScript:

Abra o terminal e crie uma nova pasta para o projeto:

mkdir meu-projeto-typescript cd meu-projeto-typescript

Inicialize o projeto com o comando abaixo. Isso cria o arquivo package.json, que vai guardar as configurações do seu projeto:

npm init -y

Agora, instale o TypeScript no seu projeto:

npm install --save-dev typescript

Para configurar o TypeScript, vamos rodar o comando para criar o arquivo de configuração:

npx tsc --init

2. Tipos de Dados no TypeScript

Em TypeScript, tipos de dados são usados para definir que tipo de informação você quer guardar em uma variável. Isso ajuda a evitar erros ao longo do desenvolvimento, já que o TypeScript vai alertar você se tentar armazenar algo do tipo errado.

2.1. Tipos Primitivos

Aqui estão os tipos de dados mais comuns que você pode usar:

number: Para números (inteiros ou decimais).
Exemplo:
let idade: number = 25; let preco: number = 19.99;
string: Para texto. Pode ser uma palavra, frase ou qualquer sequência de caracteres.
Exemplo:
let nome: string = "Carlos"; let saudacao: string = "Olá, como você está?";
boolean: Para valores lógicos. Pode ser apenas true ou false.
Exemplo:
let ativo: boolean = true; let concluido: boolean = false;
any: Permite que a variável armazene qualquer tipo de dado (não recomendado, pois perde a segurança do TypeScript).
Exemplo:
let qualquerCoisa: any = 25; // Pode ser número, string, ou qualquer coisa.

2.2. Tipos de Dados Especiais

null e undefined:
- null significa "nenhum valor", ou "sem valor".
- undefined significa que a variável foi declarada, mas ainda não recebeu um valor.
Exemplo:

let algo: null = null; let algoIndefinido: undefined = undefined;

2.3. Tipos de Dados de Objetos

array: Uma lista de elementos. Cada elemento da lista pode ser do mesmo tipo, como números ou texto.
Exemplo de um array de números:

let notas: number[] = [7, 8, 9];

object: Representa um objeto, que pode conter múltiplas propriedades. Por exemplo, um "carro" com propriedades como "cor" e "modelo".
Exemplo:

let carro: object = { cor: "azul", modelo: "Fusca" };

3. Variáveis e Como Usá-las

3.1. O que são Variáveis?

Uma variável é como uma caixa onde você pode guardar um valor. Esse valor pode ser um número, um texto ou qualquer outro tipo de dado. Você dá um nome para essa caixa (a variável) e depois pode acessar ou mudar o valor que ela guarda.

3.2. Como Declarar Variáveis no TypeScript

Para declarar uma variável, usamos o comando let, const ou var. Aqui está o que cada um significa:

let: Usado para declarar variáveis que podem mudar de valor ao longo do tempo.
Exemplo:

let nome: string = "Carlos"; nome = "Maria"; // Agora o valor da variável 'nome' é "Maria"

const: Usado para declarar variáveis cujo valor não pode mudar após ser atribuído.
Exemplo:

const idade: number = 25; // idade = 26; // Erro! Não podemos alterar o valor de 'const'

var: Antigo jeito de declarar variáveis, mas não é recomendado usar em TypeScript.

4. Palavras Reservadas no TypeScript

As palavras reservadas são palavras que o TypeScript (e o JavaScript) já usa para definir coisas importantes, como tipos de dados e estruturas de controle. Você não pode usar essas palavras como nome de variáveis.

Aqui estão algumas das palavras reservadas mais comuns:

let, const, var: Usadas para declarar variáveis.
if, else, switch, case: Usadas para fazer decisões no código (condições).
for, while, do: Usadas para criar laços de repetição (loops).
function: Usada para declarar funções.
return: Usada para retornar valores de uma função.
class, constructor, extends, super: Usadas para criar e trabalhar com classes (conceito de orientação a objetos).
interface, type: Usadas para definir tipos de objetos e tipos customizados.

5. Exemplo Completo de Código

Aqui está um exemplo simples que usa variáveis, tipos de dados e uma condição if:

let nome: string = "Carlos";
let idade: number = 25;
let maiorDeIdade: boolean = idade >= 18;

if (maiorDeIdade) {
  console.log(`${nome} é maior de idade.`);
} else {
  console.log(`${nome} é menor de idade.`);
}

Esse código vai verificar se a pessoa é maior de idade ou não, e imprimir uma mensagem no console.

Agora você tem uma visão geral dos principais conceitos de TypeScript, incluindo:

Tipos de dados: Como números, textos e booleanos.
Variáveis: Como usar let, const e var.
Palavras reservadas: Palavras que o TypeScript já usa, e que não podem ser usadas como nomes de variáveis.

Com isso, você pode começar a escrever seus próprios programas em TypeScript de forma segura e organizada!

Claro! Vamos criar um exemplo simples de Olá Mundo em TypeScript e também vou te explicar como evitar os erros que você encontrou. Vou te guiar passo a passo.

Como Criar um "Olá Mundo" em TypeScript

1. Passo a Passo para Criar o Projeto

1.1. Criando o Projeto e Instalando o TypeScript

Primeiro, crie uma nova pasta para o seu projeto e entre nela:

mkdir meu-olamundo-typescript cd meu-olamundo-typescript

Inicialize o seu projeto com o comando npm init -y. Isso cria o arquivo package.json, onde são armazenadas as configurações do seu projeto:

npm init -y

Instale o TypeScript no seu projeto:

npm install --save-dev typescript

Para gerar o arquivo de configuração do TypeScript, rode o seguinte comando:

npx tsc --init

Isso cria o arquivo tsconfig.json, que vai ajudar a configurar o processo de compilação do TypeScript.

1.2. Criando o Arquivo TypeScript

Agora, vamos criar o arquivo principal que vai conter o código "Olá Mundo".

Crie a pasta src onde vamos colocar nosso código:

mkdir src

Dentro da pasta src, crie o arquivo index.ts com o seguinte conteúdo:

console.log("Olá Mundo!");

1.3. Compilando e Executando o Código

Agora, para compilar o TypeScript e rodar o código, você precisa seguir os seguintes passos.

Compilar o código TypeScript para JavaScript:
No terminal, execute:

npx tsc

Isso vai compilar todos os arquivos .ts para .js. O código JavaScript será gerado na pasta dist, por padrão.
Rodar o código compilado com o Node.js:
O TypeScript gera o arquivo index.js na pasta dist. Agora, execute o código compilado com:

node dist/index.js

Isso deve exibir no terminal:

Olá Mundo!

2. Como Evitar os Erros que Acontecem

Agora que criamos o "Olá Mundo", vamos entender o que pode ter dado errado para você no processo e como evitar que esses erros aconteçam novamente.

2.1. Erro: "ts-node: not found"

Este erro acontece quando você tenta rodar um arquivo TypeScript sem compilar para JavaScript primeiro, ou quando não tem o ts-node instalado.

Solução:

Se você preferir executar diretamente os arquivos .ts, pode instalar o ts-node, que permite rodar arquivos TypeScript sem precisar compilar manualmente:

npm install --save-dev ts-node

Agora, você pode rodar seu código diretamente com o ts-node:

npx ts-node src/index.ts

Isso deve funcionar sem a necessidade de compilar o código com tsc antes.

2.2. Erro: "Unknown file extension .ts"

Este erro ocorre quando você tenta rodar um arquivo .ts sem passar pelo processo correto de compilação.

Solução:

A melhor prática no TypeScript é compilar os arquivos .ts para .js antes de rodá-los. Isso garante que o código seja executado corretamente. Aqui estão os passos que você deve seguir:

Compile os arquivos TypeScript com o comando:

npx tsc

Após a compilação, execute o arquivo JavaScript gerado:

node dist/index.js

Isso vai garantir que você esteja rodando código JavaScript e evitar o erro de extensão desconhecida.

2.3. Erro de Configuração do tsconfig.json

Às vezes, o arquivo tsconfig.json pode não estar configurado corretamente, o que pode causar erros na hora da compilação.

Solução:

Certifique-se de que o seu tsconfig.json tenha as configurações corretas, principalmente as opções outDir e rootDir. O seu arquivo tsconfig.json deve parecer com isso:

{
  "compilerOptions": {
    "target": "ES6",
    "module": "commonjs",
    "outDir": "./dist",       // Pasta onde o código compilado será armazenado
    "rootDir": "./src",       // Pasta onde o código TypeScript está
    "strict": true
  },
  "include": [
    "src/**/*.ts"
  ]
}

Isso garante que todos os arquivos TypeScript da pasta src sejam compilados e armazenados na pasta dist.

3. Dicas Importantes para Evitar Erros no Futuro

Aqui estão algumas dicas para garantir que seu ambiente de desenvolvimento em TypeScript funcione corretamente e evitar os erros mais comuns:

Use sempre tsc para compilar antes de rodar: O processo correto é compilar com tsc e depois rodar o código JavaScript com node.
Considere usar o ts-node para desenvolvimento rápido: Se você quiser rodar diretamente arquivos TypeScript sem compilar, instale o ts-node e use-o para rodar seu código durante o desenvolvimento.
Sempre verifique o tsconfig.json: Esse arquivo é crucial para garantir que o TypeScript seja compilado da maneira correta. Se tiver dúvidas, sempre revise as opções outDir, rootDir e strict.
Mantenha as dependências atualizadas: Verifique regularmente se o TypeScript e o ts-node estão atualizados para evitar erros causados por versões antigas.
Evite usar any em excesso: O any permite que qualquer tipo de dado seja atribuído à variável, o que diminui a segurança do TypeScript. Tente especificar tipos sempre que possível.

Agora você tem um guia completo para criar e executar um programa "Olá Mundo" em TypeScript, além de dicas de como evitar erros como o "ts-node not found" e o "Unknown file extension .ts". Seguindo essas etapas e boas práticas, seu ambiente TypeScript deve funcionar sem problemas!