Conteúdo original nesse tweet

Ei dev frontend,

Vamos fortalecer nossa amizade com um desafio que preparei especialmente pra vc?

Quero só ver você fazer um frontend que se conecta a uma API que oferece um streaming de valores de ações usando Server Sent Events ─ SSE!

Chega mais.

cc @sseraphini

↓

Não é o objetivo dessa thread explicar o que é SSE (dá uma pesquisada no Google). Mas, muito por cima, SSE funciona como uma forma do client receber um fluxo constante de informações do servidor ─ um streaming. É tipo um websocket só que a direção é só do server para o client.

Depois dessa introdução porca, vamos ao desafio!

Faça um frontend que se conecte a API (que já fiz e dockerizei com carinho pra você) pra começar a receber o fluxo de cotações de ações. Invente algum jeito de mostrar isso de forma dinâmica ─ um gráfico dinâmico pode ser legal!

Vamos às instruções pra você começar.

O jeito mais fácil e recomendado é

1. Subir um container docker;
2. Entender mais ou menos como funciona; e
3. Finalmente fazer um front do seu jeito.

Vamos detalhar cada passo à seguir.

1 . Subir um container docker:

docker run --rm -p 8080:80 zanfranceschi/desafio-02-frontend_e_sse

Mais fácil que dormir a tarde depois de comer uma feijoada.

2 . Entender mais ou menos como funciona:

Depois de ter subido o container, simplesmente navegue até http://localhost:8080/. Eu montei uma coisa bem básica e horrorosa pra você se incomodar e fazer melhor. Olha o fonte pra ter uma ideia.

3 . Finalmente fazer um front do seu jeito:

Essa parte é importante você fazer do jeito que quiser, tá?

Entretanto, se quiser ou precisar duma sugestão, dá uma olhada na lib highcharts e nos seus gráficos dinâmicos.

https://highcharts.com/demo

https://highcharts.com/demo/live-data

Tudo que fiz pra esse desfio está disponível no github caso queira dar uma olhada.

Se você fizer o desafio e versionar no git, abre um pull request pra adicionar um link no README do repo desse desafio, tá? Vou ficar muito feliz!

https://github.com/zanfranceschi/desafio-02-frontend_e_sse

Se chegou até aqui, não preciso nem dizer, né? ❤️

Muitos anos atrás, durante uma aula na faculdade, uma professora falou que "a qualidade do software é ditada pela interface com o usuário". Na hora achei errado, mas hoje consigo entender o que ela quis dizer. E ela tá certa!