badge Widget de Previsão do Tempo Utilizando Web Component
PROJETOS

Widget de Previsão do Tempo Utilizando Web Component

Já pensou criar um componente e utiliza-lo em qualquer framework, biblioteca JavaScript ou até mesmo páginas sem qualquer tecnologia específica? Sem se preocupar com conflitos de CSS, replicando os comportamentos nativos dos componentes do browser? Aplicando as especificações utilizadas para construir web components tudo isso é possível. Nesta Live Coding você irá aprender de maneira prática a construção de um widget para exibir a previsão do tempo e como utiliza-lo nas principais tecnologias utilizadas no front-end. Serão abordados conceitos de Web components e suas especificações no React e VueJS, e será realizado consumo de APIs rest.

IntermediárioFull-Stack
JavaScript image
JavaScript
Inicie o desafio

Preencha seus dados

Ao clicar em "começar agora", declaro que aceito as Políticas de Privacidade e os Termos de Uso da DIO.

O que você vai desenvolver </>

Objetivo: O objetivo deste projeto prático hands-on é criar um widget de previsão do tempo utilizando web components em JavaScript e aprender a utilizá-lo em diferentes frameworks e bibliotecas do front-end, como React e VueJS.

Descrição: Neste projeto, será construído um componente de previsão do tempo que poderá ser utilizado em diferentes tecnologias, independentemente do framework ou biblioteca utilizada. O foco será em utilizar as especificações de web components para replicar o comportamento nativo dos componentes do browser, sem preocupações de conflitos de CSS.

Durante a Live Coding, será demonstrada de maneira prática a construção do widget de previsão do tempo utilizando web components. Serão abordados conceitos de web components e suas especificações, como a criação de custom elements, shadow DOM e HTML templates.

Além disso, serão apresentadas as formas de utilização do widget em diferentes frameworks e bibliotecas, como React e VueJS. Serão mostradas as melhores práticas e as adaptações necessárias para integrar o componente em cada tecnologia.

Requisitos técnicos:
- Conhecimento intermediário de JavaScript
- Familiaridade com o desenvolvimento front-end
- Ambiente de desenvolvimento para JavaScript
- Acesso a uma API de previsão do tempo (exemplo: OpenWeatherMap)

image
image EDUCAÇÃOimage EMPREGABILIDADEimage COMUNIDADE
image

Torne-se a opção Nº 1 dos recrutadores e conquiste as melhores vagas do mercado tech

De R$ 718,80 por
R$29
,90 /mês
no plano anual
COMECE AGORA

Com o o DIO PRO você irá:

  • image fy section

    Acesso ilimitado a todos os bootcamps

    E mais de 40 formações profissionais do zero ao avançado para você dominar as tecnologias nas carreiras front-end, back-end, data & analytics, mobile, cloud & DevOps e se preparar para trabalhar em grandes projetos nas empresas mais inovadoras do mundo

  • image fy section

    Mais de 180 projetos práticos para ganhar experiência

    Libere acesso ilimitado a uma área com mais de 180 projetos e 650 cursos para você aprender, comprovar experiência prática e ter um portfólio de destaque no mercado

  • image fy section

    Fazer parte das maiores e mais inovadoras empresas do mundo

    Certifique suas habilidades, ganhe experiência, suba no ranking de talentos e fique em destaque para recrutadores de empresas como iFood, Santander, Carrefour e outras dezenas que contratam profissionais na DIO.

    image

Sobre a DIO

ACADEMIA PME EDUCACAO E CONSULTORIA EM NEGOCIOS LTDA.
CNPJ: 26.965.884/0001-02

A DIO é a maior comunidade de aprendizado contínuo em tecnologia da América Latina, que conecta os melhores talentos com as empresas mais inovadoras do mundo.

Um ecossistema educacional completo para aprendizagem em desenvolvimento de software, engenharia de dados, qualidade de software e computação em nuvem.