Microsoft cria proposta de tipagem para o JavaScript

A proposta planejada pela Microsoft e outros, incluindo desenvolvedores do programa Igalia Coding Experience e da Bloomberg, trata de adicionar “tipos como comentários” à linguagem.

A teoria é que seria possível ter uma sintaxe para tipos que poderiam ser usados ​​por ferramentas que precisam desses ganchos (como o próprio TypeScript da Microsoft) e ignorados por aqueles que não precisam.

Para ver a proposta orgina, clique aqui: https://devblogs.microsoft.com/typescript/a-proposal-for-type-syntax-in-javascript/

Em Resumo

“A ideia desta proposta”, disse Rosenwasser, “é que o JavaScript poderia criar um conjunto de sintaxe para tipos que os mecanismos ignorariam completamente, mas que ferramentas como TypeScript, Flow e outras poderiam usar”.

Rosenwasser foi rápido em enfatizar que a proposta não é colocar a verificação de tipo TypeScript em cada runtime JavaScript (certamente, pode-se imaginar todos os tipos de problemas de compatibilidade no futuro), em vez disso, o plano é que a abordagem seja escolhida por qualquer tipo verificador, não apenas os gostos de TypeScript.

Também ainda é apenas uma proposta no momento, prevista para a Etapa 1 do processo ECMA TC39. Há, portanto, muitos obstáculos pela frente antes que o conceito (se aceito) chegue à forma ECMAScript e muitas oportunidades para debate.

No entanto, a julgar pelas respostas de pouco mais de 16.000 desenvolvedores que responderam a perguntas na pesquisa State of JavaScript de 2021, há apetite por algum tipo de funcionalidade de tipo. A proposta dos desenvolvedores é um primeiro passo no caminho.

Princípios do SOLID com TypeScript – SRP

Veja nesse artigo uma rápida introdução ao SOLID e um exemplo prático sobre o SRP (Principio da responsabilidade unica) utilizando TypeScript

Introdução

Fala galera tudo bem? Aproveitando que estamos iniciando uma serie de podcasts sobre os princípios do SOLID no nosso canal DEVSHOW.

  • O (OCP) Princípio Aberto-Fechado
  • L (LSP) Princípio da Substituição de Liskov
  • I (ISP) Princípio da Segregação da Interface
  • D (DIP) Princípio da inversão de dependência

Principio da Responsabilidade Única (SRP)

Esse é o primeiro principio e na minha opinião o mais simples e o mais importante, ele diz que uma classe deve ter apenas um motivo para mudar” ou sejadeve ter apenas uma responsabilidade. Caso a sua classe tenha mais de uma razão para mudar, ela está fazendo mais de uma coisa, logo quebrando esse principio.

import * as express from "express";
import * as bodyParser from "body-parser";
import * as nodemailer from "nodemailer";
import config from '../config/configs';


class App {

    public app: express.Application;

    constructor() {
        this.app = express();
        this.app.use(bodyParser.json());
        this.routes();
    }
    routes() {

        this.app.route("/").get((req, res) => {
            res.send({ 'result': 'version 0.0.2' })
        });

        this.app.route("/").post((req, res) => {
            const message = Object.assign({}, req.body);
            let result = this.sendMail(message.to, message.subject, message.message);
            res.status(200).json({ 'result': result })
        });
    }


    sendMail(to?: string, subject?: string, message?: string) {

        let mailOptions = {
            from: "",
            to: to,
            subject: subject,
            html: message
        };

        const transporter = nodemailer.createTransport({
            host: config.host,
            port: config.port,
            secure: false,
            auth: {
                user: config.user,
                pass: config.password
            },
            tls: { rejectUnauthorized: false }
        });

        transporter.sendMail(mailOptions, function (error, info) {
            if (error) {
                return error;
            } else {
                return "E-mail enviado com sucesso!";
            }
        });
    }
}

export default new App();
  • O método de envio de e-mail deveria estar em uma outra classe separada
import * as nodemailer from "nodemailer";
import config from './config/configs';

class Mail {

    sendMail(to?: string, subject?: string, message?: string) {

        let mailOptions = {
            from: "",
            to: to,
            subject: subject,
            html: message
        };

        const transporter = nodemailer.createTransport({
            host: config.host,
            port: config.port,
            secure: false,
            auth: {
                user: config.user,
                pass: config.password
            },
            tls: { rejectUnauthorized: false }
        });

        transporter.sendMail(mailOptions, function (error, info) {
            if (error) {
                return error;
            } else {
                return "E-mail enviado com sucesso!";
            }
        });
    }

}

export default new Mail;
import * as express from "express";

const indexRouter = express.Router();

indexRouter.route("/").get((req, res) => {
    res.send({ 'result': 'version 0.0.3' })
});

export default indexRouter;

emailRouter.ts

import * as express from "express";
import mail from "../mail";

const emailRouter = express.Router();

emailRouter.route("/").post((req, res) => {
    const message = Object.assign({}, req.body);
    let result = mail.sendMail(message.to, message.subject, message.message);
    res.status(200).json({ 're sult': result })
});

export default emailRouter;

E por fim atualizamos o arquivo app.ts com o seguinte trecho de código:

import * as express from "express";
import * as bodyParser from "body-parser";
import indexRouter from "../router/indexRouter";
import emailRouter from "../router/emailRouter";


class App {
    public app: express.Application;

    constructor() {
        this.app = express();
        this.app.use(bodyParser.json());
        this.routes();
    }
    routes() {     
        this.app.use("/", indexRouter);
        this.app.use("/", emailRouter);      
    }
}

export default new App();

Gostou deste artigo? Comente abaixo!

Referência: https://programadriano.medium.com/princ%C3%ADpios-do-solid-com-typescript-1e585c6eeb5e

Princípios do SOLID com TypeScript – OCP

Veja nesse artigo um exemplo prático do principio OCP — Princípio Aberto-Fechado

Introdução

Dando continuidade a minha série de artigos sobre os princípios do SOLID com TypeScript e aproveitando a liberação do episódio 2 do nosso podcast: DevShow #22 SOLID OCP. Hoje irei abordar o segundo principio do SOLID, OCP.

Image for post

enum TipoDeArquivo {
    pdf,
    excel
}


class Arquivos {
    Exportar(arquivo: TipoDeArquivo, data: any) {

        if (arquivo == TipoDeArquivo.excel) {
            // exportar data para excel
        }

        if (arquivo == TipoDeArquivo.pdf) {
            // exportar data para pdf
        }
    }
}
enum TipoDeArquivo {
    pdf,
    excel,
    word
}


class Arquivos {
    Exportar(arquivo: TipoDeArquivo, data: any) {

        if (arquivo == TipoDeArquivo.excel) {
            // exportar data para excel
        }

        if (arquivo == TipoDeArquivo.pdf) {
            // exportar data para pdf
        }

        if (arquivo == TipoDeArquivo.word) {
            // exportar data para word
        }

    }
}
abstract class Arquivos {
    Exportar(data: any) { }
}


class GerarExcel extends Arquivos {
    Exportar(data: any) {

    }
}

class GerarPDF extends Arquivos {
    Exportar(data: any) {

    }
}

class GerarWord extends Arquivos {
    Exportar(data: any) {

    }
}

Gostou deste artigo? Comente abaixo!

Referência: https://programadriano.medium.com/princ%C3%ADpios-do-solid-com-typescript-2c6a4911242d

Upload de arquivos com TypeScript + Node.js + Azure Storage

Veja nesse artigo como criar um projeto para upload de arquivo utilizando Node.js + TypeScript e Azure. A seguir você tem dois links demonstrando um passo a passo do upload para uma pasta até o envio para o Azure Storage e depois alguns vídeos demonstrando a construção de um middler.

Introdução do módulo

Node.js + TypeScript: Criação de um middler

TypeScript + Nodejs: Criação de middler para upload de arquivos

Testando o nosso projeto

Gostou deste artigo? Comente abaixo!

Publicando projeto Docker + Node.js + TypeScript + MongoDB No Azure

Veja nessa artigo alguns links sobre como publicar o seu projeto Node.js, TypeScript e MongoDB com Docker e Docker Compose no Azure

O próximo passo será acessar a sua conta do Azure. Caso ainda não tenha uma, você pode criar através do seguinte link: Crie sua conta Azure Grátis.

Benefícios Visual Studio Dev Essentials

A seguir você tem o exemplo do arquivo Docker Compose que eu irei utilizar para publicar o meu projeto no Azure:

version: "3"
services:
  api:
    image: tadrianonet/api-ts
    ports:
      - "80:3050"
    links:
      - link-db
  link-db:
    image: tutum/mongodb
    ports:
      - "27017:27017"
      - "28017:28017"
    environment:
      - AUTH=no

Deploy no Azure Web Apps for Containers

Testando aplicação na Nuvem

Bom galera, com isso liberamos mais um módulo sobre Docker do Curso “Criando API’s RESTful utilizando TypeScript, Node.js, mongoDB”.

Espero que gostem e até um próximo artigo pessoal 😉

Referências: https://programadriano.medium.com/publicando-projeto-docker-node-js-typescript-mongodb-no-azure-608d8fa54246

 

Trabalhando com Docker + Node.js + TypeScript + MongoDB

Veja nessa artigo alguns links sobre como trabalhar com Docker e o Docker Compose em um projeto desenvolvido com Node.js, TypeScript e MongoDB

Abaixo vocês tem os links do módulo como trabalhar com Docker do meu Curso Criando API’s RESTful utilizando TypeScript, Node.js, mongoDB

Espero que tenham gostado e até um próximo artigo pessoal 🙂

Referência: https://medium.com/typescript/trabalhando-com-docker-node-js-typescript-mongodb-a341d42e1fc0

[TypeScript] no TDC São Paulo Online 2020

Na data do dia 26/08/2020 eu tive a oportunidade de palestrar no TDC são Paulo Online 2020.

Gostaria de agradecer ao Jackson Feijó, Adriano Rodrigues e à Talitha Barcellos que coordenaram as apresentações na Sala Microsoft pela oportunidade em participarmos como palestrantes nesta edição TDC.

A seguir vocês tem alguns links do material utilizado na minha apresentação:

Slides da minha apresentação:

Prints de tela retirado por amigos 😉

Image for post
Image for post
Image for postImage for post

Curso: Criando API’s RESTful utilizando TypeScript, Node.js, mongoDB, Redis e Docker no Azure – Parte 2

2-Parte: Configurando o ambiente de banco de dados com Docker

Dando continuidade a liberação dos módulos do meu curso: Criando API’s RESTful utilizando TypeScript, Node e mongoDB, hoje eu irei demonstrar como subir um ambiente Docker com o MongoDB e como acessar essa base de dados.

Caso você seja iniciante em Docker, eu recomendo a leitura do seguinte artigo: Comando básicos docker.

Artigo contendo um passo a passo de como configurar um ambiente MongoDB com Docker: Docker: Criando servidor MongoDB

Configurando ambiente de banco de dados MongoDB com Docker

Acessando a base de dados mongoDB

Link para download do Robo 3T: Download

Espero que gostem e qualquer dúvida podem postar aqui ou no vídeo do Youtube.

Gostou deste artigo? Comente abaixo!

Referência: https://medium.com/xp-inc/curso-criando-apis-restful-utilizando-typescript-node-js-mongodb-redis-e-docker-no-azure-6bb8a0d04a4e

Curso: Criando API’s RESTful utilizando TypeScript, Node.js, mongoDB, Redis e Docker no Azure Parte 1

Para aqueles que colocaram como meta aprender algo novo na area de programação em 2020, eu estou disponibilizando alguns módulos do meu curso: Criando API’s RESTful utilizando TypeScript, Node e mongoDB.

Segue abaixo as primeiras video aulas liberadas 🙂

Introdução ao curso:

Ambiente de desenvolvimento:

Instalação do Node.js

Instalação do TypeScript

Aproveitando, segue link para download das ferramentas que nós iremos utilizar nesse curso abaixo:

Espero que gostem 🙂

Referência: https://medium.com/xp-inc/curso-criando-apis-restful-utilizando-typescript-node-js-mongodb-redis-e-docker-no-azure-152edbcc1f2c

Nova versão – MOBX 6

O MobX é uma biblioteca responsável por gerenciamento de estado simples e escalável. Aplica este gerenciamento e escalonamento de forma transparente a programação reativa funcional.

O MobX já possui 5 anos. Já foi adotado por empresas como Microsoft(Outlook), Netflix, Amazon e E.A. Games (Battlefield). Ele possui a mesma filosofia desde o início. Se algo pode ser derivado pelo estado do aplicativo, será derivado automaticamente.

Em contraste a isso, o ecossistema JavaScript mudou significativamente ao longo dos anos. No entanto, propostas do JavaScript como observables, Object.observe e decorators nunca foram materializados. O MobX 6 é uma versão que não traz muitos novos recursos, mas sim uma consolidação em consideração ao estado atual do JavaScript.

Adeus Decorators!

Usar decorators não é mais regra no MobX. Quando começou, o MobX era um projeto do TypeScript e utilizava decorators. Atualmente, as implementações experimentais do decorator são incompatíveis com a proposta de campos de classe que logo será padronizada. As implementações de decorator legado (Babel) e experimental (TypeScript) não serão capazes de interceptar inicializações de campos de classe. Mas como ficará o MobX depois dos decorators?

Em vez de usar decorator nos membros durante a definição de classe, os membros da instância precisam  ser anotados no construtor, usando o utilitário makeObservable.

import {observable, computed, action, makeObservable} from "mobx"

// Antes:
class TodoStore {
    @observable
    todos: Todo[] = []

    @computed
    get unfinishedTodoCount() {
        return this.todos.filter(todo => !todo.done).length
    }

    @action
    addTodo(todo: Todo) {
        this.todos.push(todo)
    }
}

// Depois:
class TodoStore {
    todos: Todo[] = []

    constructor() {
        makeObservable(this, {
            todos: observable,
            unfinishedTodoCount: computed,
            addTodo: action
        })
    }

    get unfinishedTodoCount() {
        return this.todos.filter(todo => !todo.done).length
    }

    addTodo(todo: Todo) {
        this.todos.push(todo)
    }
}

O makeObservable não requer configurações de compilação sofisticadas. Migrar uma base de código que use diversos decorators para makeObservable pode ser um desafio. O MobX vem com um mod de código para fazer isso automaticamente. Utilizando o comando:

npm mobx-undecorate

Utilizando este comando, todos os decorators da pasta de origem serão reescritos automaticamente! Depois, atualize sua configuração TypeScript/Babel e estará tudo pronto para prosseguir.

Documentação nova!

Com a retirada da norma de utilização de decorators, a documentação foi revisada e reestruturada, sendo mais curta, com menor repetição e discutindo melhor os cenários comuns.

Suporte a navegador aprimorado

O MobX 6 suporta mais mecanismos JavaScript que o MobX 5. O 5 exigia suporte de proxy, tornando-o inadequado para Internet Explorer e React Native, por isso, o Mobx 4 era mantido ativamente. No entanto, o MobX 6 substitui os dois. Ele ainda exigirá Proxies, mas será possível cancelar o uso do Proxy caso precise oferecer suporte a mecanismos mais antigos.

Você pode verificar mais novidades em:

Gostou desta notícia? Comente abaixo!

Referência: https://michel.codes/blogs/mobx6