Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Técnicas de Util Prototype
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Matheus Monte
July 27, 2019
Programming
1
50
Técnicas de Util Prototype
Descreve técnicas de como criar protótipos de forma otimizada e reaproveitáveis no futuro
Matheus Monte
July 27, 2019
Tweet
Share
More Decks by Matheus Monte
See All by Matheus Monte
I Forum carreira - FMM 2020
matheusmonte
0
76
Order the Chaos: How to organize your react code
matheusmonte
0
53
React-360 - Go beyond Final frontier
matheusmonte
0
36
Serverless - Basic Concepts
matheusmonte
0
43
PyDTN
matheusmonte
0
180
Using Angular and React in same context
matheusmonte
0
38
Async Renderer - What's next?
matheusmonte
0
51
Componentization with React
matheusmonte
0
310
Web API with Flash: Code fast, delivery faster
matheusmonte
0
32
Other Decks in Programming
See All in Programming
CSC307 Lecture 07
javiergs
PRO
0
550
FOSDEM 2026: STUNMESH-go: Building P2P WireGuard Mesh Without Self-Hosted Infrastructure
tjjh89017
0
160
なるべく楽してバックエンドに型をつけたい!(楽とは言ってない)
hibiki_cube
0
140
コマンドとリード間の連携に対する脅威分析フレームワーク
pandayumi
1
450
CSC307 Lecture 02
javiergs
PRO
1
770
AI時代の認知負荷との向き合い方
optfit
0
150
Unicodeどうしてる? PHPから見たUnicode対応と他言語での対応についてのお伺い
youkidearitai
PRO
1
2.5k
AIエージェント、”どう作るか”で差は出るか? / AI Agents: Does the "How" Make a Difference?
rkaga
4
2k
組織で育むオブザーバビリティ
ryota_hnk
0
170
0→1 フロントエンド開発 Tips🚀 #レバテックMeetup
bengo4com
0
560
AI & Enginnering
codelynx
0
110
CSC307 Lecture 03
javiergs
PRO
1
490
Featured
See All Featured
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
410
技術選定の審美眼(2025年版) / Understanding the Spiral of Technologies 2025 edition
twada
PRO
117
110k
Raft: Consensus for Rubyists
vanstee
141
7.3k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
359
30k
Speed Design
sergeychernyshev
33
1.5k
Visualization
eitanlees
150
17k
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
baasie
0
220
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
231
22k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
davidcarrasco
0
63
Stop Working from a Prison Cell
hatefulcrawdad
273
21k
Bootstrapping a Software Product
garrettdimon
PRO
307
120k
Transcript
Técnicas de util prototype
Pai, Agilista, desenvolvedor e nada fotogênico
Como nascem os aviões?
None
None
E o software?
Ideia
MVP
Valida a ideia
–Usuários, clientes e Steakholders “Sucesso!” “Adorei Isso” “Exatamente o que
eu queria” “Vai precisar aguentar 3 trilhões de usuários” “Novo unicórnio” “Precisa só mudar um pouco essa tela!”
None
None
Pode ser DIFERENTE
Peças
Componentes
Vantagens • Reaproveitamento máximo de código já desenvolvido • Mantém
a identidade visual dos produtos • Melhora a legibilidade e manutenção • Reduz o tempo de desenvolvimento
A parte chata • Por que fazer isso para um
teste? • Pensar em comportamentos variados • Construir o pacote inicial • Refino exagerado
Equilíbrio
Como fazer
Exemplo import React,{useState, useEffect} from "react"; import './Timer.css'; function Timer(props){
const [time, setTime] = useState(props.startTimer); useEffect(() =>{ let timerID = setInterval(() => tick(), 1000); return function cleanup(){ clearInterval(timerID); } }); function tick(){ if(time > 0){ setTime(time - 1); } } return( <div className="TimerContainer"> <p className="CountNumber">{time === 0 ? <marquee>{props.finishText}</marquee> : time }</p> </div> ) } export default Timer;
Exemplo <Timer startTimer={13} finishText="time is over"/> <Timer startTimer={13} finishText="time is
over"/> <Timer startTimer={13} finishText="time is over"/> <Timer startTimer={13} finishText="time is over"/> <Timer startTimer={13} finishText="time is over"/> <Timer startTimer={13} finishText="time is over"/>
Infraestrutura
Serverless
Vantagens • Foco nas regras de negócio • Abstração de
infraestrutura • Sua linguagem preferida • Atomico • Custo
A parte chata • Controle e organização de código •
Sem “Utils" • Atomicidade • Cold Time
Limite
Como fazer
Exemplo
Exemplo
Flexível
Mobile Híbrido
Vantagens • Agilidade • Manutenção • Code once • Bom
desempenho • Documentação disponível
A parte chata • Recursos nativos • Code once, maybe
run anywhere
Objetividade
Como fazer
Exemplo
Novidade rápida
None
Até o próximo voo
[email protected]
@matheuscsmonte M.: T.: matheusmonte G.: