Arquitetura de Software: O conceito que parte do Bloco de notas!

@WellsSA

Wellington S. Almeida

@WellsSA

  • Typescript Fullstack Developer 
  • CTO & Co-founder at @Envia.io
  • Community Manager at @FlutterNation
  • Designer, maybe?
  • Speaker? @icarcal
  • Music? Let's Rock!

ETEC Everywhere

@WellsSA

@WellsSA

Antes de tudo

@WellsSA

Então por quê não aproveitar isso?

@WellsSA

Agora com exemplos!

@WellsSA

Tomada de decisões

@WellsSA

Abstração

@WellsSA

Tecnologias

Conceitos

A princípio

Partindo do básico

@WellsSA

Um algoritmo: Recuperação de senha

Por onde começar?

@WellsSA

Como funciona a recuperação de senha?

 

Em que parte do meu software isso fica?

 

Quais serviços eu vou precisar usar?

 

O quê são serviços?

Comece por você!

@WellsSA

Nem sempre você vai saber de tudo

E essa é a idéia!

Organização                                 foco

@WellsSA

Problemão

Probleminha

Probleminha

Probleminha

Probleminha

Probleminha

Problem

Como assim foco?

@WellsSA

  • We are humans

Temos limites!

@WellsSA

  • A parte biológica importa

Existem técnicas! 

@WellsSA

  • Já diziam os sábios do SCRUM

E eis que chega nossa área

@WellsSA

Código não importa!*

*No geral

@WellsSA

Mas calma lá!

Antes de vocês usarem o slide passado como desculpa pra fazer gambiarras...

Vamos às explicações!

@WellsSA

Vamos parar pra pensar

@WellsSA

Farmácia

Padaria

Oooou seja:

@WellsSA

No fundo o código é o mesmo

+

O que muda é o quê você faz com ele!

=

O que importa é a idéia!

E como ninguém pensou isso antes?

@WellsSA

E a resposta é: pensaram!

@WellsSA

@WellsSA

No início

"Lá em 1800 e Chicão era     jovem" - Correa, Cristiano

@WellsSA

Programação Estruturada

meu programa;

int variável;
String variável2;

begin
    # um monte de código
    # mais código
    # sério, muito código
    # mais um pouquinho de código
    # já disse que tem código?
    # pode acreditar, código mesmo
	...
end

@WellsSA

Programação Orientada a Objetos

class Ornitorrinco {
    String nome;
    int idade;
}
function alimentar(Ornitorrinco o, Alimento b) {
    // M A G I A
    // mentira, mais código mesmo
}
class Batata extends Alimento {
    // Exemplo meramente ilustrativo
    // Tipo foto de alimento
}

@WellsSA

ISSO É MUITO ÚTIL

// Antes
[1, 2, 3, 4, 5]

// Depois
[Ornitorrinco, Ornitorrinco, Ornitorrinco, Ornitorrinco]
[
    {
        nome: 'Zé',
        idade: 15,
    }, 
    {
        nome: 'Zezim',
        idade: 3,
    }, 
]

@WellsSA

Programação Funcional

var x = 2;
var y = 3;
var resultado;

function somar() {
    resultado = x + y;
}

function causarDiscordia() {
    x = x + 10;
}

causarDiscordia();
somar();
const x = 2;
const y = 3;

function somar(x, y) {
    return x + y;
}

const resultado = somar(x, y);

Antes

Depois

Stateless / Immutable

@WellsSA

O quê, não como

Usuário

(zezim@gmail.com)

Chama o servidor

Backend

Frontend

(auth=chave)

Acessa o site

Envia um e-mail

(http://meuSite?auth=chave)

@WellsSA

O quê, não como

const meuEmail = 'zezim123@gmail.com';

function recuperarSenha(email) {
    // 1. Validar o e-mail

    // 2. Se o e-mail estiver certo, pegar os dados do usuário
    
        // 3. Gerar chave de acesso única
    
        // 4. Preparar mensagem
    		
        // 5. Enviar e-mail com a mensagem  
}

@WellsSA

O quê, não como

const meuEmail = 'zezim123@gmail.com';

function recuperarSenha(email) {
    // 1. Validar o e-mail
    const deuBom = validaEmail(email);

    // 2. Se o e-mail estiver certo, pegar os dados do usuário
    if(deuBom === true) {
        const meuUsuario = procuraUsuarioPorEmail(email);

        // 3. Gerar chave de acesso única
        const token = gerarToken(meuUsuario.id);

        // 4. Preparar mensagem
        const mensagem = 
            'Para alterar sua senha clique em http://meusite.com?auth=' + token;
			
        // 5. Enviar e-mail com a mensagem
        const email = enviarEmail(email, mensagem);
    }
}

Beleza! Convenci vocês que código não importa?

Então de volta ao mundo das idéias!

@WellsSA

O que um desenvolvedor faz? 

Somos

entrada, processamento ou saída?

@WellsSA

Que tal uma outra perspectiva? 

Um médico:

✓ Recebe os sintomas

✓ Analisa com base no que estudou

✓Dá um diagnóstico

@WellsSA

Que tal uma outra perspectiva? 

Um artista gráfico:

✓ Recebe as especificações

✓ Pensa em algo com base no que estudou

✓Retorna uma série de sketches

@WellsSA

Que tal uma outra perspectiva? 

Um arquiteto/engenheiro:

✓ Preciso mesmo dar esse exemplo?

✓ Acho que vocês já sacaram, né?

✓É exatamente isso!

@WellsSA

Notaram algum padrão? 

 

Todas fazem uso do que você tem de mais importante:

Seu cérebro!

 

Nós somos o processamento!

@WellsSA

Então adivinhem? 

Programar é um processo criativo!

Você precisa pensar!

@WellsSA

Pensar é o principal!

Lembram que a parte biológica importa?

Poisé!

Pensar cansa!

@WellsSA

Você precisa poupar seu cérebro!

Quanto mais responsabilidade você tirar dele, melhor!

COMO!?!?

@WellsSA

FOCO!!!!

@WellsSA

Código??

Idéia!!

  • Organize as idéias!!
  1. O quê você quer fazer?
  2. Como você quer fazer?

@WellsSA

Sem uma linha de código!

E mais importante:

  • Vamos simplificar pra focar em outro exemplo

@WellsSA

Que tal um programa que calcula média?

Qual a minha idéia?? O que eu tenho que fazer??? 

+ Receber as notas dos alunos e mostrar a média

E o que eu preciso fazer, em etapas, pra isso acontecer??

# Receber os valores

e depois??

# Calcular a média 

e depois??

# Mostrar isso pro usuário
  • Então temos...

@WellsSA

Resumidamente

+ Receber as notas dos alunos e mostrar a média

# Receber os valores

# Calcular a média 

# Mostrar isso pro usuário
  • Agora temos uma visão geral

@WellsSA

E podemos elaborar um pouco mais

+ Receber as notas dos alunos e mostrar a média

# Receber os valores

# Calcular a média 
	- (soma das entradas) dividido por (quantidade de entradas)
    - fórmula: (entrada + entrada) / quantidadeDeEntradas
    - ex.: (10 + 5) / 2

# Mostrar isso pro usuário

Por exemplo:

  • E agora podemos entender melhor o cenário

@WellsSA

+ Receber as notas dos alunos e mostrar a média

# Receber os valores
	- 2 notas (de 0 a 10)
    
# Calcular a média 
	- (soma das entradas) dividido por (quantidade de entradas)
    - fórmula: (entrada + entrada) / quantidadeDeEntradas
    - ex.: (10 + 5) / 2

# Mostrar isso pro usuário

Quantos valores vamos receber?

1? 2? 3? vários?

  • E agora pensar um pouco mais em como deve ser o resultado

@WellsSA

+ Receber as notas dos alunos e mostrar a média

# Receber os valores
	- 2 notas (de 0 a 10)
    
# Calcular a média 
	- (soma das entradas) dividido por (quantidade de entradas)
    - fórmula: (entrada + entrada) / quantidadeDeEntradas
    - ex.: (10 + 5) / 2

# Mostrar isso pro usuário
	- Mostrar no console

Como vamos mostrar isso pro usuário?

Console? Página web?

  • Agora eu pergunto:

@WellsSA

Em qual linguagem fizemos isso?

Nenhuma!

Porque

O código

Não

Importa!

  • Agora que já mapeamos o problema

@WellsSA

Podemos pensar em qual é o melhor jeito de fazer isso

Não estamos presos à tecnologia nenhuma!

E focar em cada uma dessas etapas

  • Vocês concordam que...

@WellsSA

#Receber valores

Nós sabemos como procurar a informação em etapas!

Google:

  • Como receber valores em Java?
  • Como receber valores em Python?
  • Como receber valores em NodeJS?

 

  • Ou seja:

@WellsSA

Temos um guia de como fazer o projeto

Nós podemos aprender em etapas cada parte do projeto!

  • Isso nos possibilita descobrir o que precisamos em etapas
  • testar o que estamos fazendo em etapas 
  • Fez? Testou? Funcionou? Próximo!

@WellsSA

  • Não sei receber entradas do usuário em python
  • Procurei no google, testei, aprendi, tá e agora?

Você tem um guia preparado e já pensou na próxima etapa!

  • Não importa o quanto seja difícil essa etapa, nem quanto tempo você passou focado nisso
  • A próxima etapa!

@WellsSA

  • Só checar o bloco de notas!
  • #calcular a média

Seu cérebro agradece!

  • Agora, senhoras e senhores

@WellsSA

Vocês aprenderam a aprender!

Mas não só isso!

  • Lembram do nosso guia?

@WellsSA

+ Receber as notas dos alunos e mostrar a média

# Receber os valores
	- 2 notas (de 0 a 10)
    
# Calcular a média 
	- (soma das entradas) dividido por (quantidade de entradas)
    - fórmula: (entrada + entrada) / quantidadeDeEntradas
    - ex.: (10 + 5) / 2

# Mostrar isso pro usuário
	- Mostrar no console

Aquele que foi feito em nenhuma linguagem?

  • Agora vocês estão livres pra pensar!!

@WellsSA

  • Eu tenho que mostrar a média no console:
    • qual a melhor linguagem/tecnologia pra mostrar algo no console?
  • ​Eu tenho que receber 2 valores:
    • ​qual a melhor linguagem/tecnologia pra  receber 2 valores? Ou, de repente, múltiplos valores?
  • Vocês percebem o poder disso!?

@WellsSA

Isso é muito mais do que simplesmente código

Programação é pensar!

E tudo que vocês precisam é de um bloco de notas!

  • Vocês percebem o poder disso!?

@WellsSA

Isso é muito mais do que simplesmente código

Programação é pensar!

E tudo que vocês precisam é de um bloco de notas!

Bloco de notas + experiência =

@WellsSA

E como adquirir experiência?

@WellsSA

Do mesmíssimo jeito!

Um exemplo pessoal

@WellsSA

Docker + Docker-Compose

ReactJS

NodeJS

MongoDB

 

  • Alertas sobre produtos
     
  • No e-mail
     
  • A cada 2, 10 ou 15 minutos

@WellsSA

Obrigado!

@WellsSA

Sejam bem-vindos à Matrix!

Wellington S. Almeida

@WellsSA

Acharam que tinha acabado!?

Essa foi só a primeira parte!!

Vamos falar de pessoas!!!

@WellsSA

Sempre que falamos de pensar

Com certeza você pode sair por aí e conhecer pessoas que vão te falar de coisas e formas de pensar que você nunca nem tinha imaginado!

@WellsSA

Então participem de comunidades! Vão em eventos!

  • Google
    Google Developers Group
  • Facebook
    Facebook Developer Circles
  • Microsoft
    Microsoft InsidersDevTour
  • IBM
    Bluetalks/Bluehack
  • Oracle
    Oracle Openworld

 

@WellsSA

  • Comunidades! <3
    NodeBR
    NerdZão
    NerdGirlz
    FlutterNation
  • Eventos! <3
    The Developers Conference
    ABCDev

E pra finalizar...

Uma história engraçada sobre tudo que acabei de contar

@WellsSA

Agooooora

sim!

@WellsSA

Obrigado!

@WellsSA

@WellsSA

Perguntas?

Wellington S. Almeida

@WellsSA

2.0: Arquitetura de Software: O conceito que parte do bloco de notas

By Wellington Almeida

Made with Slides.com

2.0: Arquitetura de Software: O conceito que parte do bloco de notas

  • 65

More from Wellington Almeida