Pessoal

O que eu fiz em 2013 e o que você fez?

Zebra-l

De acordo com o calendário gregoriano, o ano de 2013 chegou ao fim. Foi um excelente ano, especialmente no quesito aprendizagem.

Aprendi várias coisas, eu tentei o máximo que pude esse ano colocar em prática o que eu assisti na palestra do Matt no TED. Aprenda algo novo em 30 dias.

O Resumo de meu aprendizado foi:

  • Aprendi Javascript à um nível de consciência semelhante ao Actionscript, essa parte foi fácil, já que é bem semelhante ao Actionscript, a parte mais complicada foi faze-lo funcionar semelhante em vários navegadores. No blog você pode ver alguns scripts escritos e outros exemplos que coloquei na conta do GitHub. Até tentei escreve meu próprio framework.
  • Aprendi a bloquear e proteger de DDoS.
  • Aprendi a programar em Python, eu escrevi até um crawler para comparar preços com o BlackFriday Brasileiro, embora eu já sabia que maior parte das oferas eram ofensivas ao consumidor, já que 72.6% dos preços oferecidos já haviam sido dado 45 dias antes. :( Eu teria confiança em escrever um aplicativo para um cliente no futuro.
  • Aprendi ASP.NET/C# com Razor template, finalmente eu entrei no mundo .Net através do ASP.net, juntamente com C#, não posso dizer que estou craque, o C# tem muita coisa semelhante a sintaxe do Actionscript, embora seja um pouco diferente no quesito de funcionamento, especialmente no que se trata de coleção de dados, alocamento de memória e seus diferentes tipos de variáveis e classes, isso pode ser um grande desafio para quem está aprendendo do zero. Digamos que o que eu consegui aprender em 30 dias me fez participar de um evento de desenvolvedores da Nokia para o lançamento do 1020, isso é assunto para outro tópico.
  • Melhorei meu Bahasha Indonesia, agora consigo falar pronomes, verbos e frases curtas, já fazem 2 anos que fui lá e espero voltar em breve com maior dominio da língua, eu tenho um excelente professor e amigo, me ajudou bastante quando estava estudando.
  • Arrisquei no espanhol, é vergonhoso ter vizinhos que falam espanhol e ter que ir na Argentina e falar Inglês, então agora eu tenho um portunhol digno de ser entendido para quem tem paciência em me ouvir. Ouvir para mim é mais fácil entendo uns 70% do que falam e contextualizo na frase para entender todo o propósito da fala. Tenho uma prima que é mestre em Espanhol e vez ou outra tiro o sarro dela falando em espanhol para praticar o idioma.
  • Falando um pouco fora do contexto de tecnologia, aprendi Marcenaria, durante 30 dias eu queria aprender algo, então entrei no Youtube e comecei a fuçar os canais relacionados, e aqui estão os canais que eu mais assisti durante 30 dias.

    O Arteirinho merece menção honrosa, já que não fiz nada relacionado a artesanato, eu peguei algumas dicas de como serrar com qualidade usando a serra tico tico.

  • Aprendi a usar o Premiere Pro da Adobe, editar videos agora ficou mais fácil do que usar o Windows Movie Maker, eu fiz até um video bacana do Campus Party Recife. Nada que seja do estilo Hollywood, mais dá para o gasto.
  • Registrei 1 patente ainda pendente
  • Conheci e fiz vários novos amigos no Rio de Janeiro onde passei 60 dias, nunca havia pensado em morar no Rio antes, foi um boa experiência.
  • Li 2 bons livros

Não é fácil manter esse ritmo quando você tem deveres, especialmente quando você tende a viajar mais do que ficar em casa nos finais de semana e aproveitar para aprender algo novo.

Palestrei no Campus Party Brasil, virei curador da área de desenvolvimento do Campus Party Recife, fui palestrar no Web Summit 2013 sobre a RIACycle, aprendi a palestrar em 4 minutos apenas, coisa que nunca tinha feito, é legal você falar um pouco de tudo resumidamente.

Fora isso achei tempo para blogar

Escrevi e publiquei mais de 60 artigos aqui no Blog, embora eu tenha dedicado menos tempo que em 2012, ainda saiu alguns artigos de qualidade e mantive a metade do público que tinha em comparação aos anos anteriores, sinal que tenho leitores assíduos.

Audience Overview - Google Analytics

Obrigado a todos os 15 mil visitantes, metade do que eu costumava ter, embora eu consegui aumentar o tempo de leitura de 1 minuto para 3 minutos e também melhorar a qualidade dos artigos.

Financeiramente

Foi o pior ano para o bolso, Ações me deixaram doidos perdi muito dinheiro esse ano com ações, acho que isso vem se arrastando desde 2012 com ainda o país em crise e o PT insistindo que não está, acho que isso é assunto para blog mais do ramo, mais no meu ponto de vista um país que vai bem na bolsa, vai bem na rua e no bolso. Muitos que conheço e investem na bolsa, desistiram do Brasil e foram se arriscar por ai à fora, já que a moratória daqui e o risco Brasil subiu perigosamente.

Meu portifolio desse ano consistia em:

Eu já vendi da BBRY, foi a que mais me deu prejuízo “acompanhado da então lascada Gafisa desde 2012”, eu apostei muito com o lançamento da plataforma 10, embora o mercado de consumidor não gostou muito do dispositivo. Sem cliente, sem preço.

Embora eu tenha mais perdido do que ganho com a desvalorização do Real sobre o Dolar, eu praticamente sai o ano zerado, entre e percas e ganhos eu perdi pouco comparado ao ano passado.

No fim, 2013 teve seus prós e contras como todos os anos, não me arrependo de nada e nem tampouco achei um ano ruim, poderia ser melhor, bem melhor. Mais nunca perca o bom ânimo. Seja sempre honesto, sempre respeite o próximo e tente algo novo a cada 30 dias.

Desejo à você um feliz Natal, um próspero ano novo e que você consiga ser uma pessoa boa, positiva e que contribua para seu país. No ano da copa faça um país descente de se viver mesmo tendo seus problemas, faça sua parte.

Aprenda a vibrar com suas derrotas, apertos, mal humor, eles tendem a nos ensinar alguma coisa que não estamos gostando. E a mudança começa dentro de você.

O que eu espero para 2014?

Sem planos, esse ano vou fazer diferente de todos os anos, no final dele eu te digo como foi.

Canvas/ HTML 5/ HTML5 / CSS3/ Javascript/ JQuery

Criando gráficos do zero com Canvas e Javascript

flud-charts
[quote style=”1″]Acabei de refazer os fiddles, o Johannes Lochter trouxe o problema à tona onde não estava aparecendo Chrome e IE, era uma limitação do Fiddle e ajustei. Se alguém tiver problemas em não visualizar o conteúdo me avisem pelos comentários.[/quote]

A parte boa de vim do Flash/Flex é que em Javascript você tem toda a liberdade possível usando o canvas como instrumento de desenho, igual o Stage branco do flash e uma API semelhante para fazer formas geometricas, dignas de 8 anos atrás.

Apesar de ser um rascunho Canvas, é um elemento amplamente adotado no novo padrão HTML5, sem ele basicamente o HTML5 seria ainda HTML 4.1, ele é o máximo das novidades que eu coloco em pauta.

Definindo gráfico

[quote style=”1″]Suponha que você precise mostrar esses resultados de forma mais convincente do que a tradicional forma em números. É ai onde entra o gráfico, ele representa o desenho daqueles números que você possui disponível, é uma forma de atalho para mostrar que A+B = C.[/quote]

Sem mais delongas, gráficos são excelentes, enche os olhos de qualquer pessoa que os vê. Eles não só representam uma forma geométrica, representam métricas de dados reais e isso reflete e muito na tomada de decisão que uma pessoa faz ao usa-los.

Nessa série de posts, eu vou comentar um pouco sobre os gráficos mais comuns e existentes no mercado criando-os em javascript com Canvas do HTML5 e CSS3.
Existem N bibliotecas para criar gráficos usando esse recurso, a idéia é você aprender o que está por trás dessas bibliotecas, quais técnicas, quais calculos de trigonometria você precisa ficar por dentro e assim, só assim você pode entender como gráficos são feitos.

Eu sempre quis fazer algo semelhante sem precisar usar bibliotecas de terceiros, quando você chega nesse grau de curiosidade só assim você consegue enxergar o campo todo e aperfeiçoar bibliotecas existentes, colaborar com projetos já existentes ou até mesmo criar as suas.

A lista de gráficos que vou comentar é essa:

  • Gráfico de Area
  • Gráfico de Barras
  • Gráfico de Colunas
  • Gráfico de Gauge
  • Gráfico de Linhas
  • Gráfico de Pizza

Embora esses não sejam os únicos gráficos existentes. Existe uma boa chance, 90% dos casos onde você vai se deparar com eles. Se você quer criar gráficos sem se preocupar em como fazê-los, pode parar de ler por aqui e adotar essas bibliotecas abaixo:

É biblioteca o bastante para fomentar qualquer um por gráfico, elas são excepcionais e faz o trabalho de maneira perfeita. Melhor ainda é aprender como gráficos são feitos.

O primeiro que decidi fazer nessa série é o gráfico de Gauge, mais conhecido como velocimetro, gauge de agulha. Bastante usado em automóveis, medição de stress, pressão e por ai vai.

gauges
Créditos da foto : http://500px.com/photo/4573670

Matemática por trás da medição

É trigonometria na sua mais pura forma, seno, coseno e tangente, para saber o angulo, arco você tem que usar ambos os calculos, embora possa parecer difícil, criar isso é ridicularmente simples, especialmente quando o Canvas do HTML já vem com o calculo pronto para você, basta você passar os valores necessários e pimba! Gráfico está feito.

Desenhando um arco simples

O interessante da API do canvas é justamente essa facilidade, não é o desenho de um arco perfeito, dá para o gasto para o propósito final que queremos.

A mesma lógica por trás do desenho do Gauge é o desenho do gráfico de pizza, tudo parte do principio do ponto atual, o angulo que começa o gráfico e onde ele termina para começar o próximo.

Vejamos como você pode mitigar isso da seguinte forma.

Desenhando um gráfico de Pizza ou Torta(pie) como dizem pelas gringas

Desenhando um gráfico de Barras

Outro gráfico bastante usado em dashboards é o gráfico de Barras, ele basicamente é um indicador de quando cresceu ou diminuiu determinado valor em um intervalo de tempo ou de número. Eu já comentei aqui como criar um desses usando puramente JQuery e CSS, dessa vez usando o elemento Canvas.

O único método é o rect (desenha um retangulo), bem conhecido pelos desenvolvedores de Actionscritpt 2.0.

Ou Até animado.

Desenhando um gráfico de Colunas

O mesmo gráfico só que com o eixo invertido, ao invés de incrementar apenas o eixo X, incremento o Y e ele vai sendo exponencialmente incrementado conforme a ordem que foi criada do dataProvider.

Desenhando um gráfico de Linha

É bastante comum usar o gráfico de linha, é basicamente um indicativo de onde você chegou e onde você etá, é o preferido do mercado de ações da bolsa. O gráfico de linha sempre é acompanhado do primeiro elemento e a única série que muda é a série vertical, os pontos horizontais de um gráfico de linhas sempre são baseados na constante (largura disponível / número de registros) vezes o valor de cada registro.

Já a posição Y que sempre está variando para que a linha mude “lineTo()”, seja constante, exemplo pegue o último valor registrado e começe daquele ponto, sempre é feita pela constante. ( altura disponível / valor máximo encontrado) vezes o valor que se tem nos dados.

A mesma lógica do gráfico de linhas pode ser aplicada ao gráfico de Area, afinal a diferença é que você pode mostrar uma área (path), acompanhando os pontos da linha.

Trigonometria é a essência dos gráficos, fique livre para fazer um fork, alterar e hackear, por exemplo implementar a exibição dos eixos X,Y, implementar o click em determinado item do Gráfico, criar um plugin para JQuery ou até mesmo para criar eles animados. Nesse ponto eu prefiro fazer os gráficos não usando imagem simples do Canvas, mais sim um elemento avançado como o SVG, fica muito mais fácil fazer tais interações e integrar com uma biblioteca de afinamento de efeito ‘easing’.

Até o próximo post.

Apache Flex/ Flex/ FlexJS

Apache Flex com saída para HTML5,Javascript e CSS. Trans-compilação para vários clientes

flexjs

Em Janeiro, teve muita gente que desacreditou e não depositou mais as fichinhas na solução Apache Flex, até eu tentei fazer isso. O fato é que é difícil você largar certos hábitos e se transformar em uma outra pessoa da noite para o dia, é um aprendizado longo e doloroso.
breakfast-anyone-l

Parte desse processo é justamente ficar de mãos atadas à Adobe que é controladora do Flash Player/AIR e consecutivamente depende de navegadores que esses tendem a não depender ou querer mais players instalados neles por padrão, resumindo. Tem muita caixinha de areia para trabalhar e isso impactou bastante na boa positividade do Flash Player, travamentos constantes e a falha de quebra de navegadores deixaram todos malucos, especialmente quem desenvolve para o Flash Player.

Antes de continuar com o post, eu gostaria de defini-lo como uma rendição, não aquela onde você se rende ao fracasso e ao descaso e tenta-se recompor com meios pejorativos ou com uma arrogância de quem não quer mais vencer e se dá por vencido. Essa é uma rendição de que o Apache Flex tem um futuro brilhante em 2014 e é sobre isso que eu quero escrever para você que está ai com um pouco de pensamento cético ou desacreditado que isso não possa mudar nem tão cedo.

Vamos por parte, eu sempre gosto de dividir posts longos em tópicos, assim fica muito mais fácil para mim conseguir entender minha linha cronológica do assunto. Eu começo pelo.

O lado bom de trabalhar em uma fundação

Superman-l
Sendo um único comitter Brasileiro do projeto, isso quer dizer que eu tenho grandes responsabilidades não só em ajudar a tecnologia, assim como trazer boas notícias para nós aqui no Brasil, ser comitter acima de tudo é divulgar, acreditar, evangelizar, convencer as pessoas que aquilo é bom. E na fundação Apache eu tomei isso como uma tarefa obrigatória e semanal. Em 2013 eu doei mais de 320 horas ao projeto. Criando coisas que possam servir não agora, mais em um futuro bem próximo e que isso torne nossas vidas mais fáceis e assim a internet consiga progredir a passos largos como tem feito avanços ao longo do tempo.

Tendo em vista que eu tenho um trabalho full-time, 320 horas é mais que suficiente para garantir que o projeto ande bem, já que a cada mês sempre temos novos membros na equipe que são escolhidos pela sua dedicação e tempo doado ao projeto e a fundação.

Doar seu tempo com uma tecnologia que o acompanha sempre para onde você for é gratificante, ainda hoje recebo mensalmente algumas dúzias de e-mails pedindo ajuda para solucionar problemas de desenvolvimento relacionados ao Flex, eu diminuir muito minha cota de resposta, fica difícil acompanhar e responder todos com tantas atribuições para serem feitas durante todo santo dia, de domingo a domingo. A resposta sempre vem, isso é garantido só que pode ser que o tempo não seja hábil. Então eu prefiro colocar em pausa e focar mais no tempo gasto para o Apache Flex, até mesmo blogar ficou em segundo plano, esse ano de 2013 foi basicamente meia dúzia de posts, metade só sobre EGO de palestrar, nada tão tesão que eu gostaria de mostrar.

E depois que eu adotei essa regrinha de doar 1 hora por dia ao projeto isso me fez refletir sobre os resultados dessa dedicação, não é nada fácil fazer algo voluntário e esperar bons resultados, eles sempre veem de forma à longo prazo. Só que ai entra na questão dos números.

O Apache Flex atualmente

Zebra-l

O SDK para melhor funcionar em sua máquina ele é distribuído através de uma instalador que de longe facilita e muito a configuração automática para sua máquina, assim você gasta tempo no que realmente importa.

Falando do Instalador, sua última versão 4.11 tem recebido um em média semanal mais de 15.000 mil instalações, isso quer dizer que muitas pessoas ainda desenvolvem no SDK.
A lista de discussão tem uma média mensal de 600 a 800 e-mails.

Já reparou na quantidade de commits que o projeto recebeu só em 2013? Uma média de 705 commits mensais e o resultado disso é mais de dúzias de centenas de bugs corrigidos e novas implementações para o FlexJS, falo disso daqui à pouco.

Fora que nosso site teve mais de 200.000 mil visitas únicas desde que começamos a monitorar em Janeiro deste ano.

Toda essa atividade prova que o projeto tomou um fôlego e mais desenvolvedores estão engajados ao projeto.

A mudança de jogo

asvsjs

Tudo começou por um e-mail, Janeiro quando um dos comitters o Eric, estava trabalhando em um SDK chamado Vanilla SDK, ajudou bastante nesse processo de migração.

Criar trans-compilação para vários clientes não é dificil, especialmente se tratando de javascript, várias linguagens de programação já fazem isso. Então se todas fazem por que é tão dificil para do Actionscript para o Javascript?

Actionscript para Javascript

Snow-fun-l

Embora ambas as linguagens sejam descendentes do ECMAScript, o Javascript ficou para trás em vários quesitos em relação ao Actionscript e algumas coisas que limitam o Actionscript, no Javascript ele dá de lavada. Dito isso, boa parte dessa diferença está na especificação 262, o Javascript adota a edição 5 e o Actionscript parou na edição 3. Essa diferença não é quase nítida e sim retrai a velha teoria que o Javascript não é só OOP simulado como era o Actionscript 1.0. Na verdade o Javascript ainda é imperativo e funcional. Boa parte disso você percebe quando tenta rodar um script de javascript e se houver erro acaba limitando o modelo de objeto a ser relacionado a função ou ao corpo que ele esteja sendo manipulado.

Se tratando de trans-compilação isso é uma faca de dois gumes, de um lado você tem diversas implementações que já foram resolvidas 5 anos atrás como é o caso do Actionscript 2.0 e de 8 anos atrás como é o caso do recém Actionscript 3.0.

E toda essa reviravolta é apenas por uma causa dessa carta , acho que sua frustração não era em si pela tecnologia, mais simples pela falta de controle do Flash Player que a Adobe queria continuar dominando o mundo com seu player. Resultado, deu no que deu. Muitos clientes alheios a essa limitação começou a bater o pé e não querer mais o SWF compilado em seus projetos, coisas e afins, não tenho dúvidas quanto a isso. A Web precisa ser justa e aberta, a NSA está ai para provar que estou certo, enfim, isso é papo para outro post.

Passados uns 15 meses e a Adobe sem solução alguma para passar uma borracha em soluções SWF e dar suporte ao então famigerado que rouba o crédito do Javascript o HTML5, surge o CREATEJS. Ele tem uma API muito similar ao Actionscript 3.0 e reduz e muito a curva de aprendizado quando você começa a programar nele, a diferença é que você vai escrever partes apenas em Javascript e não fará nada além disso. Embora eu tenha dito isso, acabei de receber um alerta aqui do Creative Cloud que o Flash CC dará suporte nativo ao CREATEJS com HTML5 Canvas, imagine você programar Javascript diretamente do Flash CC, acho que eles estão tentando se adaptar ao mercado.

Lembrando que o Canvas do HTML5 só é possível por que parte do engine compilador do Actionscript foi doado para fundação Mozilla e se espalhou pela Web. Acabou surgindo na especificações da W3C o Canvas.

Voltando ao assunto, existe outro framework que já faz essa trans-compilação de Actionscript para JavaScript? Não, existe uma outra linguagem de programação chamada Haxe junto a outro projeto chamado OpenFl que faz essa trans-compilação e cross-compilação estilo Apache Flex SDK, só que com menos da metade das funções fora da caixa pronta como o Apache Flex SDK possui.

O que torna atrativo a idéia de usar o Apache Flex como solução é justamente usar ou migrar Apps para fora da caixa do plugin e ir direto para outra caixa do navegador. Acho que esse pulo do gato o Nicolas Cannasse pensou bem antes, criar algo que fosse semelhante a API do Actionscript e exportasse para várias plataformas. Veja que a idéia do Nicolas se encaixa perfeito em nossa perspectiva de como será o Apache Flex daqui para frente.

haxe-diagrama

Só que é melhor usar soluções próprias e migrar o Falcon para fazer essa exportação de maneira mais rápida, foi ai que o Alex Harui outro comitter teve a idéia de usar a solução dessa trans-compilação usando o Google Closure para fazer essa tradução, afinal GWT usa isso do Java para o Javascript.

Existe outras tentativas para o uso da mesma API do Flash Player, inclusive o Stage3D que acaba acelerando o processo para o Dart. Além do Vanilla SDK ele foi inspirado na verdade com as tentativas do Jangaroo.

A mais avançada tentativa até hoje é o projeto Mozilla Shumway que é a tentativa de emular a máquina virtual do Actionscript diretamente no browser sem precisar usar o Flash Player, o projeto ainda está em fase alpha, mais já possui grande chance de funcionar, já vi até o Candy Crunch feito em Flash rodar liso nele. Para isso você precisa ter a ultima versão do Firefox.

Na prática como isso funciona, abaixo eu criei um diagrama de como será daqui para frente com o Apache Flex.

apache-flex-architecture-full

Você vai continuar programando em Actionscript e MXML (isso garante o investimento feito) para criar layouts e em contra-partida o FalconJX, em conjunto com o framework interno ainda em estado de POC (Prova de Conceito) FlexASJS está ainda nos primeiros passos, já temos meia dúzia de componentes visuais prontos para serem usados e compatíveis com os navegadores IE8+, Chrome19+, Firefox16+, Opera11+, Safari 7+. Nada de navegadores antigos, já de cara suportando o que há de mais avançado nesse quesito.

Design em mente

color-leave-l

Uma das grandes sacadas do Apache Flex é a questão dos Skins, uma mistura do clássico SVG com a sintaxe do MXML e saiu o FXG para criar interfaces com perfeição de pixels, sem distorção.

A galera dos padrões Web parece que percebeu isso e começou a adotar o SVG para esse propósito, até a Adobe está dando uma forcinha. E toda a parte de Skin dessa transição será feita em SVG, é o melhor formato e boa parte dos navegadores modernos já suportam SVG para isso.

Tem muita coisa a ser implementada, por exemplo criar Datagrid, Lists, Habilitar a criação de componentes personalizados, dar suporte a E4X já que no javascript isso não é possível.

Por exemplo, para configurar seu Flash Builder para suportar isso ainda é muito manual, o Om está fazendo um instalador à parte para ajudar nesse processo e deixar mais simples essa configuração do ambiente, também existe uma petição para que isso seja possível também no IntelliJ IDE “Ajude-nos, vote lá”.

Nos próximos 6 meses ele ficará um pouco mais maduro e terá mais componentes disponíveis para essa transição.

O que é possível hoje?

Para encurtar se você domina o inglês, siga esses passos. Caso contrário pode fazer o seguinte. É interessante também você ler como funciona aqui.

1 – Instale o Apache Flex SDK 4.10 ou maior.
2 – Feche o Flash Builder 4.7 se estiver aberto.
3 – Baixe a biblioteca do Google Closure. Extraia em um diretório de sua preferência, ex: c:\sdks\closure\
4 – Vale lembrar que você precisa ter o JDK na máquina.
5 – Configure a variável de ambiente GOOG_HOME e aponte para o diretório onde você extraiu o Google Closure.
6 – Baixe o ApacheFlexJS.zip
7 – Extraia ele em um diretório de sua preferência, eu geralmente coloco assim c:\sdks\flex\flexjs
8 – Depois que você extrair, vá até o diretório onde você extraiu o arquivo e execute o arquivo deploy.bat pela linha de comando do prompt do Windows e passe o comando deploy.bat Importe > Run/Debug > Launch Configurations
12 – Escolha a IDE Flash Builder da cópia modificada do FlexJS
13 – Se você fez tudo certo vai aparecer agora várias configurações extras sob a ferramenta ‘External Tools’.

flexjs

Existe outros exemplos dentro do FlexJS que você baixar do SDK, embora eles sejam um pouco mais complexos para quem quer adaptar a realidade, eu acabei criando um do zero e coloco aqui para vocês baixarem.

[button link=”https://www.dropbox.com/s/jnmih4vrz8ccbiv/FlexParaJavascript.zip” color=”#a39e9e” size=”3″ style=”1″ dark=”0″ radius=”auto” target=”self”]FlexParaJavascript.zip[/button] [note color=”#FFCC00″]Esse arquivo tem os binários compilados, rode em seu navegador e veja que funciona tanto no SWF quanto sem ele.[/note]

Onde e como posso acompanhar

A maneira mais fácil e ir ao site, flex.apache.org e começar a assinar a lista de discussão ou fazer um fork no projeto pelo Github, o projeto está espelhado por lá.

A medida que o projeto for evoluindo eu vou postando mais exemplos aqui, ainda há muita coisa a ser feita. Até o final de Dezembro teremos um SDK mais estável e um instalador para ele.

O clima é de festa e Queremos avisar ao Javascript que estamos chegando para ajudar e não competir.