Resolvendo DESAFIO de VAGA FRONTEND com React, Next JS, Typescript e GraphQL – parte 1
Se você está em busca de uma vaga como desenvolvedor frontend e quer se destacar no processo seletivo, é crucial estar preparado para resolver desafios técnicos. Neste artigo, vamos abordar a resolução de um desafio com as tecnologias React, Next JS, Typescript e GraphQL. Este é o primeiro de uma série de artigos onde compartilharemos dicas e soluções para te ajudar a se destacar na vaga de frontend.
Para começar, é importante ter um conhecimento sólido em React, uma biblioteca javascript para construir interfaces de usuário. Além disso, o Next JS é um framework popular para React que adiciona funcionalidades como renderização do lado do servidor e pré-renderização, proporcionando uma melhor experiência ao usuário. Já o Typescript é uma linguagem de programação que adiciona tipagem estática ao javascript, tornando-o mais seguro e organizado. Por fim, o GraphQL é uma linguagem de consulta para APIs que oferece flexibilidade e eficiência na comunicação com o servidor.
No desafio que vamos abordar, é comum que seja solicitado o desenvolvimento de uma aplicação web que utilize as tecnologias mencionadas. Neste caso, o candidato pode ser desafiado a construir uma aplicação que consuma dados de uma API GraphQL e os exiba de forma organizada e responsiva na tela. Além disso, pode ser solicitado o uso de Typescript para garantir a segurança do código e a utilização do Next JS para otimizar a performance da aplicação.
Para cumprir o desafio, é importante estar familiarizado com os conceitos de componentização em React, a manipulação de dados em uma API GraphQL e a tipagem estática em Typescript. Além disso, é essencial compreender o fluxo de dados em aplicações Next JS e como otimizar a renderização do lado do servidor.
Nos próximos artigos desta série, vamos abordar cada uma dessas tecnologias e como aplicá-las no desenvolvimento da solução para o desafio. Fique atento para não perder nenhuma dica valiosa que te ajudará a se destacar na vaga de desenvolvedor frontend.
🚨🚨🚨 ATENÇÃO: Caso você esteja enfrentando algum erro ao criar o hook do LocalStorage, realizei uma tratativa para esse erro, a solução já está no Repositório do GitHub, o link está na descrição mas vou deixar aqui também! 😊
https://github.com/Fernanda-Kipper/challenge-frontend
Rapaziada , alguém mais com esse erro , já procurei muito mas nada que funcionasse "Unhandled Runtime Error
Error: The default export is not a React Component in page: "/""
Passando pra dizer que ter assistido/desenvolvido esse projeto meses atrás agregou bastante nos meus conhecimentos. Semana passada tive a oportunidade de fazer o desafio prático para uma vaga jr e quando vi o que era fiquei bastante tranquilo pq sabia tudo que precisaria fazer por ter feito esse com você!! Passei na prova prática e essa semana faço a entrevista com o rh, quem sabe consigo minha primeira vaga ^^' ! Parabéns pelo trabalho e muito bom ter esse conteúdo de graça aqui no youtube.
ou seu video me motivou muitoooo eu ai dormir, mas vou continuar a estudar, deixa pra dormir dps kkkkk e pertunta, como vc acha esses desafios?
Qual extensão você usa para ter essa snippet de !ef e já criar o export da função?
No seu trabalho você usa mais a estilização com styled components, sass ou taiwindcss ?
to com dificuldade na parte de trazer os conteudos da api graphql, não esta aparecendo nenhum elemento dos itens mas não está constando nenhum erro. o que pode ser?
Muito bom, manja demais!
Top demais o vídeo, tenta deixar sua cam menor da próxima :3
Essa mulher que deveria ser ser um exemplo pra todas, porque és muito inteligente ❤
O que essa mina manja de programação não é mole. Qualquer empresa BR que tu entrar e mandar um dev senior gravar um video igual, não sai 5% dela … Top de +
Maaaanda bem demais! Caraacaaas!
Teu canal é incrível!
a estilização com styled components dever criar um arquivo separado no reactjs ?
Olá Fernanda, o meu nome é César Oliveira, sou de Portugal.
Sou desenvolvedor mobile(Android) mas estou a tentar aprender o Next.JS 13+ porque tenho a necessidade de desenvolver um site e uma ou duas apps web.
Há uns anos trabalhei muito com web mas era back-end com ColdFusion e PHP. Então estou fora do mercado web. Mas quero expandir os meus conhecimentos.
Gostaria de te fazer uma ou duas pergunta:
Porque defines a tua page.tsx da raiz como sendo um Client side ? Não faria mais sentido se ela fosse Server side e certos componentes fossem client side ?
Obrigado
ótimo vídeo
Que isso, mulher! Quando eu crescer, quero ser metade do que vc foi nesse vídeo. Sensacional!
Ele ainda vivee!
Qual a extensão para fazer isso no 11:28 ?
Top demaiiis, que isso ein… Preciso aprender muito ainda kkkkkk. Galera, aí seria um nivel pleno?