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
WebDev: Introdução ao desenvolvimento Web
Search
Beto Costa
June 08, 2024
0
17
WebDev: Introdução ao desenvolvimento Web
Beto Costa
June 08, 2024
Tweet
Share
More Decks by Beto Costa
See All by Beto Costa
GameDev: Introdução à arte de criar jogos
robertheory
0
12
Desempenho e Otimização no Frontend
robertheory
0
14
Soft Skills: Destaque-se por onde passar
robertheory
0
14
GUIA DO AUTODIDATA
robertheory
0
44
Featured
See All Featured
Designing on Purpose - Digital PM Summit 2013
jponch
114
6.8k
From Idea to $5000 a Month in 5 Months
shpigford
379
46k
Facilitating Awesome Meetings
lara
49
6k
BBQ
matthewcrist
83
9.2k
Build The Right Thing And Hit Your Dates
maggiecrowley
30
2.3k
Done Done
chrislema
180
16k
Making Projects Easy
brettharned
113
5.8k
The World Runs on Bad Software
bkeepers
PRO
64
11k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
166
48k
Ruby is Unlike a Banana
tanoku
96
11k
How to name files
jennybc
75
98k
Typedesign – Prime Four
hannesfritz
39
2.3k
Transcript
WebDev Introdução ao desenvolvimento Web
About + Empreendedor de sucesso + Físico teórico + Viajante
+ Escritor + Músico + DJ + Cabeleireiro + Dev Maromba
None
Beto empreendimentos
About + ErreJota <3 Bangu + Ciência da Computação (NaN/8)
+ Dev Fullstack na Suzano + Tech In Rio + Praia + Rave / Rock
O que é WebDev?
Criação de sites?
Os sites mudaram um pouco
Evolução constante • Internet + rápida • Hardware + potente
• Navegadores + poderosos • Dispositivos móveis
A plataforma que mais cresce • Lança uma vez •
Alcança todos dispositivos • Menor custo de desenvolvimento • Funcionalidades modernas
Como eu começo?
Ferramentas de trabalho WebDev • Browser (navegador) • Editor de
código (opcional) • HTML • CSS • JavaScript
Editor de código
HTML ( Hyper Text Markup Language ) • Estrutura básica
CSS ( Cascading Style Sheets ) • O salão de
beleza da web
JavaScript • O super poder da web
Como os websites são construídos • Planejamento • Design •
Desenvolvimento • Testes • Publicação
Como funciona a Web?
Componentes principais Internet Servidores Clientes
A Internet
Servidores
Clientes • Arquitetura cliente-servidor
Video buffering • Sempre tem algo baixando
Baixando de onde? • Sistema de endereços na Web •
Endereço IP
DNS – Domain Name System
DNS – Propagação
Tá tudo na nuvem
Cloud = computadores em todo lugar • Sempre tem um
computador do outro lado • Não existe magia na nuvem
None
Sua internet pode cair por causa de tubarões
A grande sacada da nuvem • Delegar uma tarefa para
outro computador • Unidos venceremos • Dividir para conquistar
Exemplo: ChatGPT • Elimine as limitações do cliente usando o
servidor
API O grande garçom da web
API (Application Programming Interface)
Integração entre sistemas • Serviços prontos • Dados abertos
O céu é o limite • Gere valor acima de
tudo
Por onde começar? Primeiro passo para o mundo WebDev
Frontend • Programação do lado do cliente • HTML •
CSS • JavaScript • GIT
Faça projetos • Crie um portfólio • Use a criatividade
• Clone interfaces • Publique seu site
Não deixe de aprender GIT • Controle de versão
Competências do Frontend
Responsividade
Experiência e Interface com usuário
Desempenho
Compatibilidade
SEO ( Search Engine Optimization )
Acessibilidade
O próximo nível do Frontend
Bibliotecas e Frameworks • Produtividade • Funcionalidades avançadas • Desempenho
• Complexidade
Componentes e temas
Design System
Fim