Galeraaaaa, aviso MUITO IMPORTANTE: Desde a gravação deste curso, o react-router-dom atualizou sua versão para a V6, o que mudou algumas coisinhas, e muitos alunos estão relatando erros ao utilizá-lo. Portanto, na hora de instalá-lo no projeto, utilize o seguinte comando: npm install react-router-dom@5.2.0 Assim, vocês usarão exatamente a mesma versão que usei no curso (a V5). Abraços!
Felipe quando uso o npm install react-router@17.0.2, surge o seguinte erro (pode ser por que já havia instalado como o tutorial informa) npm ERR! notarget No matching version found for react-router@17.0.2.
Algumas alterações de atualização que tiveram impacto nessa aula (que eu percebi kk) o react-router-dom atualizou, e mudou que: Você não pode criar um Route sem estar dentro de um , pois a Route se tornou filha necessáriamente. O useHistory foi substituído para useNavigate, então no momento que você coloca o history.push(`${taskTitle}`), pode simplesmente colocar history (caso você não mude a const, apenas de useHistory() para useNavigate() em const History) Para voltar na página, você pode colocar (caso ainda esteja usando tipo const history = useNavigate(), você pode escrever history(-1) para voltar a página. Mas recomendo que mude esse history para navigate)
Aula muito boa até onde vi, o problema é que chegou em um momento em que os nomes atrapalharam demais. "Tasks", "tasks", "Task", "Task.js", "Tasks.js", aí eu perdia mais tempo tentando saber como era a escrita e em qual local colocar do que em analisar o código em si e entender. Acho que se mudasse isso ficaria perfeito.
Me senti do mesmo jeito, eu estava entendendo, mas depois me embananei todo com os nomes que ele dava pros arquivos e td mais, sei que da um da o nome acha bom pro.momento, mas pra explicar assim fica bem confuso, vou ter que ver mais algumas desenas de vezes, mas a aula é bem boa
Felipe, tenho TDAH e sofro muito para estudar programação, estou tendo uma evolução bem lenta no trabalho e estava bem desanimada com tudo. Hoje decidi procurar um curso de React para tentar aprender algo novo pra ver se me interesso mais em estudar (atualmente estou trabalhando em um projeto com AngularJS e isso tem me deixado bem desmotivada). Achei esse seu curso por acaso e vou te contar, consegui assistir o vídeo completo tendo apenas alguns minutos de distração. A forma como você conversa com a gente como se estivessemos em uma call descontraída me cativou total e me ajudou muito a manter o foco no aprendizado. Nunca havia mexido com React antes e estou muito feliz com o tanto que aprendi. Já me inscrevi no canal e por favor continue com esse conteúdo maravilhoso. Com certeza irei acompanhar os outros vídeos. Abraço e minha imensa gratidão pela passagem de conhecimento, você está sendo luz para muitas pessoas! 🌹
Já faz um tempo que postou esse vídeo, mas tive a oportunidade de vê-lo somente hoje, e que bom que cheguei até seu vídeo. Didática espetacular! Já sabia algumas poucas coisas do react, mas vendo seu vídeo agregou demais. Obrigado por compartilhar seu conhecimento conosco. Sucesso
mano do ceu concodo muito bom vc tipo pra eu que ainda to aprendendo então que as vezes acho que a task é um comando kkkkkkkk mas sensacional fiquuei apaixonado pelo react
@@Allexmatrix é confuso mas tbm n é algo de outro mundo. Tasks é o componente das tarefas, tasks a variável com os dados e Task o item de cada dado da classe Tasks
Rapaz... Você merece ser aplaudido de pé por postar essa aula de React. Sua didática foi excelente e explicou de uma forma bem simplificada e fácil. Sou iniciante no React e já conhecia alguns conceitos, mas esse vídeo ajudou muito a "clarear" alguns pontos em que eu tinha dúvidas. Muito obrigado pelo vídeo e se possível poste mais conteúdo de React, que está nos ajudando muito. Sucesso ao canal. Ganhou mais um inscrito.
Obrigado felipao, seus vídeos tem me ajudado muito e com certeza milhares de pessoas!! Estou na mudança de carreira, estudando programação e quando tenho duvida de algum assunto já venho certo no seu canal pra esclarecer, pois sua didática é muito boa, conteúdos complicados você explica de uma forma simples!!
Cara, sensacional a tua didática. O teu astral é tal legal que nem parece que estamos em uma aula, parece que estamos em um ambiente descontraído, sei lá uma mesa de um bar tomando uma ceva e tu está ensinando. A gente vem aqui assisti uma hora e quarente de vídeo e nem vê o tempo passar kkk. Mais uma vez parabéns.
Quando chegou próximo aos minutos 30,30 e poucos eu comecei a achar muito confuso porque tinham 3 ou 4 elementos com um nome muito parecido - Task ou tasks. Mas fui paciente e deu pra absorver legal o conhecimento. Muito obrigado pelo conhecimento compartilhado conosco!
Revi o vídeo hoje com mais experiência. Realmente é bem confuso vários componentes e props com nomes extremamente parecidos. Fora isso, ótimo vídeo! Muito bom mesmo.
muito bom, meu proximo projeto quero iniciar pelo front end com react, o backend faço com laravel depois, pena q estou com um projeto já em andamento e terminando o front end, se não teria usado o react... ganhou mais um inscrito...
Agradecer pelo conhecimento passado, sou bem iniciante e aos poucos tô conseguindo pegar. Destaque para o formato da aula, objetiva, prática e comunicação super natural. Sucesso!
Cara, vi o mesmo projeto em diversos cursos ensinando. Você foi o único que eu consegui entender sobre ReactJS. Parabéns, continue com o trabalho fantástico!
Felipão, Deus te abençoe meu bród. Eu tava ficando maluco com a b@#$a do Angular. Você resolveu minha vida com esse trem atomico aí. Muito sucesso pra você.
Trabalho com vue e tive curiosidade de ver como funciona o react. Tenho uma visão diferente em relação a criação de css. Normalmente crio componentes com variáveis scss diretamente no arquivo do componente vue. Esse scss é criado de uma maneira em que eu consigo deixar as variáveis com valores padrão no componente e com possibilidade de alteração externa. Fica muito reutilizável, até mesmo para a parte de estilização. React possui formas de injetar props do componente pai para o filho sem precisar enviar via props?
Muito show, hoje conseguir conclir o Curso de ,HTML, CSS e React Para Completos Iniciantes, estou migrando da linguagem DELPHI/Oracle onde trabalho desde 2003... acreditado na metodologia do Full Stack CLUB...
Parabéns pelo curso. Muito bom. Eu comecei a usar React mas estava um pouco perdido. Agora as coisas ficaram mais claras, apesar desse vai e vem das funções, isso complica bastante para quem está começando.
Excelente aula, parabéns. Aguardando por mais 😃 Uma dúvida. Porque no momento 1:02:38 foi necessário utilizar uma Arrow Function? Porque não funciona colocando simplesmente handleTaskDeletion(task.id)?
Vídeo muito top, me ajudou muito! Uma sugestão que eu poderia dar pra galera seria oprgfanizar os componentes em pastas, colocando o arquivo .jsx e css de cada um em sua propria pasta. Acho que assim os arquivos do projeto ficam mais clean, facilitando na organização da estrutura do projeto!
" Galeraaaaa, aviso MUITO IMPORTANTE: Desde a gravação deste curso, o react-router-dom atualizou sua versão para a V6, o que mudou algumas coisinhas, e muitos alunos estão relatando erros ao utilizá-lo. Portanto, na hora de instalá-lo no projeto, utilize o seguinte comando: npm install react-router-dom@5.2.0 Assim, vocês usarão exatamente a mesma versão que usei no curso (a V5). Abraços! "
na hora de instalar o React Router Dom você utiliza esse comando (npm install react-router-dom@5.2.0), que especifica a versão que voce quer instalarç. Qualquer dúvida manda ai que tento te ajudar!
Cara muito obrigado pelo video, se quer uma dica construtiva pro canal, tente aumentar o volume do video usando algum software iria ajudar mt, porque está bem baixo e minha caixinha ficou no talo, de resto mt bom, bem explicativo!!
Felipe não consigo usar o params tem alguma dica do que pode ser, quando eu boto o parentes some da minha tela const params = useParams() no minuto 01:19:30, por favor me ajuda 🥺(sua aula é muito boa, parabens!!!!!!)
Galera, quando escreve uma / no nome da task por exemplo : Lista de compras 20/5; invés de passar pro task details como o titulo, ele acessa como se fosse uma rota pq o dado é passado pela url. Eu fiz um replace no history.push "history.push(`/${task.title.replace("/", "-")}`);"
Atualização! O problema de usar daquele jeito é que vai substituir somente o primeiro /. É melhor usar : history.push(`/${task.title.split("/").join("-")}`); Pois vai substituir todos!
Excelente curso, das poucas vezes que trabalhei com web sempre usei Bootstrap e JQuery, mas porém agora surgiu a necessidade de usar React em um projeto, seu vídeo está sendo de grande ajuda
Felipe, concluí o projetinho! Muito legal cara, parabéns. Minha sugestão seria ao invés de popular com uma API, criar uma LocalStorage. Assim que desenvolveu pode usar no dia a dia. Estou aplicando aqui na minha. Abraçooo.
Acabei de assistir seu vídeo e percebi que você explicou React de uma forma muito didática, que explica o que faz cada detalhe do código, o que não estou achando muito na internet. Excelente vídeo, muito obrigado pela aula!
Cara ... tive que fzr esse curso em 1 semana kkkk tive que repetir várias vezes para poder entender um probleminha, mas finalmente consegui terminar! Muito obrigado pelo curso Felipe!
inscrito meu bom! eu venho tentando estudar react a semanas mas nunca peguei um tutorial sobre hooks, era sempre através das classes, eu não conseguia entender nada... em uma hora e meia eu entendi completamente o básico de react tanto pra hook quanto pra classes, me salvou de verdade! muito obrigado
Cara muito bom esse projeto. Fortaleci muitos conceitos sobre o react com esse projeto! Obrigado man!! 🙌 Só tive um problema que foi a parte de fazer a requisição da api com axios, mas consegui via fetch!
Raramente eu logo no youtube, mas tive que vir aqui parabenizar pela aula e me inscrever. Conteúdo muito bom, aula leve e didática incrível. Meus parabéns.
Até agora a melhor explicação de React que eu vi. Só não sei porque os comandos de estilização do CSS não funcionavam durante a minha tentativa. Eis a vida dura que temos, isso que eu chamo é programar a dor kkkkk
ótima didática, gostei da aula. Como ja mencionado antes, utilizar nomenclaturas diferentes e o som do mic achei um pouco baixo, mas amplifiquei o som aqui :)
Sensacional Felipe. Comecei React agora, e apesar, do curso ser um pouco mais acelerado, fui aos poucos aprendendo os conceitos um por um antes de avançar. Isso me ajudou a entender tudo o que você explicou. No fim, não é dificil e bem mais prático e gostoso de desenolver. Muito obrigado por nos ensinar essa biblioteca sensasional!
Que aula sensacional, me ajudou muito, de verdade. Sua didática facilitou bastante, pois como estou iniciando, tudo vira mais difícil, mas você conseguiu explanar bem o conteúdo e deixar tudo mais tranquilo. Sucessoo!!!
Mano, parabéns mesmo. Sempre tive dúvidas quanto a classes, pois sempre tem cursos usando-as, mas sua explicação tirou minhas dúvidas. Muito top mesmo. Obrigado!!!
Muito boa a aula consegui aprender bastante. Só fiquei com uma dúvida por que meus links atualizam mas a pagina não recarrega sozinha só muda quando dou um F5 para cada link que clico.
Na hora de adicionar, não mostrou o título, como resolver ? Já olhei outras vezes e não ví diferença nos códigos. O erro que tá dando é no handleInputChange = (e) => { setInputData(e.target.value)
Man, boa noite, tudo bem? Uma dica, que vale ouro. Eu não sou um cara tão experiente na área, atuei como dev fullstack 2 anos e meio, tipo, com PHP no backend, agora me surgiu uma granfe oportunidade em uma empresa muitoooo boa, porém pra atuar como front end, ou seja, pelo menos a princípio nada de back end. Tipo, tô meio assim, será que vale a pena e tal. Claro, depende de cada um e tal, mas tu acha que ter uma experiência somente voltada pra front end vale a pena? Digo, ficar um tempo sem necessariamente fazer nada no back end Obs: com o tempo eu posso me tornar um fullstack nessa empresa. Valeuuu, forte abraço
Felipe, obrigado por essa incrível aula, estou começando no React e já me ajudou muito esse seu vídeo. Minha aplicação não é mais exibida e estou com dois erros, caso alguém tenha passado por isso e puder ajudar por favor, já reinstalei várias coisas e não consigo resolver. A primeira foi quando adicionei o Router na aplicação ela não exibe mais minha aplicação e me retorna o seguinte erro no console: Uncaught Error: A is only ever to be used as the child of element, never rendered directly. Please wrap your in a . at invariant A segunda foi quando eu coloquei o hook useHistory, no terminal do VSCode me retorna o seguinte erro: export 'useHistory' (imported as 'useHistory') was not found in 'react-router-dom' (possible exports: BrowserRouter, HashRouter, Link, MemoryRouter, NavLink, Navigate, Outlet, Route, Router, Routes, UNSAFE_LocationContext, UNSAFE_NavigationContext, UNSAFE_RouteContext, createRoutesFromChildren, createSearchParams, generatePath, matchPath, matchRoutes, renderMatches, resolvePath, unstable_HistoryRouter, useHref, useInRouterContext, useLinkClickHandler, useLocation, useMatch, useNavigate, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRoutes, useSearchParams)
Curso Incrivel, tu explicou as coisas de forma simples e muito bem!!! Sua didática é fenomenal :D Uma sugestão seria continuar esse projeto usando o Firebase como banco de dados para guardar as Listas de Tarefas
o curso ta otimo, vc fala muito bem, mais é bom mudar o esquema de cores da proxima vez, pois no minuto 19:36, na linha 12 eu demorei bastante para ver que tinha dois () antes da =>.
Fala Felipe! Obrigado pelo projeto, ajudando muito no aprendizado. Estou tendo um problema ao clicar no ícone "Details" e botão "Voltar', está mudando a URL mas não está carregando o render de visualização, já pesquisei muito na web mas não encontrei nenhuma solução que resolvesse. Pode me ajudar? Desde já agradeço.
Que aula incrível irmão, parabéns! Pela sua didática consegui entender praticamente todos os conceitos e fazer o app somente tirando dúvidas no código escrito no segundo dia, vc é foda!
Parabéns cara, vídeo totalmente didático e direto, obrigado! Seria legal se fizesse agora este projeto porém com um nível mais avançado (se houver como). Seria interessante também você fizer o mesmo só que com VueJS (se souber).
Fiz tdo certinho do jeito que vc ensinou, mas os botões de informação e o de voltar n funcionam corretamente, tipo, crio uma task e quando aperto na info dela a página não carrega, preciso apertar f5 para carregar. já o botão voltar simplemente n está fazendo nada quando aperto nele. Como posso resolver esses problemas?
Consegui resolver o problema. Tinha tido um problema com a versão 6 do react-router-dom, então, por recomendação do Felipe eu instalei a versão 5.2.0. Porém, essa versão estava dando conflito com outras bibliotecas, então, voltei para a versão 6 e refatorei o código. No lugar do useHistory, utilize o useNavigate: import {useNavigate} from "react-router-dom"; const navigate = useNavigate(); const handleTaskDetailsClick = () => { navigate(`/${task.title}`); } No arquivo App.jsx importe utilize o Routes e substitua o render e o component por element, e passe um elemento: import {BrowserRouter as Router, Route, Routes} from "react-router-dom"; return (
Cara muito bom, parabéns, só tenho uma dúvida se alguém poder me ajudar, estou começando agora e consegui fazer esse app, se eu quiser hospedar ele na web, por onde começo? algum tutorial? de preferência gratuito só para testar como que fica.
To com dois "problemas", um ainda nao sei se ja era p funcionar mas vamos la. Estou no minuto 55 do vídeo. 1 - qdo adiciono uma tarefa ja na aplicação ela não fica salva, fica em tela só até abrir o app novamente. 2 - quando clico em uma tarefa ela fica com o borderleft, ok, mas a outra tarefa é desmarcada e vice versa, ou seja, só consigo dar "completo" em uma tarefa por vez.
![Curso de React para Completos Iniciantes [2024]](http://i.ytimg.com/vi/2RWsLmu8yVc/mqdefault.jpg)
Galeraaaaa, aviso MUITO IMPORTANTE:
Desde a gravação deste curso, o react-router-dom atualizou sua versão para a V6, o que mudou algumas coisinhas, e muitos alunos estão relatando erros ao utilizá-lo.
Portanto, na hora de instalá-lo no projeto, utilize o seguinte comando:
npm install react-router-dom@5.2.0
Assim, vocês usarão exatamente a mesma versão que usei no curso (a V5).
Abraços!
Felipe quando uso o npm install react-router@17.0.2, surge o seguinte erro (pode ser por que já havia instalado como o tutorial informa) npm ERR! notarget No matching version found for react-router@17.0.2.
@@rafaelvarela619 irmão, use o comando:
npm install react-router-dom@5.2.0
e me fala se deu certo!
@@dicasparadevs olá, estava com erro, aqui deu certo voltar para a V5!
Eu estava pesquisando como resolver isso, até que pensei em olhar os comentários... Resolvido 🚀
Depois que eu estava quase arrancando meus cabelos li essa comentário, meus olhos até brilharam !
Algumas alterações de atualização que tiveram impacto nessa aula (que eu percebi kk)
o react-router-dom atualizou, e mudou que:
Você não pode criar um Route sem estar dentro de um , pois a Route se tornou filha necessáriamente.
O useHistory foi substituído para useNavigate, então no momento que você coloca o history.push(`${taskTitle}`), pode simplesmente colocar history (caso você não mude a const, apenas de useHistory() para useNavigate() em const History)
Para voltar na página, você pode colocar (caso ainda esteja usando tipo const history = useNavigate(), você pode escrever history(-1) para voltar a página. Mas recomendo que mude esse history para navigate)
EU FIZ TUDO ISSO E DEPOIS QUE TERMINEI VIM OLHAR UNS COMENTARIOS HAHA DESCOBRI TUDO ISSO VENDO A DOCUMENTAÇÃO KKKK SOFRI MAS VLW APENA
Teria como escrever essa parte do código? alterei e não funcionou...
const history = useNavigate();
const handleTaskDetailsClick =() => {
history(`/${task.title}`);
};
era isso??
@@anaamaral6855 muito obrigadooooooo
@@eullertrindade1053 não funcionou o meu. Tive de instalar a versão do vídeo e fazer igual.
Ainda com dúvidas sobre o código
Aula muito boa até onde vi, o problema é que chegou em um momento em que os nomes atrapalharam demais. "Tasks", "tasks", "Task", "Task.js", "Tasks.js", aí eu perdia mais tempo tentando saber como era a escrita e em qual local colocar do que em analisar o código em si e entender. Acho que se mudasse isso ficaria perfeito.
Jhon use seus proprios nomes, eu modifiquei os nomes das tags e arquivos porque estava confuso e ajudou muito.
Me senti do mesmo jeito, eu estava entendendo, mas depois me embananei todo com os nomes que ele dava pros arquivos e td mais, sei que da um da o nome acha bom pro.momento, mas pra explicar assim fica bem confuso, vou ter que ver mais algumas desenas de vezes, mas a aula é bem boa
Muito bom! Vou começar um novo trabalho como dev front-end semana que vem e o seu vídeo me ajudou bastante, obrigada :D
ainda trabalha la?
Felipe, tenho TDAH e sofro muito para estudar programação, estou tendo uma evolução bem lenta no trabalho e estava bem desanimada com tudo.
Hoje decidi procurar um curso de React para tentar aprender algo novo pra ver se me interesso mais em estudar (atualmente estou trabalhando em um projeto com AngularJS e isso tem me deixado bem desmotivada).
Achei esse seu curso por acaso e vou te contar, consegui assistir o vídeo completo tendo apenas alguns minutos de distração.
A forma como você conversa com a gente como se estivessemos em uma call descontraída me cativou total e me ajudou muito a manter o foco no aprendizado.
Nunca havia mexido com React antes e estou muito feliz com o tanto que aprendi.
Já me inscrevi no canal e por favor continue com esse conteúdo maravilhoso.
Com certeza irei acompanhar os outros vídeos.
Abraço e minha imensa gratidão pela passagem de conhecimento, você está sendo luz para muitas pessoas! 🌹
Também tenho. É luta. Mas desistir nunca.
OI Cam, sofro do mesmo problema, que bom saber que não estou sozinha nessa
Após a ritalina, muita coisa mudou, mas ainda é uma situação dificil.
@@user-nd2tj1hb7w Isso mesmo, sem desistir.
Após a ritalina, muita coisa mudou, mas ainda é uma situação dificil.
Já faz um tempo que postou esse vídeo, mas tive a oportunidade de vê-lo somente hoje, e que bom que cheguei até seu vídeo. Didática espetacular! Já sabia algumas poucas coisas do react, mas vendo seu vídeo agregou demais. Obrigado por compartilhar seu conhecimento conosco. Sucesso
Curso fantástico comecei sem saber de nada do react e sai entendendo muita coisa, parabéns!!!
Fico feliz em saber!!
Cara, nunca vi tanta task na vida como nessa atividade 😄😄😄🤣
Lega, gostei. like ... mas os nomes task, tasks, Tasks poderiam ser diferentes para não confundir
mano do ceu concodo muito bom vc tipo pra eu que ainda to aprendendo então que as vezes acho que a task é um comando kkkkkkkk mas sensacional fiquuei apaixonado pelo react
Também achei, poderia nomear de acordo com as funcionalidades/responsabilidades de cada componente, não é?
@@victorfigueiredo6031 é o certo amigo
pois é tive dificuldade muito nisso. nao entendi na verdade qual é qual...
@@Allexmatrix é confuso mas tbm n é algo de outro mundo. Tasks é o componente das tarefas, tasks a variável com os dados e Task o item de cada dado da classe Tasks
Rapaz... Você merece ser aplaudido de pé por postar essa aula de React.
Sua didática foi excelente e explicou de uma forma bem simplificada e fácil.
Sou iniciante no React e já conhecia alguns conceitos, mas esse vídeo ajudou muito a "clarear" alguns pontos em que eu tinha dúvidas.
Muito obrigado pelo vídeo e se possível poste mais conteúdo de React, que está nos ajudando muito.
Sucesso ao canal.
Ganhou mais um inscrito.
Totalmente de acordo. Sou iniciante em React e consegui acompanhar com muita tranquilidade a construção do código.
Obrigado felipao, seus vídeos tem me ajudado muito e com certeza milhares de pessoas!! Estou na mudança de carreira, estudando programação e quando tenho duvida de algum assunto já venho certo no seu canal pra esclarecer, pois sua didática é muito boa, conteúdos complicados você explica de uma forma simples!!
Mano, teu conteúdo é insano. Já comprei cursos que não ensinam metade do que tu passou nesse curso. Valeu
Tamo junto, irmão! FIco feliz em saber que consegui te ajudar.
Cara, sensacional a tua didática. O teu astral é tal legal que nem parece que estamos em uma aula, parece que estamos em um ambiente descontraído, sei lá uma mesa de um bar tomando uma ceva e tu está ensinando. A gente vem aqui assisti uma hora e quarente de vídeo e nem vê o tempo passar kkk. Mais uma vez parabéns.
Nossa ver você fazendo o projeto dá pra ter noção do quão útil é essa ferramenta. Dá mais noção pra quem tá iniciando do porquê usá-la. Parabéns!
Quando chegou próximo aos minutos 30,30 e poucos eu comecei a achar muito confuso porque tinham 3 ou 4 elementos com um nome muito parecido - Task ou tasks. Mas fui paciente e deu pra absorver legal o conhecimento. Muito obrigado pelo conhecimento compartilhado conosco!
igual eu
Revi o vídeo hoje com mais experiência. Realmente é bem confuso vários componentes e props com nomes extremamente parecidos. Fora isso, ótimo vídeo! Muito bom mesmo.
Poh, jovem, consegui um estágio e queria sair do zero no React e esse vídeo vai me salvar. Obrigado.
muito bom, meu proximo projeto quero iniciar pelo front end com react, o backend faço com laravel depois, pena q estou com um projeto já em andamento e terminando o front end, se não teria usado o react... ganhou mais um inscrito...
Agradecer pelo conhecimento passado, sou bem iniciante e aos poucos tô conseguindo pegar. Destaque para o formato da aula, objetiva, prática e comunicação super natural. Sucesso!
Cara, vi o mesmo projeto em diversos cursos ensinando. Você foi o único que eu consegui entender sobre ReactJS. Parabéns, continue com o trabalho fantástico!
Felipão, Deus te abençoe meu bród. Eu tava ficando maluco com a b@#$a do Angular. Você resolveu minha vida com esse trem atomico aí. Muito sucesso pra você.
Trabalho com vue e tive curiosidade de ver como funciona o react. Tenho uma visão diferente em relação a criação de css. Normalmente crio componentes com variáveis scss diretamente no arquivo do componente vue. Esse scss é criado de uma maneira em que eu consigo deixar as variáveis com valores padrão no componente e com possibilidade de alteração externa. Fica muito reutilizável, até mesmo para a parte de estilização.
React possui formas de injetar props do componente pai para o filho sem precisar enviar via props?
Um vídeo desses merecia o triplo de visualizações.. Parabéns pela iniciativa, pela aula e oferecer conhecimento de qualidade. Muito top
"A gente vai ter que passar primeiro para o tasks, para o tasks passar para o tasks " - 53:43 // Fora isso ótima aula irmão!
Muito show, hoje conseguir conclir o Curso de ,HTML, CSS e React Para Completos Iniciantes, estou migrando da linguagem DELPHI/Oracle onde trabalho desde 2003... acreditado na metodologia do Full Stack CLUB...
Parabéns pelo curso. Muito bom. Eu comecei a usar React mas estava um pouco perdido. Agora as coisas ficaram mais claras, apesar desse vai e vem das funções, isso complica bastante para quem está começando.
Eu nunca ouvi tanto Task/Tasks na minha vida Mas adorei, muito bem explicado
Excelente aula, parabéns. Aguardando por mais 😃
Uma dúvida. Porque no momento 1:02:38 foi necessário utilizar uma Arrow Function?
Porque não funciona colocando simplesmente handleTaskDeletion(task.id)?
Vídeo muito top, me ajudou muito!
Uma sugestão que eu poderia dar pra galera seria oprgfanizar os componentes em pastas, colocando o arquivo .jsx e css de cada um em sua propria pasta. Acho que assim os arquivos do projeto ficam mais clean, facilitando na organização da estrutura do projeto!
Mano, tu não teve problema na hora dos Routes?
@@djck2306 mano, é só instalar a versoa do React Route que ele falou. Ele explicou isso num comentário fixado, vou mandar print pra voce.
" Galeraaaaa, aviso MUITO IMPORTANTE:
Desde a gravação deste curso, o react-router-dom atualizou sua versão para a V6, o que mudou algumas coisinhas, e muitos alunos estão relatando erros ao utilizá-lo.
Portanto, na hora de instalá-lo no projeto, utilize o seguinte comando:
npm install react-router-dom@5.2.0
Assim, vocês usarão exatamente a mesma versão que usei no curso (a V5).
Abraços! "
na hora de instalar o React Router Dom você utiliza esse comando (npm install react-router-dom@5.2.0), que especifica a versão que voce quer instalarç. Qualquer dúvida manda ai que tento te ajudar!
Sim, realmente o problema era a versão que eu instalei errada! Valeu pela ajudar, mano!👊🏽
O melhor explicação que vi até agora, com essas marcações no video, ajuda quando tenho uma duvida, faz uma com o Nuxt js.
Eu segui seu tutorial passo-a-passo no VSCode e aprendi várias dicas, muito obrigada!
por nd
De nada
Cara muito obrigado pelo video, se quer uma dica construtiva pro canal, tente aumentar o volume do video usando algum software iria ajudar mt, porque está bem baixo e minha caixinha ficou no talo, de resto mt bom, bem explicativo!!
Qual teu nome?
Felipe não consigo usar o params tem alguma dica do que pode ser, quando eu boto o parentes some da minha tela
const params = useParams()
no minuto 01:19:30, por favor me ajuda 🥺(sua aula é muito boa, parabens!!!!!!)
Excelente didática! Vale a pena para entender conceitos , más não consegui desenvolver a app pois está aparece erros!
Galera, quando escreve uma / no nome da task por exemplo : Lista de compras 20/5; invés de passar pro task details como o titulo, ele acessa como se fosse uma rota pq o dado é passado pela url. Eu fiz um replace no history.push "history.push(`/${task.title.replace("/", "-")}`);"
Atualização!
O problema de usar daquele jeito é que vai substituir somente o primeiro /. É melhor usar : history.push(`/${task.title.split("/").join("-")}`); Pois vai substituir todos!
string.replace(//\/g, ‘-‘) funcionaria?
Excelente curso, das poucas vezes que trabalhei com web sempre usei Bootstrap e JQuery, mas porém agora surgiu a necessidade de usar React em um projeto, seu vídeo está sendo de grande ajuda
Só o fato de você se dispor a compartilhar o conhecimento, você já tem um like e um novo escrito!
Felipe, concluí o projetinho! Muito legal cara, parabéns. Minha sugestão seria ao invés de popular com uma API, criar uma LocalStorage. Assim que desenvolveu pode usar no dia a dia. Estou aplicando aqui na minha. Abraçooo.
Cara que aula Mano!!! Dahora, explicativa e nada cansativa cara, mandou ver!
valeu demais, irmão!
QUERO MAIS TUTORIAIS SEUS NA MINHA MESA AGORA!
vou zerar o canal desse cara, mt bom
Acabei de assistir seu vídeo e percebi que você explicou React de uma forma muito didática, que explica o que faz cada detalhe do código, o que não estou achando muito na internet. Excelente vídeo, muito obrigado pela aula!
Cara ... tive que fzr esse curso em 1 semana kkkk tive que repetir várias vezes para poder entender um probleminha, mas finalmente consegui terminar!
Muito obrigado pelo curso Felipe!
Diz aí qual foi o problema. Aí caso alguem mais tenha ja vai saber por aqui.
inscrito meu bom! eu venho tentando estudar react a semanas mas nunca peguei um tutorial sobre hooks, era sempre através das classes, eu não conseguia entender nada... em uma hora e meia eu entendi completamente o básico de react tanto pra hook quanto pra classes, me salvou de verdade! muito obrigado
Cara muito bom esse projeto. Fortaleci muitos conceitos sobre o react com esse projeto! Obrigado man!! 🙌
Só tive um problema que foi a parte de fazer a requisição da api com axios, mas consegui via fetch!
qual erro que era e como resolveu?
Raramente eu logo no youtube, mas tive que vir aqui parabenizar pela aula e me inscrever.
Conteúdo muito bom, aula leve e didática incrível. Meus parabéns.
muito obrigado, Leandro!
Até agora a melhor explicação de React que eu vi. Só não sei porque os comandos de estilização do CSS não funcionavam durante a minha tentativa. Eis a vida dura que temos, isso que eu chamo é programar a dor kkkkk
Boa, Curso excelente !!!!!
Única dica, deixa o zoom menor, assim fica melhor ver a sequencia da programação.
Irmão que didática é essa kkkk? Vc explica bem demais, como pode kkkk Parabéns e sucesso
+1 inscrito
Curso foda d+, conseguir implementar a deleção de task sozinho kk, mt obrigado mano!!
boaaaaa, Carlos! isso aí, man! =)
ótima didática, gostei da aula. Como ja mencionado antes, utilizar nomenclaturas diferentes e o som do mic achei um pouco baixo, mas amplifiquei o som aqui :)
Mano, pode fazer um vídeo futuramente sobre Redux?? Sua didática é top cara, tenho muita dificuldade em Redux ainda
claro! farei sim.
@@dicasparadevs Apoio vídeo sobre redux, consegui aprender bem com tua didática!
Muito obrigado por esse curso! Esclareceu muito minhas duvidas. Tem alguma dica de que caminho seguir agora para me dar bem com React?
Assistindo agora, muito bom o conteúdo. Gostei muito, Parabéns Felipe!! Deus te abençoe!
Parabéns cara. Curso excelente. O único problema foi apenas só os parenteses em algumas partes do código sumiam.
Muito bom o vídeo, excelente explicação, me ajudou muito! Ganhou +1 sub
Parabéns pelo conteúdo, muito didático de fácil entendimento, continue com mais vídeos que nós ficaremos muito agradecidos
Trabalho com Java há 3 anos e to tendo que aprender React agora, a aula ajudou baste hehe
Mano que aula sensacional
Curti e me inscrevi SEM DÚVIDA!! Podem confiar, show
Sensacional Felipe. Comecei React agora, e apesar, do curso ser um pouco mais acelerado, fui aos poucos aprendendo os conceitos um por um antes de avançar. Isso me ajudou a entender tudo o que você explicou. No fim, não é dificil e bem mais prático e gostoso de desenolver. Muito obrigado por nos ensinar essa biblioteca sensasional!
Que aula sensacional, me ajudou muito, de verdade. Sua didática facilitou bastante, pois como estou iniciando, tudo vira mais difícil, mas você conseguiu explanar bem o conteúdo e deixar tudo mais tranquilo. Sucessoo!!!
Mano, parabéns mesmo. Sempre tive dúvidas quanto a classes, pois sempre tem cursos usando-as, mas sua explicação tirou minhas dúvidas.
Muito top mesmo. Obrigado!!!
fico feliz que tenha gostado, Ueslei! =)
Muito boa a aula consegui aprender bastante. Só fiquei com uma dúvida por que meus links atualizam mas a pagina não recarrega sozinha só muda quando dou um F5 para cada link que clico.
Fala Felipe, tudo bom? Tu pode me dizer qual distro do linux e ambiente de desktop você estava usando nesse vídeo? Abraços!
Conclui o curso, muito dahora Felipe, sua didática mt boa, inclusive incentiva! Sucesso
Muito bom, meu primeiro contato com react e já aprendi muito
Ótimo vídeo!
Estou estudando, tentando modificar o código.
Na hora de adicionar, não mostrou o título, como resolver ? Já olhei outras vezes e não ví diferença nos códigos. O erro que tá dando é no handleInputChange = (e) => {
setInputData(e.target.value)
Man, boa noite, tudo bem?
Uma dica, que vale ouro. Eu não sou um cara tão experiente na área, atuei como dev fullstack 2 anos e meio, tipo, com PHP no backend, agora me surgiu uma granfe oportunidade em uma empresa muitoooo boa, porém pra atuar como front end, ou seja, pelo menos a princípio nada de back end. Tipo, tô meio assim, será que vale a pena e tal. Claro, depende de cada um e tal, mas tu acha que ter uma experiência somente voltada pra front end vale a pena? Digo, ficar um tempo sem necessariamente fazer nada no back end
Obs: com o tempo eu posso me tornar um fullstack nessa empresa.
Valeuuu, forte abraço
Bem didático, gostei. Tá de parabéns, ensina mto bem. P
Parabéns pela aula! Foi muito boa!!!!
Felipe, obrigado por essa incrível aula, estou começando no React e já me ajudou muito esse seu vídeo.
Minha aplicação não é mais exibida e estou com dois erros, caso alguém tenha passado por isso e puder ajudar por favor, já reinstalei várias coisas e não consigo resolver.
A primeira foi quando adicionei o Router na aplicação ela não exibe mais minha aplicação e me retorna o seguinte erro no console:
Uncaught Error: A is only ever to be used as the child of element, never rendered directly. Please wrap your in a .
at invariant
A segunda foi quando eu coloquei o hook useHistory, no terminal do VSCode me retorna o seguinte erro:
export 'useHistory' (imported as 'useHistory') was not found in 'react-router-dom' (possible exports: BrowserRouter, HashRouter, Link, MemoryRouter, NavLink, Navigate, Outlet, Route, Router, Routes, UNSAFE_LocationContext, UNSAFE_NavigationContext, UNSAFE_RouteContext, createRoutesFromChildren, createSearchParams, generatePath, matchPath, matchRoutes, renderMatches, resolvePath, unstable_HistoryRouter, useHref, useInRouterContext, useLinkClickHandler, useLocation, useMatch, useNavigate, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRoutes, useSearchParams)
bom dia!
como gero uma build do projeto por exemplo? fiz a alteração de um código fonte baseado no seu vídeo, mas não consigo exportar.
Cara, que vídeo incrível!! Me ajudou muitoo a iniciar no React!
Ta de parabéns, por favor continue gerando conteúdo fod* assim!!
gostei muito desse curso, me fez entender o poder do React!
+ 1 inscrito
Curso Incrivel, tu explicou as coisas de forma simples e muito bem!!! Sua didática é fenomenal :D
Uma sugestão seria continuar esse projeto usando o Firebase como banco de dados para guardar as Listas de Tarefas
Parabéns Felipe! Com a sua explicação ficou fácil entender o react. (É praticamente um Angular com node.js rsrs).
não posso passar o setTasks como prop para os filhos, daí conseguiria criar as funções de manipulação em qualquer lugar não?
Muito obrigada, Felipe! Esse vídeo me ajudou bastante... Estou me inscrevendo! Abraços
muita riqueza de conteúdo, parabéns.
Cara, que video sensacional!! Parabéns, além de inscrito ganhou um fã!
Muito bom!! Vc é perfeito cara, ensina muito bem e cheio de videos otimos!
o curso ta otimo, vc fala muito bem, mais é bom mudar o esquema de cores da proxima vez, pois no minuto 19:36, na linha 12 eu demorei bastante para ver que tinha dois () antes da =>.
@@flaviosouza1312 valeu a dica
Curso muuuuito sucesso! Sua didática é ótima, esclareceu muitas dúvidas que eu tinha quanto ao State! Obrigada!!!
Parabéns Felipe, comecei a me dedicar aos estudos de react faz pouco tempo, explicações foram bem claras.
Curso foi muito bom, obrigado.
Objetivo e didático. Simplesmente perfeito
Parabéns Felipe Rocha, o treinamento merece nota 10, repleto de dicas! Obrigado 😀 👏
Fala Felipe! Obrigado pelo projeto, ajudando muito no aprendizado.
Estou tendo um problema ao clicar no ícone "Details" e botão "Voltar', está mudando a URL mas não está carregando o render de visualização, já pesquisei muito na web mas não encontrei nenhuma solução que resolvesse. Pode me ajudar? Desde já agradeço.
alguém poderia me ajudar no meu erro? não consigo renderizar para visualizar ?
Que aula incrível irmão, parabéns!
Pela sua didática consegui entender praticamente todos os conceitos e fazer o app somente tirando dúvidas no código escrito no segundo dia, vc é foda!
Parabéns pela didática e conteúdo, show.....
Parabéns cara, vídeo totalmente didático e direto, obrigado! Seria legal se fizesse agora este projeto porém com um nível mais avançado (se houver como). Seria interessante também você fizer o mesmo só que com VueJS (se souber).
Fiz tdo certinho do jeito que vc ensinou, mas os botões de informação e o de voltar n funcionam corretamente, tipo, crio uma task e quando aperto na info dela a página não carrega, preciso apertar f5 para carregar. já o botão voltar simplemente n está fazendo nada quando aperto nele. Como posso resolver esses problemas?
Estou com o mesmo problema.
Consegui resolver o problema. Tinha tido um problema com a versão 6 do react-router-dom, então, por recomendação do Felipe eu instalei a versão 5.2.0. Porém, essa versão estava dando conflito com outras bibliotecas, então, voltei para a versão 6 e refatorei o código.
No lugar do useHistory, utilize o useNavigate:
import {useNavigate} from "react-router-dom";
const navigate = useNavigate();
const handleTaskDetailsClick = () => {
navigate(`/${task.title}`);
}
No arquivo App.jsx importe utilize o Routes e substitua o render e o component por element, e passe um elemento:
import {BrowserRouter as Router, Route, Routes} from "react-router-dom";
return (
);
O cara é o mago do código, valeu irmão!
Cara muito bom, parabéns, só tenho uma dúvida se alguém poder me ajudar, estou começando agora e consegui fazer esse app, se eu quiser hospedar ele na web, por onde começo? algum tutorial? de preferência gratuito só para testar como que fica.
Gostei muito deste curso. obrigado por partilhar conhecimento.
Explicação muito boa mano, sua didática ajuda demais. Vlw
Muito legal o curso... Uma pergunta... Que versão de Linux é essa?
To com dois "problemas", um ainda nao sei se ja era p funcionar mas vamos la. Estou no minuto 55 do vídeo.
1 - qdo adiciono uma tarefa ja na aplicação ela não fica salva, fica em tela só até abrir o app novamente.
2 - quando clico em uma tarefa ela fica com o borderleft, ok, mas a outra tarefa é desmarcada e vice versa, ou seja, só consigo dar "completo" em uma tarefa por vez.
to na mesma pegada kkk
é tanto task que não sei qual task é qual, to bugado
UOou
que SO você utiliza? Parece ubuntu, mas com uma cara diferente... não sei.. só sei que curti pakas esse flow ao trocar as janelas, muito massa.
Esse video foi excelente. Obrigado por fazer um contúdo tão bom!!!