Resolvendo DESAFIO de VAGA FRONTEND com React, Next JS, Typescript – parte 2
Continuando a resolução do desafio de vaga frontend, vamos abordar mais algumas técnicas e conceitos fundamentais para o desenvolvimento de aplicações web com React, Next JS e Typescript. Na parte 1, abordamos a configuração inicial do projeto e a criação de componentes básicos. Agora, vamos nos aprofundar em outras funcionalidades e boas práticas.
Utilizando Hooks
Os Hooks são uma adição importante ao React, que nos permite utilizar funcionalidades de ciclo de vida, estado e outros recursos do React em componentes funcionais. Vamos explorar o uso de Hooks, como o useState e o useEffect, para gerenciar o estado e os efeitos colaterais de um componente.
Implementando rotas com Next JS
O Next JS possui um sistema de rotas integrado que nos permite definir rotas de forma simples e eficiente. Vamos aprender como utilizar as rotas do Next JS para navegação entre páginas e passagem de parâmetros.
Trabalhando com tipagem em Typescript
O Typescript nos permite adicionar tipagem estática ao JavaScript, garantindo mais segurança e prevenindo erros durante o desenvolvimento. Vamos explorar como utilizar Typescript para tipar os componentes, props e estados da nossa aplicação.
Conclusão
Com essas técnicas e conceitos, estaremos mais preparados para enfrentar desafios de vaga frontend que envolvam o uso de React, Next JS e Typescript. É importante continuar praticando e aprofundando o conhecimento nessas tecnologias, buscando sempre novos desafios e projetos para aplicar o que aprendemos. Continue acompanhando o nosso blog para mais dicas e tutoriais sobre desenvolvimento web.
👉 Curso para aprender React JS e Next JS!
https://www.rocketseat.com.br/ignite?utm_source=influencer&utm_medium=publipost&utm_campaign=lead&utm_term=ignite&utm_content=lead-ignite-publipost-organic-cupom_KIPPERDEV-none-none-none-none-redes_kipperdev&referral=kipperdev&coupon=KIPPERDEV@IGNITE
CUPOM: KIPPERDEV@IGNITE
O styled component como uma grande string única não seria terrível pra debugar?
Aproveita e desenvolve o back-end em NodeJs desse sistema, já que o front já está feito. Ia ajudar bastante!
Olá Feh tudo bem ? adorei seu video, vou tentar fazer sozinho e usar seu video aonde eu tiver dificuldades… uma duvida, eu sou JR e comecei na primera empresa agora, deveria ser capaz de conseguir fazer isso já sozinho ?
onde vc aprendeu tudo isso ? estou pensando em começar na alura ou na rocketseat.
Obrigado por trazer um projeto como esse Fer, ficou muito bom 😍👏
Fê, estou prestes a começar em um cargo de Desenvolvimento Front-End em um projeto na Petrobras e essa aula foi uma interessante descoberta para minhas revisões em React. Parabéns por sua incrível aula e por fortalecer a presença feminina e nos mostrar que também podemos brilhar como desenvolvedoras. 💪🚀
excelente conteúdo!
trabalho com desenvolvimento web e mobile, mas tenho um bloqueio pessoal com web e assistir suas aulas tem me ajudado bastante a me arriscar um pouco mais nesse mundo! Obrigado e parabéns. Deus te abençoe continuamente.
Ótimo vídeo, curti muito acompanhar e fazer funcionar!
A maioria das coisas funcionaram pra mim, porém tem um bug que acontece quando a página é atualizada, ou quando o usuário vai pra outra página e volta pra Home, os styled-components param de funcionar para os items, e se caso entrar em um produto ou se fizer alguma atualização em algum componente manualmente ele volta a se comportar normalmente.
Alguém sabe ou já viu esse bug ? @kipperdev
qual é o melhor css o tailwindcss ou SASS ?
Nao tem um jeito de fazer o contador do carrinho atualizar sem precisar dar reload na pagina??
Obrigado pelos vídeos! Fiz o deploy do frontend na vercel mas para isso tive que remover o window como dependência do useEffect. Está dando erro de window not defined. Mas sem ele quando redireciono para outra página por exemplo, aparecem componentes indesejaveis antes de terminar o loading. Pensei que o problema era pq eu não tinha uma página loading mas continuou dando esse problema. Sabe como resolver o erro do window?
Boa noite fernanda, muito obrigado pelo conteudo! queria comentar com você se é comum no dia a dia do desenvolvedor estilizar igual a você no video, em um componente styled components ter dentro dele elementos comuns html por exemplo, h2, span, div e p. E ai ir selecionando eles como filho la na estilização do componente styled components e ir estilizando as tags html comuns como h2, div e etc… essa é uma boa pratica??
Parabéns Fer , por toda dedicação nos projetos transmitidos, sou inscrito recente e fã, fazendo transição de carreira para área téc, e me motiva muito ver a sua logica de aplicação e didática. Espero me tornar um Dev de qualidade, assim como você ;D
IT WAS DONE … Excelência no projeto !👋 Estou a quase 2 anos na rocketseat , trabalho como fullStack júnior atualmente em um a empresa super cool … Migrei de carreira aos 45 anos. A experiência nos trás maturidade … Acredite em você! Invista em seu potêncial. ( Os dois vídeos são ótimos, explicações e pausas para esclarecimentos são dignos de uma teacher (high qualified.) Não acredite nas promessas de 6 meses , acredite em um plano de estudos sério com gente qualificada. Fiz muitos e muitos projetos com devs do brasil e de fora devido a fluência em inglês , más confesso que tirei dúvidas essenciais neste projeto com a Fê e ela não fica devendo nada aos amigos que fiz espalhados pelo planeta extremamente qualificados nas stacks utilizadas aqui. Essa garota vai longe … Vale seguir tudo o que ela indica. E quanto a rocket??? Mandam bem demais … se tá iniciando , não deixe de guanabarar kkkkkkkkkk pega essa!
Que vídeo satisfatório de ver, estou fazendo um curso de React e Next e ver esse vídeo e entender oq está sendo feito é mto legal!
qual o teclado?
Você parece uma Sênior já. Já se porta como uma.
Olá Fernanda, tudo bem??
Acho que agora seria muito legal, se você fizesse, um resolvendo desafio de vaga backend java com spring boot, seria muito bom!
Você recomenda ir para Typescript ou react depois de javascript?