Resumo das palestras do TDC2015 sobre Javascript

#TDC2015 Floripa
Resumão das palestras assistidas [...]
#TheDevConf
15 de Maio de 2015
@jpcercal (João Paulo Cercal)

About me
<?php
return array(
'name' => 'João Paulo Cercal',
'github' => '@jpcercal',
);

Agenda
a) Análise de Negócios: Valor quem gera e como gera;
b) Javascript: A Evolução do AngularJS;
c) Javascript: Testes automatizados de todos os tipos usando
blibotecas Javascript;
d) Javascript: Arquitetura Front-end para sistemas de larga escala;
e) Javascript: Automatizando de forma modular e estruturada
grandes aplicações com Gulp;
f) Javascript: Real Time com Node e Socket.io;
g) Javascript: Construindo interfaces componentizadas com React.

Análise de Negócios: Valor quem gera e como gera?
Palestrante: Anderson Diniz Hummel
Mais informações em: http://www.thedevelopersconference.com.
br/tdc/2015/florianopolis/trilha-analise-de-negocios

Análise de Negócios - Valor quem gera e como gera?
Premissas:
a) Meu cliente não
sabe o que quer;

Soluções:
a) Entregas Incrementais;
Pois, o cliente não sabe o que
quer, muito menos você!

Premissas:
b) Apenas 15% dos projetos atendem as necessidades do
cliente.

Soluções:
b) 30-40% dos projetos que adotam
metodologias ágeis atendem as
necessidades do cliente.

Mas onde está o valor?
O valor não está na solução
que entregamos para o
cliente, mas sim na solução
que resolve o problema de
um cliente;

O que é valor?
Se fosse possível definir,
seria mais ou menos isto:
Valor = Benefício / Custo

Quanto vale um momento feliz para você?

Qual é a diferença entre o Profissional de TI e
o Traficante?

Desafio:
a) Pensar em um produto em 5 minutos;
b) Quem é o meu cliente (5 minutos)?
c) Quais são os problemas do cliente e como resolveremos (5
minutos)?
d) Quais os benefícios que o cliente terá em comprar nosso
solução (3 minutos)?

Notas:
a) Se estivermos desenvolvendo
um produto inovador que não
hajam concorrentes, ou o
mercado não precisa desta
solução ou então somos
realmente
inovadores;

Notas:
b) Os benefícios para um cliente
geralmente estão relacionados com:
✓ Dinheiro (permitir que fature mais
gastando menos);
✓ Tempo (permitir aproveitar
melhor o tempo);
✓ Segurança (acreditar que a solução
é adequada);

Notas:
c) Não desperdice dinheiro da empresa em funcionalidades
que talvez não façam sentido para o seu cliente;
d) Não desperdice tempo implementando N formas de
pagamento, saiba como o cliente compra primeiro.

E o valor, quem gera?
a) TODOS os envolvidos em entregar uma solução para o
cliente;
b) As pessoas com quem trabalhamos devem SABER o MOTIVO
pelo qual TRABALHAM!

Javascript: A Evolução do AngularJS
Palestrante: Rodrigo Branas
br/tdc/2015/florianopolis/trilha-javascript
Slide utilizado na apresentação:
http://pt.slideshare.net/rodrigobranas/a-evoluo-do-angularjs

Um pouco da minha história:
a) Minha esposa também desenvolve com Angular;
b) Estávamos caminhando pela Beira Mar Norte e minha
mulher perguntou: "E aquele ng-bind!?"

Alguns pontos positivos:
a) Estimula a criação de novos componentes;
b) Facilita a automação através de testes;
c) Facilita a exibição da view;
d) Facilita a integração com o Back-end;
e) Comunidade muito forte e atuante;
f) É como casar com mulher rica, o futuro está garantido..
porque a mulher neste caso, é a Google;

Alguns pontos positivos:
g) 138 releases do angular (cada versão possui um super
poder);
h) Cerca de 4k testes de unidade;
i) Cerca de 50k testes em ambientes e navegadores;
Enfim, dá pra confiar!

Arquitetura do Framework:
a) View: o que o cliente vê;
b) Controller: responsável pelo que
a View consome;
c) Scope: o garçom que pega os
pedidos dos clientes, leva para
a cozinha e traz os pratos prontos
da cozinha para o cliente, ou seja,
um Intermediador entre a View
e o Controller.

Dúvidas Gerais:
a) Em que SCOPE eu estou!?
Você pode colocar {{ $id }} e ver os escopos.
Todos os números inferiores o ID do escopo
apresentado estarão disponíveis, pois eles
são herdados.

Angular 2.0:
a) Quem são?
b) Como vivem?
c) O que comem?
d) De onde surgiram?
e) Como se reproduzem?

Angular 2.0:
a) Estava tudo tão bom, porque está mudando?
✓ Utilização de novos recursos;
✓ Melhorias consideráveis em desempenho;
✓ Curva de aprendizado será menor (menos conceitos);
✓ Aí você me pergunta.. Mas MUDOU MESMO né!?
○ A maioria das diretivas morreram;

Angular 2.0:
a) Ahm!?
Como!?
Quem morreu!?
✓ A maioria
das…
diretivas!
a) ng-bind;
b) ng-class;
c) ng-style;
d) ng-disabled;
e) ng-show;
f) ng-hide;
e) ng-src;
f) ng-href;
g) ng-blur;
h) ng-change;
i) ng-click;
j) ...

Javascript: Testes automatizados de todos os tipos
usando bibliotecas Javascript
Palestrante: Stefan Raphael A. Teixeira
http://pt.slideshare.net/stefanteixeira/tdc-2015-testes-
automatizados-de-todos-os-tipos-utilizando-bibliotecas-javascript

Ferramentas para testes de unidade:
a) Jasmine (http://jasmine.github.io/);
b) Mocha (http://mochajs.org/);
c) QUnit (https://qunitjs.com/);
d) Karma (http://karma-runner.github.io/).

Assertions Libraries:
a) Chai (http://chaijs.com/);
b) ShouldJS (http://shouldjs.github.io/).

Testes de API:
a) SuperTest (http://github.com/visionmedia/supertest);
b) FrisbyJS (http://frisbyjs.com/).

Testes de UI:
a) Protractor (https://angular.github.io/protractor/);
b) Hodman (http://yahoo.github.io/hodman/);
c) ZombieJS (http://zombie.js.org/);
d) NightWatchJS (http://nightwatchjs.org/);
e) WebDriverJS (http://webdriver.io/).

Javascript: Arquitetura Front-end para sistemas de
larga escala
Palestrante: Gabriel Gottgtroy Zigolis
http://pt.slideshare.net/zigolis/frontend-architecture-for-large-
scale-apps-gabriel-zigolis

larga escala
Nota:
a) Se o mundo acabasse hoje, sobrariam
as Baratas e o Javascript, de tão
difundida que está a linguagem.

larga escala
Java é tão ruim assim?
a) DEPENDE...
b) Porque quando alguém nos fala algo assim, não ouvimos e
tiramos o melhor de cada tecnologia ao invés de reclamar
dela?
c) Pare e pense, muitos dos patterns que escrevemos hoje
vieram do Java!

larga escala
Java ou PHP?
a) DEPENDE…
b) Temos um conjunto de classes tanto
no PHP quanto no Java, que implementam uma API REST,
ambas retornam um JSON..
Aí eu lhe pergunto: Faz diferença para o front-end consumir
os dados do Java ou do PHP neste caso? NÃO! Então pare de
mimimi..

larga escala
Porque damos suporte para o IE ainda?
a) Esta resposta é muito simples:
USUÁRIOS/NÚMEROS!
b) Na Arezzo, a faixa etária de acesso está entre 20-65 anos;
c) 90% dos acessos são do S.O Windows;
d) Destes 90%, 15% dos acessos são provenientes do IE 8/9;

larga escala
Porque damos suporte para o IE ainda?
e) O portal tem um faturamento médio de 15 milhões/mês;
f) 15% de 15 milhões/mês é maior que o salário seu e de sua
equipe, então, é por isto que ainda damos suporte ao IE
8/9;

larga escala
Responsive ou Mobile?
a) Você colocaria a responsabilidade um usuário
baixar um conteúdo que não será consumido em
uma versão responsiva utilizando o plano de
dados que temos no Brasil?
b) A equipe comercial vendeu o projeto responsivo como
sendo a melhor opção (trazendo menos custos e maior
retorno se comparado ao cenário atual);

larga escala
Responsive ou Mobile?
c) O cenário atual diz que, 20% das vendas da Shutz vem do
Mobile;
d) Faturamento médio de 4 milhões/mês;
e) No fim, as vendas caíram em torno de 80%, o que cobriria o
investimento em Mobile;
f) Acha ainda que o comercial acertou em
orientar a escolha pelo responsivo?

larga escala
RequireJS ou Browserify?
a) Pare com isto! Não temos que comparar, cada um tem o seu
propóstio;
b) RequireJS deve se utilizado para carregar JS sob demanda.

larga escala
BackboneJS ou AngularJS?
a) BackboneJS é uma library muito pequena (~7kb);
b) AngularJS é um framework.

larga escala
Porque não codificamos
só com jQuery?
a) Porque não faz sentido para os
negócios e requisitos que temos
nos nossos projetos de hoje.
Enfim…
Não existe mágica ou bala de prata, tudo DEPENDE, seja do seu
time, conhecimento, maturidade ou requisitos de negócio..

Javascript: Automatizando de forma modular e
estruturada grandes aplicações com Gulp
Palestrante: Anderson Aguiar
http://www.slideshare.net/andersonagr/automatizando-grandes-
aplicaes-de-forma-modular-e-estruturada-com-gulp

Por que automatizar?
a) Melhorar a qualidade;
b) Não realizar tarefas repetitivas;
c) Entregar rapidamente;
d) Seu tempo é precioso.

Ferramentas disponíveis:
a) Gulp (http://gulpjs.com/);
b) Grunt (http://gruntjs.com/);
c) Jake (http://jakejs.com/);
d) Pint (http://www.pintjs.com/).

Alguns plugins para o Gulp:
a) browser-sync;
b) esformatter;
c) gulp-mocha;
d) gulp-load-plugins;
e) gulp-sass;
f) gulp-less;
g) gulp-stylus;
h) gulp-uglify;
i) gulp-concat;
j) gulp-imagemin;
k) gulp-sourcemaps;
l) gulp-bump;
m) gulp-zip;
n) ...

Quando usar Gulp e não o Grunt?
a) Além do DEPENDE… (do projeto, da equipe, etc);
b) O principal diferencial é que o Gulp é muito rápido, pois,
trabalha com o Unix Stream Pipe;
c) Enquanto que, o Grunt tem mais plugins e está mais
maduro;

Javascript: Real Time com Node e Socket.io
Palestrante: Guilherme Oderdenge

O que é Websockets?
a) É um protocolo que prove uma conexão (em um canal full-
duplex) sobre uma conexão TCP;
b) É econômico e inteligente;
c) Funciona na maioria dos browsers modernos;
d) Nasceu para o propósito de tempo real para a web;
e) Short e Long Polling são técnicas, websockets é uma
tecnologia;

Socket.io?
a) É para websockets o que jQuery é para o DOM;
b) Roda somente em NodeJS;
c) Para instalar: "npm install socket.io";
d) Emit/On se referem a Input/Output;
e) Socket mantém uma conexão ativa enquanto o cliente
estiver ativo, então faz-se necessário preocupar-se com
segurança como em qualquer outra aplicação.

Javascript: Construindo interfaces componentizadas
com React
Palestrante: Sérgio Rafael Siqueira

com React
O que é o React?
a) É uma biblioteca que tem o foco no usuário.

com React
Você já utilizou React?
a) Se disser não, mentiu! O facebook mantém e implementa o
react em sua rede social;
b) https://github.com/facebook/react

com React
Interface de usuário no front-end:
a) Handlebars (http://handlebarsjs.com/);
b) Mustache (https://mustache.github.io/);
c) Underscore (http://underscorejs.org/).

Obrigado!
<?php
return array(
'name' => 'João Paulo Cercal',
'github' => '@jpcercal',
);

Resumo das palestras do TDC2015 sobre Javascript

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Viewers also liked

Viewers also liked (15)

Similar to Resumo das palestras do TDC2015 sobre Javascript

Similar to Resumo das palestras do TDC2015 sobre Javascript (20)

Resumo das palestras do TDC2015 sobre Javascript