Curso React: Entendendo o JSX - #03
Вставка
- Опубліковано 8 лют 2025
- 🔵Conheça nosso curso completo de React JS: app.horadecoda...
📘 Ebook gratuito de React: www.horadecoda...
★ Nossos Cursos: www.horadecoda...
Neste vídeo vamos conhecer um recurso muito utilizado no #React o #JSX
Que é a forma que escrevemos HTML no React, podendo deixar ele dinâmico, imprimindo valores de propriedades ou variáveis e também executando lógicas simples
Repositório: github.com/mat...
★ Livros recomendados: www.horadecoda...
▶ Instagram: @horadecodar
▶ GitHub: github.com/mat... 🔷 Telegram: t.me/horadecodar .
🟣 Discord Hora de Codar: / discord
🔵Conheça nosso curso completo de React JS: app.horadecodar.com.br/course/curso-react-js-completo
Pow mano tomei uma surra pra descobrir como abrir novamente o projeto, eu tinha conseguido já com npm start, mas recriei umas 3x e passei mais de uma hora pesquisando como abrir de novo kkk, cada dia uma lição, tem hora que a gente empaca em cada coisa básica.
e como foi?????? eu to com o mesmo poblema
e como foi, tbm estou com esse problema?
@@emillyferrao29 vc tem q dar no terminal um cd (nome da pasta q esta o seu projeto) e ai dps npm start
@@maxsteelz1k Nossa cara, obrigado. Não estava conseguindo, foi só da o diretorio que deu certo.
Uma coisa que senti falta no VScode usando o JSX é o auto-complete que tem no HTML. Lá vc escreve um simples p e ao apertar enter ele já carrega a tag , o mesmo para imagens etc. Nesse JSX ele até fecha a tag sozinho, mas vc ainda precisa abri-la por completo. Eu sei, não é lá nenhum problema, mas até que faz falta. E eu queria comentar para gerar engajamento.
Eu estava procurando a msm coisa ksksk, Vc já descobriu alguma extensão que faz isso? Ou alguem ai sabe uma para indicar?
Se puder me ajudar com uma dúvida sobre o jsx. Em suma, a gente usa ele em vez do html?
Ctrl + V de um comentario la abaixo
"Também tava com esse problema, se for no VSCode, vai na parte inferior direita, clica no nome da linguagem que estiver aparecendo, digita react na aba de pesquisa que abrir escreva "react" e selecione "JavaScript React""
Faço isso .na Ide Vscode:
Gerenciar / Configurações / Abrir Configurações (Icone de Folha) / settings.json
Nesse arquivo adicionar esse codigo e salve no ctrl + s
,
"emmet.includeLanguages": {
"javascript": "javascriptreact",
"typescript": "typescriptreact"
}
É só criar componentes com a extensão .jsx no lugar de .js. Ex: Home.jsx.
Esse curso é melhor que muitos cursos pagos. Parabéns!
valeuu! sugiro dar uma olhada no meu curso completo: horadecodar.com.br/comunidade-hora-de-codar/
A gente vê que o curso é bom quando na primeira aula o professor já nos retém! Muito bom!
cara uma das melhores didáticas do UA-cam, se não a melhor!!
To aprendendo muito js contigo, e agora to aprendendo mais ainda o React!
Você é nota 10 como professor e programador!
valeu Lucas =)
Excelente curso! Até pra quem já é expert em React, vale muito rever certos conceitos
valeu brother!
Consegui começar a entender React por sua causa. Ótima didática de ensino. Obrigado
Obrigado mestre, faça mais vídeo sobre React, já que ele é muito importante hj.
Vc me ajudou muito, estava procurando mais para aprender.
opa Alex, amanhã sai outro =))
Grande Matheus!!!!!
Cara você e o professor que só consigo aprender com você, já tentei outros mais não rola
você tem o dom de ensina, parabéns Brothers
e muito muito obrigado.
valeu Rafael, vamo q vamo!
Cara, esses cursos de React do Matheus está me salvando demais depois de comprar cursos de React e me frustrar demais... Muito bom demais!
e tá vindo o completão Rodrigos, Abril teremos xD
perfeito , otimo ensinamento , MUITO DETALHADO E FÁCIL , ESSE CARA É NINJA !
Que curso excelente, Matheus. Obrigado por disponibilizar
Muito bom adorei a didática! Simples e objetivo!
Até o momento as aulas estão incríveis, parabéns mesmo!
Valeu!
Ótimo curso, muito boa a sua didática.
Vim parar no seu canal por conta de uma indicação no fórum de um bootcamp em que a galera estava perdida no react (me incluo nessa) e agora eu que indicarei para outras pessoas.
show Eliandra, muito obrigado! =D
Parabéns pelo pelo curso Matheus, show de bola.
valeu Iremar! =)
estou fazendo bootcamp que essa área estava bem confusa mas suas aulas me ajudaram, aprendi aqui e executei lá.
Show Matheus, ansioso pelo curso, tmj 👊🏻
opa Marcelo, amanhã tem mais =))
To amando seu curso, pretendo terminar esse e ja começar outro, estou com um projeto grande para ser feito, um site completo de uma empresa de jogos
opa Josi, que massa! Posso te ajudar mais, se liga na Comunidade: horadecodar.com.br/comunidade-hora-de-codar/
Parabéns , estou aprendendo muito , didática excelente 👏🏻👏🏻
valeu Rodrigo!
⭐ Conheça a nossa plataforma de cursos: www.horadecodar.com.br/comunidade-hora-de-codar/
Acompanhando o curso... Obrigado!
de nada =D
Obrigado por compartilhar seu conhecimento
opa Andre, de nada =))
Parabéns Matheus, didática excelente!
Curso excelente, irei comprar o curso da udemy
Ótima explicação!
Nossa que incrivel, bom que estudei html, css, java script, bootstrap antes, da pra entender de boas as aulas
isso é o basico né, sao pré requisitos pra aprender react ou vue ou angular.. saber html, css e js...
To curtindo pra caramba as aulas
Didática excelente!!
valeuu! =)
Aula top professor, muito massa recomendo!
obrigado Anndre! =)
Gostei dessa aula o jsx do react eh como o blade do laravel
Ótima didática. Sensacional!
Excelente aula, conteúdo show!!
valeuu Everaldo!
tu é meu ídolo s2
Bora bora!!
Muito bem explicado!
obg pela aula prof
CARA TU É MT BOM
valeu!
Aula top 💪💪
Aula Excelente, obrigada!
excelente conteúdo valeeeeuuu
valeu!
Como ficou fácil entender, obrigada!
Adorei!
muito obrigado! =)
Cara parabéns pelo vídeo. Mano juro que entrei aqui só pra te zuar. Achei que vc estava vendendo curso de React kkkkkkk. Mas react de vídeos. Preciso ficar 1 semana sem internet, to ficando louco .... Mais uma vez parabéns pelo vídeo.
Hahahhahaa imagina só 😂
Ótima didática, parabéns
Muito bom 👏
valeuu Zeriel! =)
Me ajudando bastante, mano. #tmj
Parabéns , você é muito bom ensinando
Valeuu amigo! 😀
Tá ótima a explicação, vlw kk
Top!
o bom é que puxa facil tipo Olá {name} não precisa colocar o $ na frete e as crazes
deixando meu comentário pra ajudar.
Queria saber que extensão tu táusando pra ter esse auxilio no código, dps que mudei pra react ele sumiu, to tendo que digitar a tag toda antes só digitava h2 e dava tab e funcionava
boa!
Visto
Muito bom
Obrigada pelo conteúdo! gostaria de saber quais extensões você usa. Eu procurei alguma que feche a tag de HTML facilmente, mas não encontrei
show!
Top
Comecei o curso e percebi que o recurso de auto completar do HTML não está funcionando. Após realizar algumas pesquisas, descobri que para solucionar esse problema basta adicionar as seguintes linhas ao arquivo settings.json do Visual Studio Code:
"emmet.includeLanguages": {
"javascript": "javascriptreact",
"Markdown": "HTML5"
}
Essa configuração irá habilitar o auto completar do Emmet tanto para arquivos JavaScript com sintaxe React quanto para arquivos Markdown com sintaxe HTML5. Espero que isso ajude mais alguém!
Matheus, como configuro o meu VS Code pra sugerir o que vou escrever em HTML no arquvo JS? Exemplo: vou colocar uma tag de img, e aí o editor já sugere a tag com o src e tudo, da mesma maneira que escrevendo um arquivo HTML?
Ctrl + V de um comentário lá de baixo - Eu fiz e deu certo!
"Também tava com esse problema, se for no VSCode, vai na parte inferior direita, clica no nome da linguagem que estiver aparecendo, digita react na aba de pesquisa que abrir escreva "react" e selecione "JavaScript React"
@@marianasorrentino1078 Fiz aqui e não resolveu :/
Muito obrigado mein froind
Se a lógica não vai ficar nesse arquivo app, então nós vamos linkar para um outro arquivo Javascript?
Parabéns professor pelo curso estou gostando muito! Será que vc ppoderia me dar um cupom para o curso da Udemy?
Não estou conseguindo proceguir corretamente pois quando vou criar o projeto reat mostra esse erro: (npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.), o que devo fazer pois nem as resolições da net estão dando jeito
essa aula travou pramim, pq no meu projeto esse arquivo App, veio como uma classe que extendes a componentes,, e na aula tem uma função App() só... e quanto mais eu mudava mais dava erro kkkk
como que tá tendo emmet abreviations de html dentro de arquivo .js ?
Meu visual studio não aucompleta elementos html dentro de arquivos .js. Como faço pra habilitar?
como eu faço pra completar a tag dessa forma ? minha tag se auto completa la no codigo html, mas quando uso ai no codigo conforme o video, ele n se auto completa.
estou tendo um problema que as tags não estão se autocompletando para mim, por exemplo, eu preciso colocar o h1 todo, ao invés de h1 e enter, sabe como faço para arrumar isso?
Responder
Mn, estou tendo um problema que as tags não estão se autocompletando para mim, por exemplo, eu preciso colocar o h1 todo, ao invés de h1 e enter, sabe como faço para arrumar isso?
No JSX as tags HTML não estão com sugestões, tenho que digitar letra por letra. Sabe como resolver isso?
Também tava com esse problema, se for no VSCode, vai na parte inferior direita, clica no nome da linguagem que estiver aparecendo, digita react na aba de pesquisa que abrir escreva "react" e selecione "JavaScript React"
@@guisantos6133 Funcionou! Muito obrigado mano!
@@daniloxzx Por nada. Agora que vi que escrevi React duas vezes 😅
@@guisantos6133 Obrigado!
Valeu
tenho dois navegadores, brave e chrome. Sempre que inicio o react ele abre no brave, como faço pra ele abrir no chrome como padrão?
sla, se colar o link n vai?
coloca o crome como padrao
como finalizar no terminal do mac?
Como cria um projeto react sem o create-react?
procura por Vite
fechei e abri meu vs code e deu erro no meu 'npm start' alguma solução ?
Galera, não consigo rodar o npm start... Fui iniciar novamente e deu um erro 4058 no terminal."no such file or directory"... Alguém sabe como resolver?
Alguém sabe me responder o motivo de que o meu vscode não completa as tags HTML? Realmente faz sentido não completar por se tratar de um arquivo .js, mas no vídeo do Matheus está completando, talvez seja algum plugin
O meu também tá assim, mano. Conseguiu arrumar?
Meu InteliSense não dá sugestão quando escrevo em html dentro do App.js, alguém sabe como posso resolver?
Fechei e inicializei no dia seguinte, abriu no chrome mas não mostrou nada na tela. Oq pode ser?
Tem q dar npm start dnv kkkkk
como reinicia o projeto react? estou usando os comandos ctrl + c e npm start mas esta dando erro.
talvez tu tenha colocado o caminho errado , o final deve tá assim "" , tente por ''" (acho q foi esse o nome que tu deu pra pasta), vc vai digitar isso: "cd. \meu-projeto". Quando tu fizer isso utiliza o npm start
Acho que até o nome da palavra reservada className poderia ser classCss.
ativa o modo noturno toda hora uma bang na nuca
02 - 28/06/2024
MEU NÃO ESTÁ FUNCIONANDO, APARECE ISSO ALGUÉM SABE?
npm ERR! code ENOENT
npm ERR! syscall open
npm ERR! path C:\Users\ThinkPad\Desktop\arquivos\package.json
npm ERR! errno -4058
npm ERR! enoent Could not read package.json: Error: ENOENT: no such file or directory, open 'C:\Users\ThinkPad\Desktop\arquivos\package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent
npm ERR! A complete log of this run can be found in: C:\Users\ThinkPad\AppData\Local
pm-cache\_logs\2024-01-04T20_48_44_427Z-debug-0.log
PS C:\Users\ThinkPad\Desktop\arquivos>