Recriei o dashboard do iFood com React (app fullstack)
HTML-код
- Опубликовано: 5 окт 2024
- Conecte-se a 500mil devs e avance para o próximo nível com a nossa plataforma: rocketseat.com...
Cadastre-se na nossa plataforma: app.rocketseat...
Junte-se a mais de 392mil devs em nossa comunidade no Discord: / discord
Acompanhe a Rocketseat nas redes sociais:
Twitter: @rocketseat
Facebook: @rocketseat
Instagram: @rocketseat
Faz mais vídeos sobre backend, as aulas do Diego são muito boas.
Pode deixar!
finalmente m projeto full stack ne rs, tem que continuar nessa pegada my friend, foi epoca so de front.. tmj
Esse aqui é top!
ruclips.net/video/nGoSP3MBV2E/видео.html
diego faz video mostrando os programas que voce usa no seu mac no dia a dia , de produtividade , programacao , dados
Puts, seria bem legal mesmo
Pode deixar
Muito irado esse conceito de state na url, curti demais!
Show, tu é muito desenrolado.
Caraca que massa, pior que não conhecia esse conceito, mas tinha pensando que seria uma boa forma de guardar certas informações, também não sabia se seria bom fazer... Mas acabei que fiz mesmo assim kkkk, mas agr sei que tem uma lib que cuida desse gerenciamento de http state, muito bom
Da impressão que ele está conversando com um sênior
Fala @dieegosf, bem legal ver conceitos importantes sendo compartilhados. Só 2 pontos de atenção sobre os sort params.
Quando se tem um volume de dados grande a ser enviado para o filtro, não é recomendado usar os sort params por alguns motivos, dentre eles, o limite que a URL tem em relação ao tamanho, imagine filtrar um volume de 30 mil pedidos passando esses dados na URL?
O segundo está relacionado ao primeiro problemas, onde ao enviar um valor tão grande na URL, os sistemas de cloud, firewalls e demais sistemas de segurança encaram essa requisição como uma tentativa de invasão, isso realmente abre possibilidade de vulnerabilidades.
Em resumo, são recursos sensacionais, gosto muito de usar, mas cabe as orientações das limitações destes recursos.
Grande abraço
Man, talvez você tenha se confundido, mas o que é passado no SearchParams são chaves e valores que serão usado para filtro em uma requisição à API, e não os dados vindos dela pela URL.
Entendi sua colocação Melk, mas é sobre isso mesmo que falei, imagine a seguinte situação, um sistema onde os usuários são alocados em grupos dentro do próprio sistema.
Os grupos também podem ser criados a medida da necessidade do adm do sistema, então você pode ter 500, 1000, 1500 grupos em 1 sistema e ter 50000 usuários divididos em 2000 grupos por exemplo.
Digamos que você queira filtrar todos os usuários de 1600 desses 2000 grupos, então você passaria a chave groups na URL com os ids dos grupos separados por vírgula.
Percebe que essa é uma situação mas que pode acontecer em diversos caso? Vale se atentar para não cair nessas armadilhas
deixa uma duvida aqui pra comunidade, ou pra vc senhor diego... esses dias me falaram que uma app full stack digamos que seria menos segura do que uma app separada digamos assim backend separado do front, e eu basicamente queria saber se isso é real ou se é balela se vocês sabe de sei lá como aumentar segurança para mitiga riscos e etc... então é isso abraço mano. e caaaaara ta mt foda esse canalzinho aqui rs
Boa tarde, onde encontro as aulas do back-end? As aulas do front estão no módulo React, mas do back-end não achei
man esse cara é realmente fora da caixa!!!
Diego, tenho um macbook m2 pro, e a resolução do mac é toda estranha, e o aspect ratio tbm (16x10 se n me engano). Como vc lida com a questao de gravação de video pro youtube? Grava a tela toda e da um crop? Ou manda 16x10 msm? Valeeeeuu
FODA!
Diego, onde tu encontra essas tecnologias (ex: drizzle, orbstack), acompanhando alguem ou algum site?
twitter
Twitter como o amigo falou e recomendação.
Projeto foda Diego, pena que não tenho condições no momento de adquirir os cursos da Rocketseat.
Diego, quando for fazer algo voltado para o RUclips, evita os comentários em cima do conteúdo
É que esse conteúdo não foi pro RUclips, isso é ele fazendo live na conta pessoal dele, aí aproveitaram para postar aqui
Poxa... é que eu faço esses conteúdos ao-vivo e depois trago para o RUclips, mas vou ver se consigo mudar o CSS deles pra deixar um pouco menor.
em 0:26 voce fale que o frontend foi totalmente construido em ???? não dá pra entender o que é.
Nem todo mundo é tão bom em ingles como você, por isto poderia colocar uma legenda sempre que falar nome de bibliotecas em inglês, por exemplo.
shadcn/ui
Creio que seja shadcn/ui
Fala diegão, como você fez esse code no magic link? salvou no BD e depois remove quando o link é usado
?
onde essas lives estão acontecendo?
Twitch (usuário dieegosf)
estão utilizando mt o shad?
Diego e aquele vídeo clássico de como iniciar com Node em 2024? Aproveitando, ainda vale a pena nesse ano?
Boooa, vai rolar tanto pra Node quanto React! Vale sim :)
Os charts também são do shadcn?
ainda existe esse projeto completo na plataforma?
sim
Essas lives são de onde?
Que tipo de navegador é esse ai q ele usa?
o nome é arc é para mac mas em breve vai chegar para windows
O backend ta em qual curso?
vai sair no de Node.JS, porém ainda não está no ar
@@odeisouza opa, por isso q n tava encontrando
Aonde que o Diego faz live?
Twitch (usuário dieegosf)
Esse conteúdo faz parte do Ignite?
Sim
Onde essas lives estão acontecendo?
Twitch (usuário dieegosf)
Alguem que faz parte consegue me explicar como é o conteúdo pago deles? Se é algo gravado, ou se é como se fosse uma comunidade paga ou é um projeto de tiro curto.. tenho muita vontade de colar nesses caras
Existem várias formações:
- Node.Js
- React
- Python
- etc...
Dentro de cada formação existem vários projetos e dentro desses projetos você encontra:
- Aulas gravadas desenvolvendo um projeto acompanhando o instrutor
- Questionário múltipla escolhas sobre o que você aprendeu no projeto
- Desafio relacionado as coisas que você aprendeu, porém com um requisito a mais, fazendo com que você tenha que pesquisar um pouco
Lembrando que: você pode sempre assinar, vê se curte, caso não (dentro de 30 dias se não me engano), reembolsar seu dinheiro.
Eles tem materiais pagos, procura por ROCKETSEAT, as vezes tem imersões gratuitas muito boas, já fiz uma
quando voces vao colocar uuma assinatura vitalicia?
99% de chance de "nunca". Vitalício não existe juridicamente hahaha. Nosso conteúdo é atualizado semanalmente e, por isso, não fazemos vitalício, porque é muito conteúdo novo todos meses gerando sempre novas solicitações de suporte, acompanhamento dos alunos, etc...
@@dieegosf valeu monstro
Como que eu nunca pensei nisso mermão
Onde são as lives?
Queria muito assistir mas não achei em nenhum lugar o link
www.twitch.tv/dieegosf
Estão rolando na Twitch. O Mayk também tem feito lá
Uma pergunta, se alguem pegar esse link ou se algum script no browser conseguir captar essa url com o token, teria acesso a conta do usuário?
Alguma limitação usando Bun no lugar do Node ?
Eu tô querendo implementar passkey para passwordless Codbado
Qual o tema do seu Arc ?
Na verdade não, como falei, praticamente tudo igual. Sobre o Arc, eu configurei o tema manualmente na seleção de cores, simplesmente escolhi a cor cinza escura.
@@dieegosf já usou HonoJS ? Vi que tem um projeto usando elisya, hono segue a mesma linha mas também pode ser usado com NodeJs.
Não achei o curso na plataforma :(
Quarto módulo na formação de React
Alguém sabe qual lib de gráficos ele utilizou?
Recharts
qual é esse navegador do diego man, alguém sabe ?
Arc Browser
qual e o browser que ele usa??
arc browser, so tem para mac e ta em beta para win
Isso tá no ignite?
Sim
@@dieegosf valeu mano, acabei procurando e achei lá já tô chegando na metade kkkk
Uau, primeiro comentário...
Esses comentários do lado direito atrapalharam um pouco a visualização da página
Poxa... é que eu faço esses conteúdos ao-vivo e depois trago para o RUclips, mas vou ver se consigo mudar o CSS deles pra deixar um pouco menor.
@@dieegosfpelo que percebi, quando você foi abrir o dashboard, ele ficou em janela e centralizado, talvez fosse o caso de puxar mais pra esquerda e diminuir um pouco o chat ou tentar deixar ele com opacidade e diminuir sua câmera, sei que você é lindão, mas esse não deve ser foco kkk. de qualquer forma está perdoado 😂
Qual o nome da lib dos gráficos?
Tambem quero saber
Se eu não me engano, chama recharts
@@diegobonagurio9885issso
Diego, tira esses comentários da tela, atrapalha muito
APP full stack onde o back é Node kkkkkkk , mete um .Net. aí sim é moral
Sou novo na área. Mas já ouço muito falarem mal de node pro back.. pq mano? Quero entender de fato.
@@rmauto6273 Não tem nada de ruim, é só um bando de boçal que desmerece algo que não faz nem sentido, igual quando falam que HTML não é linguagem, pô por mais que seja fácil e simples ainda é uma linguagem, não liga, estuda node que é um bom caminho pro back
DotNet seria fortíssimo
@@rmauto6273 Porque os caras têm preconceito com JS para back, segundo eles, não é uma boa linguagem para isso, não é segura, não é performática e um monte de coisa que nem faz mais sentido, já que a linguagem vem evoluindo bastante nos últimos anos, principalmente com TS