Git Product home page Git Product logo

curso-typescript-zero-to-hero's Introduction

Curso TypeScript - Zero to Hero

TypeScript Curso

Repositório responsável pelo Curso de TypeScript - Zero to Hero!

Todo o treinamento foi elaborado pela Comunidade para a Comunidade! Assim sendo, distribuindo o conhecimento de maneira totalmente gratuita à todas as Pessoas Desenvolvedoras.

Toda a emenda do treinamento, foi baseada na Documentação oficial do TypeScript! Pois, não existe melhor lugar para estudar e entender uma determinada stack ou linguagem com ajuda da documentação oficial!

📌 Pré-Requisitos

Para a realização desse curso, se faz necessário já possuir conhecimento prévio em JavaScript e Node.Js

Caso não tenha, estamos disponibilizando abaixo, alguns treinamentos prévios, antes de começar a estudar o Curso de TypeScript - Zero to Hero

🏃 Colaboradores

Nesse projeto que estamos desenvolvendo para toda a Comunidade Técnica Brasileira, está sendo desenvolvida por:

Porém, qualquer pessoa da Comunidade que deseja fazer parte desse projeto, nos auxiliando de alguma forma, entre em contato conosco, via DM's das nossas contas do Twitter: AQUI, que será um prazer em ter todos(as) vocês! Pois, acreditamos que, a união de toda a Comunidade é fundamental no compartilhamento de conhecimento!

🚀 Recursos Utilizados

💻 Série de Vídeos

Os vídeos serão lançados semanalmente, de acordo com a demanda através do meu Canal do Youtube.

Quando será o Lançamento desse Curso?

O lançamento dos primeiros vídeos sairão no dia 01/03/2021! E semanalmente estaremos lançando os vídeos aos poucos. Uma vez que o conteúdo é extremamente condensado e existe toda a questão de gravação e edição. Nesse ponto, pedirei paciência a todas as pessoas. Mas, estarei divulgando novos vídeos semanalmente!

✏️ Ementa do Curso

Módulo 1: Introdução à TypeScript
  • 1.1 - O que é TypeScript?
  • 1.2 - Conhecendo o Playground do TypeScript
  • 1.3 - Preparando o Ambiente de Desenvolvimento para o TypeScript
  • 1.4 - Entendendo um pouco mais o arquivo tsconfig.json
  • 1.5 - Demo: Primeiro Programa em TypeScript – Hello World
  • 1.6 - E por que usar o TypeScript? E, próximos passos!
Módulo 2: Tipos Básicos
  • 2.1 - Type Annotation
    • Demo 2.1
  • 2.2 - Boolean
    • Demo 2.2
  • 2.3 - Number & Bigint
    • Demo 2.3
  • 2.4 - String
    • Demo 2.4
  • 2.5 - Array
    • Demo 2.5
  • 2.6 - Tuple
    • Demo 2.6
  • 2.7 - Enum
    • Demo 2.7
  • 2.8 - Unknown
    • Demo 2.8
  • 2.9 - Any
    • Demo 2.9
  • 2.10 - Void
    • Demo 2.10
  • 2.11 - Null and Undefined
    • Demo 2.11
  • 2.12 - Never
    • Demo 2.12
  • 2.13 - Object
    • Demo 2.13
Módulo 3: Fluxos de Controle
  • 3.1 - Condicional if...else
    • Demo 3.1
  • 3.2 - Condicional switch... case
    • Demo 3.2
  • 3.3 - Condicional for
    • Demo 3.3
  • 3.4 - Condicional while
    • Demo 3.4
Módulo 4: Funções/Functions
  • 4.1 - Introdução à Funções/Functions
    • Demo 4.1
  • 4.2 - Optional Parameters
    • Demo 4.2
  • 4.3 - Default Parameters
    • Demo 4.3
  • 4.4 - Rest Parameters
    • Demo 4.4
  • 4.5 - Uso do ‘this’ e Arrow Functions
    • Demo 4.5
  • 4.6 - this Parameters
    • Demo 4.6
  • 4.7 - this Parameters em Callbacks
    • Demo 4.7
  • 4.8 - Function Overloadings
    • Demo 4.8
Módulo 5: Classes
  • 5.1 - Introdução à Classes
    • Demo 5.1
  • 5.2 - Modificadores de Acesso em TypeScript
    • Demo 5.2
  • 5.3 - Modificadores readonly
    • Demo 5.3
  • 5.4 - Uso dos Getters & Setters
    • Demo 5.4
  • 5.5 - Herança
    • Demo 5.5
  • 5.6 - Métodos & Propriedades estáticas
    • Demo 5.6
  • 5.7 - Classes Abstratas
    • Demo 5.7
Módulo 6: Interfaces
  • 6.1 - Introdução à Interfaces
    • 6.1.2 - Optional Properties
    • 6.1.3 - Propriedades Readonly
    • 6.1.4 - Function Types
    • 6.1.5 - Class Types
      • Demo 6.1
  • 6.2 - Extensão de Interfaces
    • 6.2.1 - Extensão de uma Interface
    • 6.2.2 - Extensão de Múltiplas Interfaces
    • 6.2.3 - Uso do Omit em Interfaces
      • Demo 6.2
Módulo 7: Tipos Avançados & Novos Operadores
  • 7.1 - Intersection Types
    • Demo 7.1
  • 7.2 - Union Types
    • Demo 7.2
  • 7.3 - Type Guards
    • Demo 7.3
  • 7.4 - Type Casting
    • Demo 7.4
  • 7.5 - Type Assertions
    • Demo 7.5
  • 7.6 - Conditional Types
    • Demo 7.6
  • 7.7 - Mapped Types
    • Demo 7.7
  • 7.8 - Satisfies Operator
    • Demo 7.8
Módulo 8: Generics
  • 8.1 - Introdução a Generics em TypeScript
    • Demo 8.1
  • 8.2 - Trabalhando com Tipos de Variáveis - Genéricas
    • Demo 8.2
  • 8.3 - Generic Types
    • Demo 8.3
  • 8.4 - Generic Classes
    • Demo 8.4
  • 8.5 - Generic Constraints
    • Demo 8.5
  • 8.6 - Generic Interfaces
    • Demo 8.6
Módulo 9: Módulos
  • 9.1 - Introdução à Modules no Typescript (todos os tópicos abaixo já numa única aula)
    • 9.1.2 - Usando Function Modules
    • 9.1.3 - Default Exports
    • 9.1.4 - Class Modules
    • 9.1.5 - Usando aliases Class Modules em TypeScript
Módulo 10: TypeScript em Node.js
  • 10.1 - Como podemos usar o Node.js com TypeScript + Express.Js
    • Demo 10.1
Extras: Pós finalização do curso!
  • 11.1 -

❗️ Links & Recursos Importantes

❓ Tenho Dúvidas... O que Faço?!

Caso tenham dúvidas aos códigos desenvolvidos durante a série de vídeos, sintam-se à vontade em abrir uma ISSUE AQUI. Assim que possível, estaremos respondendo a todas as dúvidas que tiverem!

curso-typescript-zero-to-hero's People

Contributors

afmpjr avatar glaucia86 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

curso-typescript-zero-to-hero's Issues

Configuração do compilador

ts-node' n�o � reconhecido como um comando interno
ou externo, um programa oper�vel ou um arquivo em lotes.

[Done] exited with code=1 in 0.067 seconds

Duplicação na Compilação de TS para JS (es2017)

Olá Gláucia! Espero que esteja tudo bem por ai.

Eu procurei informação a respeito dessas dúvidas, mas não consegui localizar nada que falasse a respeito. Não sei dizer se tem algum problema com meu compilador ou se esse seria um comportamento esperado.

Você poderia me ajudar a entender ou indicar alguma leitura que fale a respeito?

CasesCompilation

Dúvida sobre tipo primitivo number

Olá Gláucia, tudo bem?

Primeiramente gostaria de agradecer pelo curso, conteúdo completo e você explica muito bem! Estou com uma dúvida em relação ao tipo number, no vídeo número 12 você aborda sobre esse tipo e faz alguns exemplos utilizando números hexadecimais, octais e binário mas no console não era impresso o que você usou nos exemplos.

Exemplo:
const number4: number = 0b110001; e o no console imprimia 49

queria entender esse comportamento, por que ele converte os números para inteiros?

Pergunta da Comunidade [Jhean Brizadao]: Glaucia, valeu pela aula, mas fiquei com uma dúvida sobre Omit! Quando utiliza Omit com herança, o segundo parametro que é a propriedade tem funcionalidade de mudar o type ? mas se colocar sem herança tem a funcionalidade de excluir a propriedade e herda o resto ?

pergunta inerente a Aula - 79

Oi, Jhean. Tudo bem? Desculpa pela demora na resposta!
No TypeScript, o tipo de utilitário Omit é usado para criar um novo tipo excluindo propriedades especificadas de um tipo existente. O segundo parâmetro de Omit representa as propriedades a serem omitidas.

Ao usar Omitir com herança, o segundo parâmetro permite excluir propriedades do tipo base e também alterar o tipo das propriedades no tipo derivado. Isso significa que você pode excluir propriedades e substituir seus tipos no tipo resultante.

Aqui está um exemplo para ilustrar isso:

interface Base {
  prop1: string;
  prop2: number;
}

interface Derived extends Omit<Base, 'prop2'> {
  prop1: number;
}

const obj: Derived = {
  prop1: 123,
};

Neste exemplo, Derived estende Base usando Omit e exclui a propriedade prop2 do tipo base. Além disso, a propriedade prop1 em Derived é substituída para ter um tipo number em vez de string.

No entanto, ao usar Omit sem herança, ele simplesmente exclui as propriedades especificadas do tipo e o tipo resultante inclui todas as outras propriedades. Nesse caso, não há funcionalidade para alterar o tipo das propriedades.

Aqui está um exemplo de uso de Omit sem herança:

interface Example {
  prop1: string;
  prop2: number;
  prop3: boolean;
}

type NewExample = Omit<Example, 'prop2'>;

const obj: NewExample = {
  prop1: 'Hello',
  prop3: true,
};

Neste caso, NewExample é criado omitindo a propriedade prop2 de Example. O tipo resultante NewExample terá prop1 e prop3, herdando seus tipos originais de Example.

Portanto, em resumo,

  • Ao usar Omit com herança, o segundo parâmetro permite excluir propriedades e alterar seus tipos.
  • Sem herança, Omit simplesmente exclui as propriedades especificadas enquanto mantém o restante do tipo intacto.

Deixo aqui uma referência de artigo complementar sobre o Omit: aqui

Pergunta da Comunidade [Felipe Carvalho]: Boa tarde Glaucia, queria saber qual seria a diferença se ao invés de eu utilizar essa interseção, eu criasse outra interface que herda as propriedades de todas as outras, o resultado não seria o mesmo?

No TypeScript, existem duas maneiras de combinar propriedades de várias interfaces em uma única interface: interseção de tipos (intersection) e herança de tipos (extends). Embora essas duas abordagens possam parecer semelhantes, elas têm diferenças significativas.

A interseção de tipos (intersection) permite combinar várias interfaces em uma única interface. Quando você usa a interseção de tipos, a nova interface conterá todas as propriedades de cada interface envolvida na interseção. Por exemplo:

interface InterfaceA {
  propA: number;
}

interface InterfaceB {
  propB: string;
}

type CombinedInterface = InterfaceA & InterfaceB;

// CombinedInterface contém as propriedades propA e propB

Por outro lado, a herança de tipos (extends) permite que uma interface herde as propriedades de outra interface. Quando você usa a herança de tipos, a nova interface terá todas as propriedades da interface pai (super) e da interface filha (sub). Por exemplo:

``ts
interface InterfaceA {
propA: number;
}

interface InterfaceB extends InterfaceA {
propB: string;
}

// InterfaceB contém as propriedades propA e propB


Em geral, a herança de tipos (extends) é uma abordagem mais simples e mais limpa para combinar interfaces em hierarquias, especialmente quando você tem uma relação de "é um" entre as interfaces envolvidas. A interseção de tipos (intersection), por outro lado, é mais adequada para combinar interfaces independentes que não têm uma relação de herança clara entre elas.

Em resumo, se você tiver uma hierarquia clara entre suas interfaces e uma interface pode ser considerada uma extensão da outra, é mais apropriado usar a herança de tipos (extends). Caso contrário, a interseção de tipos (intersection) pode ser mais adequada.

Curso

Parece legal vou fazer

passando o object como tipo diretamente pra função

Se eu passo o type object pro funcionario e tento acessar a string nome, recebo o erro que a propriedade nome nao existe no tipo
mas se eu declarar o type do funcionario como typeof pessoa (um objeto criado com a propriedade nome) para de dar erro. Por que isso acontece?
exemplo 1: function onboarding01 (funcionario: object) {
return funcionario.nome
}
exemplo 2: function onboarding02 (funcionario: typeof pessoa) {
return funcionario.nome
}

5.4 - Uso dos Getters & Setters / Demo 5.4

Olá Gláucia. Estou agora terminando a aula 57 do curso e apesar de ter visto aqui no github que o código está correto, no exemplo 04: Set/Get da aula 57 a alteração de dados de 'Sistema da Informação' para 'Análise e Desenvolvimento de Sistemas' não está sendo feita pelo método set cursoS.
Como o video já está gravado, imagino que possa ser interessante colocar uma nota escrita somente.

De já agradeço pelo conteúdo disponibilizado.

Transpile the typescript file directly in the terminal

Colocando essas regras no settings.json do vscode usando a extensão code runer é possível ouvir as modificações do arquivo typescript em tempo de execução("ctrl"+"s")

É recomendado ter o ts-node-dev instalado globalmente
npm install -g ts-node-dev

//code runner
  "code-runner.executorMap": {
    "typescript": "ts-node-dev --inspect --transpile-only --respawn"
  },
  "code-runner.runInTerminal": true,

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.