RESOLVENDO DESAFIO de entrevista REACT.JS #1 - Você consegue?

Поділитися
Вставка
  • Опубліковано 20 жов 2024
  • Neste vídeo resolvi um desafio muito encontrado em processos seletivos para vagas de programadores React.js por aí.
    Você consegue achar uma solução melhor? Deixa nos comentários e vamos nos ajudar! :)
    Descritivo do desafio para tentar resolver em casa:
    liberating-key...
    Link do reposítório para estudos:
    github.com/nan...
    ATENÇÃO, quer receber uma oferta exclusiva de 50% de desconto quando eu lançar meu curso de React?
    Preencha o formulário abaixo, para entrar na minha lista de early adopters:
    bit.ly/fernand...
    ig: @fernandev1
    #reactjs #interview-challenge #frontend

КОМЕНТАРІ • 209

  • @Oaluiser
    @Oaluiser Рік тому +19

    Baita vídeo! Minha dúvida é em relação a manipulação das arrays, não seria mais interessante, por exemplo, usar push() pra inserir o objetos e também os outros métodos de manipulação, ao invés de criar uma função que faz exatamente isso?

    • @fernandev1
      @fernandev1  Рік тому +20

      fala Oaluiser, tudo bem? então cara, no react para se atualizar a state devemos usar a função de setState que criamos, no caso desse vídeo a 'setList()', portanto você não pode simplesmente usar um push no array 'list'.
      dentro de setList nos criamos uma cópia da state original com spread operator e aí incluímos então o novo dado. você poderia fazer algo do tipo também:
      setList((prev) => {
      const newArray = [...prev];
      newArray.push(newDot);
      return newArray;
      })
      espero que tenha ficado claro 🥳 qualquer coisa chama aí!

    • @raphaeldasilva9548
      @raphaeldasilva9548 Рік тому +9

      @@fernandev1 Para complementar, no react se usa a ideia de estados imutáveis, ou seja, não alteramos o valor do estado, criamos um novo valor, por isso pegamos o prev, que é o valor anterior e então colocamos o valor a mais que queremos. Isso por que é mais fácil deletar um valor e criar um novo do que alterar o valor e ter que realocar na memória. Essa ideia de imutabilidade deixa a performace da aplicação melhor. Por isso usamos a função para "alterar" o valor do estado e não usamos o push direto no estado por exemplo!

    • @fernandev1
      @fernandev1  Рік тому +1

      @@raphaeldasilva9548 muito bem observado Rahpa, coberto de razão!

  • @adrielschmitz
    @adrielschmitz Рік тому +72

    Desafio legal. E pra quem está começando, repare como o Fernando vai quebrando o problema maior em problemas menores e vai resolvendo esses problemas menores um por vez, "passinhos de bebes". Como dito no vídeo, no futuro tu vai conseguir simular o comportamento do seu código na sua cabeça e não vai precisar printar tudo, mas no início, para ter uma visão geral, ajuda muito!

  • @szlima
    @szlima Рік тому +1

    Muito obrigada pelo vídeo! 😊
    Uma outra forma seria ter um vetor 'histórico' para armazenar cada versão de 'list', assim os círculos exibidos correspondem ao vetor que está na última posição do histórico. Seria um vetor de vetores.

  • @renanlimaxs
    @renanlimaxs Рік тому +8

    Top! Me incentivou bastante em continuar os estudos. Sucesso ao canal.

    • @fernandev1
      @fernandev1  Рік тому +1

      vamoooo Kestrel! o segredo é nunca desistir! eu não vou descansar até você aprender a programar! 😎

  • @carloseduardonogueira4937
    @carloseduardonogueira4937 Рік тому +1

    Não desista dos vídeos!! Você ainda vai muito longe!! Sua didática é incrível!! Parabéns.

    • @fernandev1
      @fernandev1  Рік тому +1

      fico feliz que esteja gostando Carlos! obrigado!

  • @andersoncarvalho8551
    @andersoncarvalho8551 Рік тому

    Esses vídeos de resolução de problemas é muito top, eu acredito que vai ajudar muita gente. Parabéns!

  • @samwuelgd
    @samwuelgd Рік тому +8

    Cara vc é fera nesse negócio, até me deu vontade de voltar a estudar programação

    • @fernandev1
      @fernandev1  Рік тому +2

      fala Samuel! que alegria ler seu comentário, garanto que você não vai se arrepender de voltar! 🥳

  • @daniloctg2007
    @daniloctg2007 Рік тому +12

    Excelente conteúdo, muito bom para se preparar para as entrevistas. Tem pontos ali no vídeo que eu tinha dúvidas, e agora ficou mais claro

    • @fernandev1
      @fernandev1  Рік тому +2

      Show Danilo! Fico feliz que tenha te ajudado!

  • @edivan7552
    @edivan7552 Рік тому

    Legal de mais, vou começar a aplicar meu currículo para vagas com tecnologia que eu já tenho um minímo de conhecimento, só pelos desafios.

  • @diogodias_
    @diogodias_ Рік тому +2

    Acabei de descobrir esse canal por conta da recomendação do youtube. Não estudo programação web e sim Data Science, mas, assisti o vídeo e vou assistir outros também, é legal ver você quebrando os problemas e solucionando, acompanhar seu pensamento e aprender coisas novas. Não pare de trazer conteúdos!

    • @fernandev1
      @fernandev1  Рік тому +1

      fala Diogo! cara, obrigado pelo comentário, isso me dá forças para continuar! 🥳

  • @joemersonpires1615
    @joemersonpires1615 Рік тому

    Fala Fernandev muito obrigado pelo conteúdo ficou bem completo parabéns. Ainda não estou estudando React.js mas esse vídeo me passou muito conhecimento, valeu

    • @fernandev1
      @fernandev1  Рік тому

      que massa Joemerson, bons estudos!

  • @v2power921
    @v2power921 Рік тому +2

    Caraca... que didática sensacional!
    Obrigado pela aula!

    • @fernandev1
      @fernandev1  Рік тому

      obrigado pelo carinho V2power 👊🏼 tamo junto!

  • @JonathanDjavan
    @JonathanDjavan Рік тому +3

    Massa, deu pra entender mesmo eu que ainda n manjo nada de React haha a lógica por trás. Massa.

    • @fernandev1
      @fernandev1  Рік тому +2

      que massa Jonathan, fico feliz que conseguiu compreender. bora aprender juntos! 👊🏼

    • @JonathanDjavan
      @JonathanDjavan Рік тому +1

      @@fernandev1 Vamos sim, estou me atualizando. Já faço Front alguns anos, mas sempre pulei alguns estudos. Sou formado em Design tbm, faço de forma entusiasta UX também. Então, vamos indo pra evoluir.

  • @gevolgdev
    @gevolgdev Рік тому +12

    Cara, primeira vez que eu assisto um video de react com mais de 30min sem pausa. E passou rápido ainda, bom que tem mais videos no canal kkkkk ja vou pro proximo

    • @fernandev1
      @fernandev1  Рік тому +1

      hahahah que legal saber disso Impactus! 🤓

    • @Gabriel-hk9jv
      @Gabriel-hk9jv Рік тому +1

      Tive a mesma sensação cara, o @fernandev1 explica de uma forma tão didática que fica super leve pra assistir por 40 min

  • @ricardosea1
    @ricardosea1 Рік тому +2

    muito legal teu estilo, pra quem esta começando é um conteúdo MUITO interessante! Tuas explicações bem fáceis de entender tambem, parabens pelo conteudo!!

    • @fernandev1
      @fernandev1  Рік тому +1

      fala Ricardo! que alegria ler o seu comentário cara! seguiremos em frente com esse tipo de conteúdo 🤓

  • @alefflow850
    @alefflow850 Рік тому +1

    vídeo maravilhoso. comecei a gostar de programar, antes n conseguia nem abrir o vscode.muito obrigado!

    • @fernandev1
      @fernandev1  Рік тому +1

      uhuuuul 🥳, quem não pegou nojo do vscode alguma vez na vida que atire a primeira pedra Alef! hahaha continua acompanhando que eu tenho certeza que vamos crescer juntos! 🤓

  • @felipeamorim1196
    @felipeamorim1196 Рік тому +1

    Vídeo incrivel cara! Bem didático. Única coisa que mudaria seria o redo. No lugar de um novo state usaria um useRef inserindo uma estrutura de dados stack dentro, dessa forma poderia evitar renderizações desnecessárias no component.

  • @TheVt99
    @TheVt99 Рік тому +1

    estou estudando há um ano, consegui fazer o desafio e consegui também armazenar no localStorage

  • @heitormbonfim
    @heitormbonfim Рік тому +2

    Cara, continua fazendo esses videos com diversos desafios. Muito show!!! Os outros canais de programação tão ficando entediantes. Acho que esse quadro não ficaria.

    • @fernandev1
      @fernandev1  Рік тому +1

      fala Heitor, que legal saber sua opinião cara. eu ainda quero deixar os vídeos com temáticas mais dinâmicas, estou bolando novidades por aqui 🤓 obrigado pelo apoio!

  • @sinvalfelisberto
    @sinvalfelisberto Рік тому

    Que legal, cara!
    Muito sucesso pra vc!

  • @jmaurojr
    @jmaurojr Рік тому

    Estou iniciando o estudo em programação, gostei muito do vídeo e me ensinou muito mais do que apenas código. A forma de fazer é essencial. Obrigado!

    • @fernandev1
      @fernandev1  Рік тому +2

      isso aí José, meu objetivo é fazer vocês pensarem e não somente dar a resposta pronta. acredito que assim o desenvolvimento acontece real!

  • @caetxnso
    @caetxnso Рік тому +2

    muito massa o vídeo! acabei de entrar no segundo ano do ensino médio e vou começar a fazer um curso profissionalizante de C# que inclui também html, css, angular, react... Por enquanto sei o básico do básico de python, mas mesmo não entendo quase nada achei o vídeo muito intuitivo e interessante, parabéns pelo conteúdo!
    edit: terminei de assistir o vídeo agora, deu pra entender algumas coisas pela lógica e o jeito que você explica ajuda demais!

    • @fernandev1
      @fernandev1  Рік тому

      aaah fico feliz demais meu amigo! obrigado pelo comentário e seja bem-vindo ao canal! 🥳

  • @ivanrabelo1558
    @ivanrabelo1558 Рік тому +2

    Muito bom mano. Show demaisssssssssssss!!!

    • @fernandev1
      @fernandev1  Рік тому +1

      valeu Ivan! obrigado pelo apoio.

  • @victorBrapp
    @victorBrapp Рік тому

    eu sei muitas maneiras de fazer isso, mas o jeito que vc fez e explicou me ajudou a enxergar novos horizontes e achei bem interessante sua didática.

    • @fernandev1
      @fernandev1  Рік тому

      e isso é a maravilha da programação. diversas maneiras diferentes de resolver um mesmo problema! que massa que você curtiu Victor, valeu! 🥳

  • @LuanHenrique-pc3nn
    @LuanHenrique-pc3nn Рік тому

    Mano, que didática excelente q tu tem, parabéns pela aula

    • @fernandev1
      @fernandev1  Рік тому

      valeu Luan! obrigado pelo apoio 🥳

  • @AlexSoaresGtr
    @AlexSoaresGtr Рік тому

    Cara, que didática velho!! Eu ainda não estudei React pq ainda estou em Html Css e js, mas de alguma forma consegui entender um pouco da lógica. Vc tem algum curso? Se tiver já passa aí pow. Segurança absurda nas explicações.

    • @fernandev1
      @fernandev1  Рік тому

      fala Alex, tudo bem? cara, muito obrigado pelo apoio! por enquanto não tenho curso, mas é tanta gente pedindo que vou arranjar um tempo mês que vem pra produzir algo bacana! 😎

  • @alexandreinacio9625
    @alexandreinacio9625 Рік тому +5

    Excelente conteúdo parabéns e gratidão

    • @fernandev1
      @fernandev1  Рік тому

      valeu pelo apoio alexandre! fico feliz que pude ajudar.

  • @manoellopes
    @manoellopes Рік тому

    Muito bacana o vídeo, poderia trazer mais desafios. É uma forma bacana de ver a solução de um problema usando lógicas diferentes.

    • @fernandev1
      @fernandev1  Рік тому +1

      isso mesmo que eu penso Manoel! fico feliz que esteja gostando.

  • @lucasfelix2235
    @lucasfelix2235 Рік тому

    Vídeo super legal e didático! Seria legal trazer desafios para nível pleno.

  • @vesipode
    @vesipode Рік тому

    Eu gostei muito do jeito que você faz os desafios, faz desafios usando JS em si, bom conteúdo e boa lógica, parabéns

    • @fernandev1
      @fernandev1  Рік тому +1

      fala Natael, obrigado pelo apoio cara! farei alguma coisa sim, tenho focado no react agora por conta que é o que as empresas pedem e esperam dos candidatos, sabe? 😊

  • @mateussoares7599
    @mateussoares7599 Рік тому

    conteúdo foda mano, tu explica muito bem

    • @fernandev1
      @fernandev1  Рік тому

      que massa Mateus, obrigado demais pelo apoio cara! 🥳

  • @JosePedroSm
    @JosePedroSm Рік тому

    caraca que video legal, parabéns! voto para mais videos assim 👍🏻

    • @fernandev1
      @fernandev1  Рік тому

      valeeeeu José! continuarei trazendo mais por aqui.

  • @wolfgang843
    @wolfgang843 Рік тому

    Muito maneiro seu vídeo, cai aqui de paraquedas, nem sou ainda dev e comecei um curso gratuito que achei na internet, é o curso em vídeo do Professor Gustavo Guanabara, comecei tem uns dias mas to devorando todo tipo de conteúdo sobre html5 e css3 já tenho feito algumas coisas em html5 sempre tenho ideias de coisas pra fazer. Eu sempre achei muito interessante essa área de programação e desenvolvimento, mas sempre tive medo de cursos de internet e tal, tenho em mente de fazer o curso da alura, mas por enquanto vou fazer esse grátis pra pegar o jeito das coisas. Comecei meio que por conta própria e nunca consegui uma visão de alguém que já trabalha, já até tentei perguntar pra pessoas no insta seguindo perfis de devs. Enfim, parabéns pelo vídeo espero conseguir chegar nesse nível um dia e fazer coisas legais igual a essa :)

    • @fernandev1
      @fernandev1  Рік тому +1

      opa, seja bem-vindo então Wolfgang. espero que você curta cada vez mais o conteúdo! 🤓

  • @lucasfonseca4329
    @lucasfonseca4329 Рік тому

    Muito bom Fernando! parabéns

  • @futuroDevJohn
    @futuroDevJohn Рік тому

    Fernandev, sinto muito mais você foi reprovado. Pedimos circulos, e vc fez com quadrardos kkkk
    Eu ainda não estudei REACT, mas entendi bastante coisa da lógica, só comecei a me perder um pouco no Redo. Mas quando eu entrar em react venho aqui denovo pra fazer esses testes.

    • @fernandev1
      @fernandev1  Рік тому

      hahahha verdade, fui reprovado 😢 você é mais que bem-vindo John!

  • @tiagofuhrmann
    @tiagofuhrmann Рік тому +1

    Sensacional o vídeo! Alguns incrementos que eu faria na entrevista, bem na linha que você disse de incrementar pra mostrar que domina mais o React:
    1- O botão Desfazer ficaria "disabled" caso o array "list" tivesse length 0.
    2- O botão Refazer ficaria "disabled" caso o array "undid" tivesse length 0.

    • @fernandev1
      @fernandev1  Рік тому

      Tiago, perfeito cara! muito bem observado 🤓

  • @biigattu
    @biigattu Рік тому

    Parabéns cara! Muito boa sua didática, muito obrigado por isso!

    • @fernandev1
      @fernandev1  Рік тому

      valeu pelo apoio Roberto! 🥳 tamo juntoooo!

  • @tiagomarmitt928
    @tiagomarmitt928 Рік тому

    Bem legal a ideia de resolver desafios, vi almoçando, o interessante foi que toda a lógica que pensei para resolução do problema antes mesmo de você começar a desenvolver foi exatamente ao que se tornou a aplicação no final do vídeo, até mesmo nome de elementos e funções kkkkk.
    +1 inscrito

    • @fernandev1
      @fernandev1  Рік тому

      opaaa, que massa Tiago; chegamos na mesma linha de raciocínio então! 🥳

  • @ninaaraldi
    @ninaaraldi Рік тому +3

    mto bom! 👏🏼👏🏼👏🏼

  • @Gabriel-hk9jv
    @Gabriel-hk9jv Рік тому

    Cara, sensacional esse vídeo!!!! Muito obrigado.E eu sei que pode ficar cansativo, mas por mim você pode entrar nos pormenores e demorar o quanto for necessário kkkkkkkkkkk

    • @fernandev1
      @fernandev1  Рік тому

      valeu pelo apoio Gabriel, fico contente que meu conteúdo esteja sendo útil 😄

  • @DenisioRodrigues
    @DenisioRodrigues Рік тому

    Muito bom esse tipo de conteúdo!
    Obrigado!

    • @fernandev1
      @fernandev1  Рік тому

      fico feliz que tenha gostado Denisio 🥳

  • @astropetslove6137
    @astropetslove6137 Рік тому +2

    Faltou só o "border-radius: 50%", para ficar redondinho kkk, mas vlw pelo vídeo, conteúdo muito top e bem explicado, estou estudando e buscando uma oportunidade no mercado e esse vídeo me esclareceu muitas coisas, continue c o bom trabalho mano!

    • @fernandev1
      @fernandev1  Рік тому

      fico feliz demais em ajudar Astro! que maravilha! obrigado pelo apoio.

  • @jccintr
    @jccintr Рік тому

    Muito bom. Parabéns pelo vídeo.

  • @ezequiel5150
    @ezequiel5150 Рік тому +3

    Conteúdo muito bom!!!

    • @fernandev1
      @fernandev1  Рік тому +1

      opa, obrigado Ezequiel! pretendo trazer mais conteúdos do campo de batalha pra comunidade! :)

  • @bellrodrigues8250
    @bellrodrigues8250 Рік тому

    Não assisti ao video completo oara não saber a solução, mas vou tentar fazer o desafio. Volto quando terminar.

    • @fernandev1
      @fernandev1  Рік тому

      show de bola Bell! mas não deixa de fazer! depois volta aqui me contar nesse comentário :)

  • @vini_palma
    @vini_palma Рік тому +4

    na função jandçeUndo, eu poderia ter feito um setList contendo ...prev.pop() ?

    • @fernandev1
      @fernandev1  Рік тому +3

      fala vini tudo bem? de certo modo consegue sim, mas fique atento, pois o método .pop() altera o prório array que você está chamando, removendo o último item deste array; porém o retorno desse método é o próprio item removido, portanto cuidado para não bagunçar a sua state.
      possivelmente você pode fazer algo assim:
      setList((prev) => {
      prev.pop();
      return prev;
      })

  • @AlexandreSilvaGoogle
    @AlexandreSilvaGoogle Рік тому

    Parabéns, excelente conteúdo!

    • @fernandev1
      @fernandev1  Рік тому

      fala Alexandre, obrigado pelo apoio! 🥳

  • @GregoryGustavo
    @GregoryGustavo Рік тому

    Muito bom. Só faltou o border radius 50% pro elemento de fato ser círculos como no desafio proposto.

  • @MegaXDBrasil
    @MegaXDBrasil Рік тому +2

    Eu nem curto React, estou vendo video por ver, eu prefiro Java Script, html e css

    • @fernandev1
      @fernandev1  Рік тому

      uhul, agradeço mais ainda a audiência então MegaXD 👊🏼

  • @pedrobonifacio538
    @pedrobonifacio538 Рік тому

    Se redimensionar a tela os pontos ficaram fora da posição relativa, sugiro adicionar um reposicionamento quando a tela mudar de tamanho ou limitar à area de clique

    • @fernandev1
      @fernandev1  Рік тому

      interessante Pedro, muito bem analisado, poderíamos calcular e colocar a posição relativa dos pontos, seria uma abordagem diferente porém bem legal!

  • @lucasduarte1603
    @lucasduarte1603 Рік тому

    Desafio bacana, já fiz algo parecido na facul com python. Só q os círculos deviam crescer e encolher qdo colidir com outro círculo.

    • @fernandev1
      @fernandev1  Рік тому +1

      poxa que legal Lucas! pra trabalhar com python tem que ser ninja. 🥷🏻 dessas artes eu não manjo haha

  • @jorgeferrari1151
    @jorgeferrari1151 Рік тому +1

    Outra forma de resolver seria marcar os itens em uma lista só como desfeitos ou não. Daria um pouco mais de trabalho só para mapear.

    • @fernandev1
      @fernandev1  Рік тому

      boa Jorge! realmente, sua solução também funciona, assim a gente manteria tudo em uma state só!

  • @brunolandim
    @brunolandim Рік тому

    Excelente, so faltou ser um circulo 😂. Didática muito boa!

    • @fernandev1
      @fernandev1  Рік тому

      pois é 😔 acho que reprovei. hahahha valeu Bruno!

  • @michaelgomes4185
    @michaelgomes4185 Рік тому

    Top esse vídeo. Ainda não sei programar, mas estou iniciando nesse mundo da programação que acho simplesmente magnífico e pretendo futuramente trabalhar com programação, claro não entendi quase nada do que foi falado kkkkk mas algumas coisinhas conseguir pegar. creio que meu maior problema está sendo usar a lógica mas espero com o tempo não ter tanta dificuldade assim. Mas parabéns pelo vídeo.

    • @fernandev1
      @fernandev1  Рік тому

      a prática sempre leva a perfeição Michael! continue tentando que tudo fica mais fácil com o tempo. agradeço demais o apoio, e se você tiver sugestões de vídeos que possam te ajudar nessa jornada, compartilha comigo! quem sabe eu não possa te ajudar? 🥳

  • @guilhermecheng
    @guilhermecheng Рік тому +3

    Bem legal esse desafio em! Peguei para fazer antes de ver a resolução, e me senti bem mais confiante depois de ter feito. E bem daora ver a resolução depois, bater com como eu fiz. Conteúdo top cara, parabéns!

    • @fernandev1
      @fernandev1  Рік тому +2

      uhuuuul 🥳, que massa Gui! parabéns!

  • @ricardoluisconte976
    @ricardoluisconte976 Рік тому

    Video massa demais, mano! 👏

    • @fernandev1
      @fernandev1  Рік тому

      aaaah obrigado demais Ricardo!

  • @futuroDevJohn
    @futuroDevJohn Рік тому

    Eu não sabendo nada de REACT ainda, vendo 40 min de video sobre react

    • @fernandev1
      @fernandev1  Рік тому

      hahahah feliz demais que você curtiu John!

  • @micaelph_
    @micaelph_ Рік тому

    Uma coisa a mais para incrementar é não deixar clicar no botão quando tiver === 0

    • @fernandev1
      @fernandev1  Рік тому

      boa dica Micael, com certeza faz sentido!

  • @viny4815
    @viny4815 Рік тому

    Perfeito, só faltou mesmo ser círculos ao invés de píxels, pea seguir a risca os requisitos. Parabéns.

    • @fernandev1
      @fernandev1  Рік тому

      🤣 verdade né, mas é tanta coisa pra lembrar na hora de gravar o vídeo, que algumas coisas passam batido infezlimente.

  • @manoelfarias9386
    @manoelfarias9386 Рік тому

    cara ... que video bom ! Parabens ... :D

    • @fernandev1
      @fernandev1  Рік тому

      valeu Manoel! obrigado pelo apoio 🥳

  • @flavioedu-dev
    @flavioedu-dev Рік тому

    Aula sensacional!

  • @lucasdamasceno7068
    @lucasdamasceno7068 Рік тому

    Videozao top dms lol ainda tô longe de um nível JR viu 🤣🤣✌️

    • @fernandev1
      @fernandev1  Рік тому

      valeu Lucas! é só persistir que cada vez fica mais fácil 🥳

  • @AndreLuiz-cd8ml
    @AndreLuiz-cd8ml Рік тому

    Muito bom o vídeo, por incrível que pareça a única coisa que ficou faltando foram realmente os círculos (ficaram quadrados kkkkkk). Valeu pelo conteúdo mano.

    • @fernandev1
      @fernandev1  Рік тому

      hahahahah boa André. acho que eu teria falhado 😅 obrigado pelo apoio!

  • @nandoztx_rq
    @nandoztx_rq Рік тому

    Gosto de videos assim, bem didatico, soube se expressar bem, parabens cara ! mais um inscrito;
    Eu soh separaria fisicamente a div dos btns da div dos eventos, pois resolveria via estrutura o problema do propagarion; ou ainda, pegaria eventos do teclado do tipo "ctrl+z" mas dai seria bonus rsrs

    • @fernandev1
      @fernandev1  Рік тому +1

      poxaaa, o ctrl+z ficaria show hein! tem hooks prontos já que tratam isso pra gente. ótima ideia Fernando!

  • @rubenfontes7085
    @rubenfontes7085 Рік тому

    Você ensina bem dms!

    • @fernandev1
      @fernandev1  Рік тому

      que massa saber disso Ruben, obrigado pelo apoio!

  • @cotonn
    @cotonn Рік тому

    no #page eu coloquei width e height 100vw e vh e cobriu a tela inteira

  • @kaiorodrigo4231
    @kaiorodrigo4231 Рік тому +1

    O cara é bonito, rico e inteligente. Porque eu não nasci assim meu Deus? 😢

    • @fernandev1
      @fernandev1  Рік тому

      que isso Kaio, são seu olhos 😍🤣

  • @leofumeitors1
    @leofumeitors1 Рік тому +1

    Quando eu olho alguem programando assim eu vejo que nunca vou conseguir a metade disso.

    • @fernandev1
      @fernandev1  Рік тому +2

      e se eu te falar que já estive no seu lugar e pensava igual (ou até pior) como você está pensando Leo? meu conselho pra você é, respeite o seu tempo, busque se tornar 1% melhor todos os dias e com o tempo tudo dá certo. o segredo é a persistência e repetição. 😎 acredito em você, bora!

    • @leofumeitors1
      @leofumeitors1 Рік тому

      @@fernandev1 Deus te ouça cara, estou no segundo semestre de ADS porém, não consigo focar, trabalho em casa e faço free lancer a noite, meio que o tempo livre que tenho estou doido para fazer alguma coisa de lazer como jogar. Mas é foda, estou tentando, espero conseguir aprender a desenvolver, na faculdade o foco é C mas na minha vida eu quero e focar em full stack java. Mas vamos ver se consigo com o tempo.
      Obrigado pelo apoio, todo sucesso do mundo para você

  • @jonasgoes3846
    @jonasgoes3846 Рік тому

    Não manjo de js, mas assisti o vídeo todo n sei porquê tô aqui nem pq me recomendaram mas mt bom o vídeo

    • @fernandev1
      @fernandev1  Рік тому

      hahaha show Jonas, fico feliz que gostou e seja bem-vindo ao canal!

  • @feliperibon8127
    @feliperibon8127 Рік тому

    esse inspecionar do react eu consegui apertando aqui, mas nao sei oq eu fiz

  • @paulofroes4607
    @paulofroes4607 Рік тому +5

    Reprovado: Motivo?
    São círculos, não quadrados! KKKKKKKKK'
    Eu mataria esse recrutador.

    • @fernandev1
      @fernandev1  Рік тому +2

      bem observado Paulo! 🤣

    • @leofrancow
      @leofrancow Рік тому +2

      Só reparei isso, esperei ele transformar os quadrados em círculos

  • @julio6377
    @julio6377 Рік тому

    UNDID foi foda kkkkkkkkkkkkkkkkkkkkkkk bom video

  • @Lucas_1919
    @Lucas_1919 Рік тому

    Que aula, muito obrigado

  • @Buskopan
    @Buskopan Рік тому

    Ao invés de usar slice() não poderíamos usar pop()?

  • @canerityalv5214
    @canerityalv5214 4 місяці тому

    genial, que video bom

  • @s1mpleeXL
    @s1mpleeXL Рік тому

    fera demais !!!

  • @danilopalmeira
    @danilopalmeira Рік тому

    Show, parabéns

  • @wesleyoliveira1233
    @wesleyoliveira1233 Рік тому

    MT bom o vídeo! Perdeu um pontinho por falta do border-radius:50% RS. Pediram um círculo, não um quadrado. Hahah

  • @rodrigosalinet
    @rodrigosalinet Рік тому

    Show de bola

  • @newgate5193
    @newgate5193 Рік тому

    Cara, juro que eu reprovaria nesse teste apenas por 1 DETALHE , juro que minha cabeça foi a zero quando li o botão REFAZER.. (Pra mim seria um reset) por conta disso iria dar ruim pra mim kk'
    Mas bem simples! tem mil formas de fazer essa tarefa e ficou muito legal! parabéns

    • @fernandev1
      @fernandev1  Рік тому

      e aí NewGate! realmente os testes as vezes bugam nossa cabeça. alguns casos você pode saber criar a solução, mas da maneira que o problema lhe foi apresentado, as vezes você pode não fazer a conexão na sua cabeça entre os dois.
      dica: caso você não entenda um teste em algum processo desses, seja franco com o recrutador e peça para ele te explicar usando outras palavras. as vezes uma simples palavra, pode fazer a diferença nesses casos! 🥳

  • @mvmes23
    @mvmes23 Рік тому

    so ficou faltando transformar em circulo que é o que o teste pede, só isso ja comeria uma boa parte da nota, apesar de as funcionalidades estarem ok, nao atingiu o cerne do problema. acredito que no proprio css usando um borderRadius da pra brincar em tentar construir um circulo, porém o circulo não se formaria exatamente no meio do click, mas daria pra contornar isso tirando a metade do tamanho do heigh e widht na hora de fazer o style dinamico, no mais, excelente vídeo, ja uso react a um tempo pro frontEnd, e vi uns métodos ali que eu não conhecia como o stopPropagation, só isso ja vale a inscrição, mas senti falta de uma explicação de cada coisa que você usou ali, , tendo em vista que vc está fazendo este vídeo para iniciantes ajudaria demais, poderia resumir como funciona esse stopPropagation?
    agora uma dúvida invéz do slice seria válido usar o pop? ou na sua opnião daria mais trabalho fazer com o pop?

    • @fernandev1
      @fernandev1  Рік тому +2

      fala Marcos, a stopPropagation() tem um comportamento parecido com a preventDefault(). mas nesse caso, ela impede que o evento gerado no elemento filho 'se propague' para o elemento pai, evitando então um duplo evento de onClick. faz sentido?
      o .pop() também pode ser usado, mas ele tem comportamento diferente, ao chamar ele, o array onde você disparou é alterado no momento; então cuida com esse comportamento e manda bala. 🥳

  • @leoaguiar7127
    @leoaguiar7127 Рік тому

    conteudo muito bom, é recomendável usar typescript no react? ou tanto faz

    • @fernandev1
      @fernandev1  Рік тому

      e aí Leo, tudo bem? cara, se você já se sentir seguro no react, eu super recomendo avançar para o typescript. no começo ele dá vontade de chorar, mas depois você não vive sem ele 🤣

  • @samukarbrj
    @samukarbrj Рік тому +1

    cara que legal a abordagem mostrada, eu não pensei na mesma forma de realizar a tarefa.

    • @fernandev1
      @fernandev1  Рік тому

      e aí Samuka! e essa é a melhor parte da programação, podemos achar várias soluções diferentes para um mesmo problema! 🤓

    • @samukarbrj
      @samukarbrj Рік тому

      @@fernandev1 acho que até me expressei mal. algumas partes da tarefas eu não pensaria igual vc, no passo a passo.
      em outras partes eu vi que em python seria mais fácil com o .append, eu acho kkk

  • @volneyrodriguessilva
    @volneyrodriguessilva Рік тому

    Vídeo muito bom

  • @ianfranca8974
    @ianfranca8974 Рік тому

    Faala, Fernandev. Mais um conteúdo top no seu canal. Como eu já disse, didática monstruosa! kkk Quase terminei o desafio, porem esta ocorrendo um erro ao apertar o botão de redo. O meu codigo tirando os nomes das variáveis, esta exatamente igual ao seu, porem da esse erro: Uncaught TypeError: Cannot read properties of undefined (reading 'clientY'). Como eu disse somente ocorre quando aperto o botão de redo. Que esta nessa parte do codigo:
    {cordenadas.map((item, indice) => (
    ))}
    seria de grande aprendizado se conseguisse me ajudar, talvez seja até pra outra pessoa. Abraço!

    • @fernandev1
      @fernandev1  Рік тому +1

      fala Ian, desculpe a demora na resposta, ainda estou de férias. cara, posta seu código no codesandbox.io que eu dou uma olhada para você! 😎 me manda aqui...

    • @ianfranca8974
      @ianfranca8974 Рік тому

      Consegui resolver. Como eu tinha dito aí em cima, eu esqueci de utilizar o método length no array listUndo. Kkk 😁✌️

  • @Jack-ss4re
    @Jack-ss4re Рік тому +2

    18:38 mano existe alguma forma de fazer isso sem usar a prop style?

    • @fernandev1
      @fernandev1  Рік тому +2

      fala jack, tudo bem? cara, a prop style é a mais simples e direta de se fazer; mas também funcionaria com qualquer outra maneira que você consiga manipular propriedades css dinamicamente, como por exemplo styled-components. só que nesse caso, seria como matar uma formiga com uma bazuca, meio desnecessário sabe? rsrsrs

    • @Jack-ss4re
      @Jack-ss4re Рік тому

      @@fernandev1 sim, entendi, gostei da ideia do styled-components, eu uso Tailwind CSS então provávelmente seria essa minha alternativa hahaha ótimo vídeo, amigo :)

  • @AurelioCastrolk
    @AurelioCastrolk Рік тому

    Top Video !!!

  • @robsmeireles
    @robsmeireles Рік тому

    Mas não deveriam ser círculos, em vez de quadrados?

    • @fernandev1
      @fernandev1  Рік тому

      pois é Robson, falhei na prova 😔🤣

  • @pedrol6193
    @pedrol6193 Рік тому

    Qual a extensão q mostra os erros de código na tela do IDE?

    • @fernandev1
      @fernandev1  Рік тому

      fala Pedro, Error Lens no vs code. ela é maravilhosa! 🥳

  • @vitor.azevedo
    @vitor.azevedo Рік тому

    Alguém sabe qual extensão ele tá usando para o erro aparecer na linha em que ele digita?

    • @fernandev1
      @fernandev1  Рік тому +1

      fala Vitor! error lens se eu nao me engano! 😎

  • @ImpurosSerie-hz7bm
    @ImpurosSerie-hz7bm 6 місяців тому

    Dificil pra caralho!!1 🤣🤣

  • @marcelocampos_developer
    @marcelocampos_developer Рік тому

    fala amigo vou começar segunda na programação e me recomendaram fortemente ja que estou começando do 0 absoluto, estudar HTML e CSS3 por uns 2 meses e depois partir pro Java.. e olha eu nem sei oque to falando direito pra ter noção, só quero começar de alguma forma.. fui ver um curso online no Trybe e o valor é 24mil reais o curso e infelizmente não consigo e nem sei se vou realmente aprender mesmo, então vou começar com playlists no UA-cam e etc .. se alguem tiver dicas porque realmente estou começando do 0 agora que descobri qual programa que muitos usam q é o Visual Studio Code mais vou te falar não sei nada |!! kkk

    • @fernandev1
      @fernandev1  Рік тому +1

      fala Marcelo, tudo bem? que maravilha cara, seja bem-vindo ao mundo da programação! eu vou preparar também conteúdos para quem está iniciando do absoluto zero, e pretendo no próximo mês lançar algum treinamento de html e css. eu concordo que começar por html e css seja o correto e depois você parte pro javascript. manda bala! vai ser a melhor escolha da sua vida.

    • @marcelocampos_developer
      @marcelocampos_developer Рік тому

      @@fernandev1 obrigado de coração, sou apaixonado pela informatica concerto CPU's e otimizo pra games mais quero algo realmente expetacular como a programação me deseje sorte kk um abraço

  • @Brkzgamer
    @Brkzgamer Рік тому

    👏👏👏

  • @henrique_https
    @henrique_https Рік тому

    Achei seu canal incrível! Muito foda!! Deixa seu IG como link no perfil do canal

    • @fernandev1
      @fernandev1  Рік тому

      fala Henrique, acho que vou seguir sua dica, vou colocar nos próximos! @fernandof.dev

  • @agathamagnus3439
    @agathamagnus3439 Рік тому +1

    isso seria pra uma vaga junior?

    • @fernandev1
      @fernandev1  Рік тому +1

      oi Ágatha, tudo bem? esse eu acredito que seja para um pleno já. eu tenho esse vídeo aqui ua-cam.com/video/NAtf3T9gG7s/v-deo.html que é um desafio júnior, dá uma conferida!

    • @agathamagnus3439
      @agathamagnus3439 Рік тому

      @@fernandev1 Obrigada pela atenção !

  • @PedroSilva-fb9ut
    @PedroSilva-fb9ut Рік тому

    porque ta ventando no video?

    • @fernandev1
      @fernandev1  Рік тому

      uai 🤔

    • @PedroSilva-fb9ut
      @PedroSilva-fb9ut Рік тому

      @@fernandev1 kkkk desculpa por jnao ter comentado sobre o conteúdo , gostei e agradeço pelo o mesmo ,foi só curiosidade msm kkk

  • @ericalmeida2979
    @ericalmeida2979 Рік тому

    nice video

  • @eduardooliveira5257
    @eduardooliveira5257 Рік тому

    Muito bom, achei um pouco fácil o exercício!

    • @fernandev1
      @fernandev1  Рік тому +1

      e aí Eduardo, como vai? trarei uns testes mais avançados em paralelo também! 🤓

  • @motinha6185
    @motinha6185 Рік тому

    qual navegador você usa?

    • @fernandev1
      @fernandev1  Рік тому +1

      fala Motinha, google chrome padrão fifa meu brother. 🤣

  • @williamfernando3579
    @williamfernando3579 Рік тому

    👌