React JS: Criando um app usando react hooks, tailwind css e consumindo API externa

No video

React JS: Criando um app usando react hooks, tailwind css e consumindo API externa

Рет қаралды 12,415

Күн бұрын

Nesse vídeo tutorial você aprenderá a criar um app de clima do zero usando React JS, React Hook, Tailwind CSS e consumindo uma API externa. Nesse app usando react js você verá conceitos importantes como: eslint, funções assíncronas, eventos sintéticos, hooks, estilização e design responsivo usando tailwind css.
Etapas do vídeo:
00:00:00 - Introdução
00:00:57 - Limpando o projeto
00:02:39 - Configurando o eslint
00:04:40 - Resolvendo os primeiros erros de lint
00:07:29 - Instalando o tailwind css
00:09:58 - Criando form para pesquisar cidade
00:12:52 - Estilizando form
00:20:41 - Criando card para mostrar informações
00:26:54 - Estilizando card
00:36:20 - Conhecendo a API
00:42:01 - Criando função para buscar dados
00:48:20 - Criando função handleSubmit
00:58:05 - Usando UseState para criar estado
01:09:44 - Usando os dados no Card
01:23:17 - Ajustando layout responsivo
01:28:16 - Final
Ativando Font Ligatures no Visual Studio Code:
• Font Ligatures no Visu...

Пікірлер: 39

@Thatwica1 3 ай бұрын

Caramba, não conhecia este canal mas já achei demais!! Que aula incrível, com certeza irei maratonar todas as outras, por favor continue realizando estas postagens me ajudou muito.

@matheusaugusto4901 2 жыл бұрын

Sua didática é muito melhor de todos os meus professores da faculdade, irmão! Continua! Talento puro.

@UpperWings Жыл бұрын

Outro excelente vídeo, Comecei a estudar front utilizando o basico, html css.. vendo os teus vídeos, e quando o meu projeto começou a ficar complexo e trabalhoso, migrei para um framework, e vim aprender sobre react contigo, Muito obrigado pelo excelente conteúdo. (traga mais vídeo de react se puder !!! :D)

@ilmardanilo 2 жыл бұрын

Que aula sensacional, mano. Sinceramente, se você criasse um curso eu compraria sem pensar kkkk

@eduardospek 2 жыл бұрын

Você tem uma ótima didática! Continue com o canal! Conteúdo muito bom! 👊🏽😎👏🏽👏🏽👏🏽👏🏽

@ManualdoDev 2 жыл бұрын

Muito obrigado, Eduardo. Tamo junto!

@TheLukasBer Жыл бұрын

Muito obrigado pela aula!!!

@julianamelo6348 Жыл бұрын

Entrou na minha cabeça agora coisas que não entrou em 3 meses de curso. Você é foda!

@erickmoura5250 2 жыл бұрын

Só tenho a agradecer pelo conhecimento que agraguei depois dessa aula, ainda mais sobre a explicação simplificada de promise que eu não entendia muito bem e aprendi vendo a aula :)

@edvaldojunior6329 Жыл бұрын

muito bom, parabens pela didatica

@leonardocampos1236 2 жыл бұрын

Mano, primeira vez que vejo o conteúdo sendo explicado com calma e de forma clara, faça um curso agora cara 👇🏽😡. Parabéns 👏🏽

@saul0r 2 жыл бұрын

Muito obrigado por essa aula, sua didática é ótima!

@Ryzedml06 Жыл бұрын

Mano, realmente, meu canal favorito dev 🔥

@euberkhoala1413 2 жыл бұрын

Cara, que aula incrível!! Sua didática é perfeita! Gostaria que vc fizesse algum projeto usando o react router, e os hooks useState, useEffect, useHistory . Valew

@ManualdoDev 2 жыл бұрын

Valeu demais, Euber! Pretendo fazer isso em! Em breve vou postar uma enquete aqui pra gente decidir o app e o conteúdo que mais interessa vocês! Valeu!!!

@dayadiaz327 Жыл бұрын

Ainda não assisiti, mas esse projeto tem tudo para ser um ótimo projeto para quem ta começando (tipo eu) os estudos em ReactJS, falo do contéudo em sí, hooks, tailwind, consumir API externa. Vou assistir, vamos ver, mas desde já, obrigada pelo conteúdo gratuito para a comunidade Dev Jr.

@murilo7091 Жыл бұрын

Massa! Acompanhei o vídeo inteiro, curti o projeto

@dansoares572 Жыл бұрын

Eu assisti ao conteúdo do canal, no total de 2 vídeos até este comentário, mas fiz minha inscrição antes de terminar o 1º vídeo. Quero parabenizar você pelo seu conhecimento e pela ótima didática ao repassá-lo. O conteúdo é 100% top, nossa cara! prazer de ver tudo isso por aqui. Continue este trabalho bacana!👏👏👏

@EnglishBay 2 жыл бұрын

Boa!

@mundocast1283 2 жыл бұрын

Parabéns, tu explica de um jeito simples

@danieldealmeida3101 2 жыл бұрын

Muito boa didática. Vi o vídeo do form também muito bom. Depois faz um outro mostrando a usar o Vite ao invés do create-react... Boas monetizações pra ti

@ManualdoDev 2 жыл бұрын

Boa ideia, Daniel! Tamo junto. Valeu :D

@carloshenrique210 2 жыл бұрын

Gostei do vídeo! Explica muito bem! Quero aprender isso!!!

@leandrocavalcante6793 2 жыл бұрын

MUITO TOP SUAS AULAS.

@felipeabreu7696 2 жыл бұрын

Cara, faz um favor? NÃO PARA DE POSTAR. E se um dia lançar algum curso de programação eu vou ser o primeiro a comprar. Sua didática é excelente. Abraços

@ManualdoDev 2 жыл бұрын

Muito obrigado pelo apoio, Felipe! Tamo junto! :D

@peter8796 3 ай бұрын

mano, nao para de fazer isso!

@dev7452 2 жыл бұрын

Incrível mano

@kauaevangelista5498 Жыл бұрын

Cara que ótima didática, eu queria te perguntar se você poderia postar esse projeto no seu Github por favor 🙏🏻

@JulioCesar-or4wl 2 жыл бұрын

se você lançar um curso, eu compro! se tiver de backend também ai que eu pago o dobro.

@ManualdoDev 2 жыл бұрын

Valeu demais pelo apoio, Júlio César! Já já sai conteúdo de Backend no canal em! Tamo junto, cara! :D

@leandrocastro50 Жыл бұрын

alguem poderia me ajudar? n consegui colocar o codigo "npx create-react-app .", oq posso ter feito d errado?

@joaonazz 2 жыл бұрын

top

@felipeleopoldino5185 Жыл бұрын

alguem tem o repositorio desse projeto? to com problemas na hora de fazer o deploy .

@walney2008 2 жыл бұрын

show, tem algum curso publicado na udemy ?

@skittleboy1766 Жыл бұрын

que sistema operacional você usa?

@ManualdoDev Жыл бұрын

Uso o Zorin OS

@marianymoraes974 2 жыл бұрын

Alguém já tem o código pronto ?

@Desker_ 2 жыл бұрын

Lá pela chapter "Usando UseState para criar estado", quando tu seta o onChange pra pegar o que é digitado no form, não deveria ser no onSubmit? Parece desnecessário e ineficiente ficar pegando cada letra que é digitada no form, já que tu só vai usar o input, quando ele estiver completo e for enviado, então era só colocar no onSubmit, que passaria o que está no form, pro setState q colocaria na variavel city e usaria pro fetch