Back to Browse

FRONT-END BÁSICO: Aplicação Web Star Wars (HTML + CSS + JAVASCRIPT), PT 1

20.1K views
Jul 31, 2022
37:01

Você que ainda não está na nossa comunidade do discord, entre hoje mesmo: https://discord.gg/XDwQuGWuhK Fala Coders, Fico feliz que você esteja acompanhando nossa sequência de front-end básico aqui no canal. Neste segundo vídeo da série, quero trazer dois conceitos bem imporantes na jornada de um programador web: o consumi de API e criação de layouts no CSS, usando o flexbox. Basicamente, toda aplicação de front-end precisa se comunicar com um API para que os dados sejam recebidos e mostrados na tela. Se temos um sistema de login, por exemplo, o front-end envia para o back-end os dados de e-mail e senha para serem processados e receber um retorno, se aquele usuário pode seguir para parte autenticada ou se houve algum erro. No nosso caso, vamos consumir uma API, já utilizada aqui no canal antes, para exibir os filme da saga Star Wars. O JavaScript disponibiliza para usarmos uma função chamada fetch, pela qual conseguimos receber o resultado de uma requisição feita à uma API. Uma maneira de verificar os dados recebidos de uma aplicação back-end, é usando um app de API Cliente, como é caso do Insomnia. Vou mostrar para vocês como se utiliza essa ferramenta para verificar os resultados obtidos da api de filmes. Com os filmes recebidos, vamos mostra-lós na tela por meio do HTML e CSS, usando os principios do flexbox para deixar os elementos centralizados na tela e assim conseguirmos mostrar a tela de uma forma bonita. Links utéis: Download do Insomnia: https://insomnia.rest/download Link para API de filmes: https://sevencoders-starwars-wiki.herokuapp.com/films Link para imagem usada: https://github.com/SevenCoders-Academy/starwars-wiki-expo/blob/main/assets/LogoEmpire.png SevenApps: https://www.sevenapps.tech Meu Instagram: https://www.instagram.com/gabriel.rangel7 #programação #frontend #html #css #javascript #programador #webdevelopment #web

Download

0 formats

No download links available.

FRONT-END BÁSICO: Aplicação Web Star Wars (HTML + CSS + JAVASCRIPT), PT 1 | NatokHD