WebDev: Introdução ao desenvolvimento Web

Transcript

1. WebDev Introdução ao desenvolvimento Web
2. About + Empreendedor de sucesso + Físico teórico + Viajante + Escritor + Músico + DJ + Cabeleireiro + Dev Maromba
4. Beto empreendimentos
5. About + ErreJota <3 Bangu + Ciência da Computação (NaN/8) + Dev Fullstack na Suzano + Tech In Rio + Praia + Rave / Rock
6. O que é WebDev?
7. Criação de sites?
8. Os sites mudaram um pouco
9. Evolução constante • Internet + rápida • Hardware + potente • Navegadores + poderosos • Dispositivos móveis
10. A plataforma que mais cresce • Lança uma vez • Alcança todos dispositivos • Menor custo de desenvolvimento • Funcionalidades modernas
11. Como eu começo?
12. Ferramentas de trabalho WebDev • Browser (navegador) • Editor de código (opcional) • HTML • CSS • JavaScript
13. Editor de código
14. HTML ( Hyper Text Markup Language ) • Estrutura básica
15. CSS ( Cascading Style Sheets ) • O salão de beleza da web
16. JavaScript • O super poder da web
17. Como os websites são construídos • Planejamento • Design • Desenvolvimento • Testes • Publicação
18. Como funciona a Web?
19. Componentes principais Internet Servidores Clientes
20. A Internet
21. Servidores
22. Clientes • Arquitetura cliente-servidor
23. Video buffering • Sempre tem algo baixando
24. Baixando de onde? • Sistema de endereços na Web • Endereço IP
25. DNS – Domain Name System
26. DNS – Propagação
27. Tá tudo na nuvem
28. Cloud = computadores em todo lugar • Sempre tem um computador do outro lado • Não existe magia na nuvem
30. Sua internet pode cair por causa de tubarões
31. A grande sacada da nuvem • Delegar uma tarefa para outro computador • Unidos venceremos • Dividir para conquistar
32. Exemplo: ChatGPT • Elimine as limitações do cliente usando o servidor
33. API O grande garçom da web
34. API (Application Programming Interface)
35. Integração entre sistemas • Serviços prontos • Dados abertos
36. O céu é o limite • Gere valor acima de tudo
37. Por onde começar? Primeiro passo para o mundo WebDev
38. Frontend • Programação do lado do cliente • HTML • CSS • JavaScript • GIT
39. Faça projetos • Crie um portfólio • Use a criatividade • Clone interfaces • Publique seu site
40. Não deixe de aprender GIT • Controle de versão
41. Competências do Frontend
42. Responsividade
43. Experiência e Interface com usuário
44. Desempenho
45. Compatibilidade
46. SEO ( Search Engine Optimization )
47. Acessibilidade
48. O próximo nível do Frontend
49. Bibliotecas e Frameworks • Produtividade • Funcionalidades avançadas • Desempenho • Complexidade
50. Componentes e temas
51. Design System
52. Fim