O documento discute os desafios do desenvolvimento front-end em e-commerces, incluindo melhorar a taxa de conversão e ticket médio dos usuários. É destacado que velocidade da página, interface instável e formulários grandes podem afetar negativamente a conversão. Os desafios incluem trabalhar com múltiplos desenvolvedores, desenvolvimento escalável e performance do lado do cliente.

1. os desafios do desenvolvimento
de front-end em um e-commerce
@gbrlsepulveda

2. @gbrlsepulveda
# taxa de conversão
dos usuários que entram no site, quantos finalizam uma compra?

3. @gbrlsepulveda
ticket médio
em média, quanto os usuários gastam por compra?

4. @gbrlsepulveda
# como o front-end pode melhorar a conversão?

5. @gbrlsepulveda
Velocidade da página
interface instável
formulários grande
site não funciona

6. @gbrlsepulveda
# desafios de front-end

7. @gbrlsepulveda
múltiplos desenvolvedores
desenvolvimento escalável
performance client-side
testes a/b

8. @gbrlsepulveda
# trabalhando com vários desenvolvedores

9. @gbrlsepulveda
mantenha um code standard para o time.

10. @gbrlsepulveda

11. @gbrlsepulveda
consistência, legibilidade, sem bikeshed.

12. @gbrlsepulveda
git + pull requests

13. @gbrlsepulveda

14. @gbrlsepulveda
qualquer um revisa, qualquer um comenta.

15. @gbrlsepulveda

16. @gbrlsepulveda
# desenvolvimento escalável

17. @gbrlsepulveda
melhorias são constantes,
e nada é 100% definitivo.

18. @gbrlsepulveda
o código deve ser facilmente alterável/adaptável.

19. @gbrlsepulveda
dica 1
usem pre-processors de CSS. sério. agora. já. eu espero.

20. @gbrlsepulveda

21. @gbrlsepulveda

22. @gbrlsepulveda

23. @gbrlsepulveda

24. @gbrlsepulveda
geração automática de sprites acelera o
desenvolvimento.

25. @gbrlsepulveda

26. @gbrlsepulveda

27. @gbrlsepulveda

28. @gbrlsepulveda
Dica 2
módulos: poucas linhas, comportamentos isolados, extensíveis, e testáveis.

29. @gbrlsepulveda

30. @gbrlsepulveda
Dica 3
javascript desacoplado e modularizado

31. @gbrlsepulveda

32. @gbrlsepulveda

33. @gbrlsepulveda
performance client-side

34. @gbrlsepulveda
css/javascript
minification/compression

35. @gbrlsepulveda
lazy-load everything! o/

36. @gbrlsepulveda
sprites e imagens inlines

37. @gbrlsepulveda
não abuse de font-faces

38. @gbrlsepulveda
divirta-se. sempre. =)