Agentes do Valorant - Parte 1: Estrutura Inicial do Projeto - NextJS, TypeScript e Sass

Поділитися
Вставка
  • Опубліковано 8 сер 2024
  • No primeiro episódio da série "Agentes do Valorant", vamos conhecer a estrutura inicial do nosso projeto. Para o desenvolvimento dessa aplicação será usado TypeScript, Next.js (um framework React.js) e Sass.
    Ao longo desta série, vamos explorar cada detalhe do projeto "Agentes do Valorant" e aprender a criar um aplicativo web de qualidade. Não se esqueça de se inscrever e ativar as notificações para não perder nenhum episódio.
    Link do notion: leovargas.notion.site/Agentes...
    OBS: Me desculpem pela qualidade da intro, não sei porque o áudio ficou bugado :/
    🎥 𝗢𝗨𝗧𝗥𝗢𝗦 𝗩𝗜𝗗𝗘𝗢𝗦
    • Criando um portfólio do zero
    • CRIANDO UM SITE DE POR...
    • Projetos de frontend para o portfólio
    • Criação de sites para ...
    • Configurando o ambiente de programação (linux, terminal, vscode)
    • Configurando ambiente ...
    ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
    🏘 𝗖𝗢𝗠𝗨𝗡𝗜𝗗𝗔𝗗𝗘 𝗡𝗢 𝗗𝗜𝗦𝗖𝗢𝗥𝗗
    / discord
    ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
    📱𝗥𝗘𝗗𝗘𝗦 𝗦𝗢𝗖𝗜𝗔𝗜𝗦
    ⮞ Twitch: / leovargasdev
    ⮞ Instagram: / leuvargas
    ⮞ Twitter: / leovargasdev
    ⮞ Github: www.github.com/leovargasdev
    ⮞ Linkedin: / leonardo-luis-de-vargas
    ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
    💻 𝗦𝗘𝗧𝗨𝗣
    Notebook Dell (amzn.to/48080ra)
    Tela 1: Monitor AOC(amzn.to/3NAJq8L)
    Suporte Ergonômico ELG (amzn.to/3t0i1G5)
    Hub USB C p/ usar na 2ª tela (amzn.to/3uI2jjs)
    Webcam Logitech BRIO (amzn.to/3RDm4BP)
    Microfone Blue Yeticaster (amzn.to/3sW32wW)
    Teclado Redragon Varuna (amzn.to/3T8Dkji)
    Mouse Logitech G300s (amzn.to/3Rtnfn4)
    Mouse Pad (amzn.to/3Rtnfn4)
    Estante (amzn.to/46KgVfr)
    ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
    📑 𝗦𝗨𝗠𝗔𝗥𝗜𝗢 𝗗𝗢 𝗩𝗜́𝗗𝗘𝗢
    00:00 Introdução
    00:34 Baixando os arquivos iniciais
    02:02 Explicando a estrutural dos arquivos
    05:45 Estruturando do index.tsx
    06:50 Diferença entre o CSS e o SASS
    10:00 Estilizando o home.module.scss
    15:45 Estilizando o background
    17:50 Encerramento
    #webdevelopment #reactjs #nextjs #sass #valorant
  • Наука та технологія

КОМЕНТАРІ • 28

  • @fabiomagalhaes7165
    @fabiomagalhaes7165 9 місяців тому +1

    Caramba, esse canal é muito top! To maratonando os vídeos todos.

    • @leovargas
      @leovargas  9 місяців тому

      Muito obrigado, esse tipo de feedback me motiva muito!! ♥️

  • @henriquesilva8351
    @henriquesilva8351 9 місяців тому +1

    Leo é muito brabo. Parabéns!!

    • @leovargas
      @leovargas  9 місяців тому

      Obrigado Henrique! 🤙

  • @PiguitoBr
    @PiguitoBr 9 місяців тому +1

    VIdeo Nicee

  • @diegoramiro25
    @diegoramiro25 9 місяців тому +1

    Maneiro o projeto e a stack que vai utilizar, sem falar que as suas edíções dos vídeos estão ficando PRO, aguardando os próximos vídeos 👏

    • @leovargas
      @leovargas  9 місяців тому +1

      Muito obrigado Diego!! Só o audio da intro ficou zuado.... vi só no pós edição :/

    • @diegoramiro25
      @diegoramiro25 9 місяців тому

      @@leovargas parecia que estava no banheiro kkkkkk

    • @leovargas
      @leovargas  9 місяців тому +1

      @@diegoramiro25 né 💀💀 ahauhauha

  • @JansenAlecsanderNalim
    @JansenAlecsanderNalim 9 місяців тому +1

    Projeto massa, Léo!

    • @leovargas
      @leovargas  9 місяців тому

      Valeu d+ Jansen!

  • @mat.amaral
    @mat.amaral 9 місяців тому +1

    Seus projetos são legais demais

    • @leovargas
      @leovargas  9 місяців тому +1

      Obrigadão Matheus!!!

  • @mat.amaral
    @mat.amaral 9 місяців тому +1

    TOOOOOOOOOOOOOOOOOOOOOP!!

    • @leovargas
      @leovargas  9 місяців тому +1

      🚀🚀🚀🚀🚀🚀🚀🚀🚀

  • @jessicabarbosa6900
    @jessicabarbosa6900 9 місяців тому +1

    Projetinho super legal

    • @leovargas
      @leovargas  9 місяців тому

      Obrigado Jessica!

  • @apxlxnix1
    @apxlxnix1 9 місяців тому +1

    Comentário pra engajar

  • @erickdavid2489
    @erickdavid2489 9 місяців тому +1

    continua fazendo esses projetos

    • @leovargas
      @leovargas  9 місяців тому

      Acabei demorando para gravar :/ mas eu não vou parar 💪

  • @YuriC03lho
    @YuriC03lho 8 місяців тому +1

    Boa noite!! Muito bom o projeto!! As tecnologias usadas no proieto se diferem muito de HTML e CSS? Eu estou aprendendo isso faz 1 mes.

    • @leovargas
      @leovargas  8 місяців тому

      O framework não vai eliminar um uso do HTML e do CSS, eles vão continuar existindo, só que o framework vai acelerar e facilitar o processo de desenvolvimento da sua aplicação.
      Por exemplo, ao construir um prédio você pode optar por usar tijolos ou usar pré-moldado, ao usar o pré-moldado você vai conseguir erguer o seu prédio com mais facilidade/praticidade, mas as regras da engenharia e arquitetura vão ser as mesmas para as duas opções.

    • @YuriC03lho
      @YuriC03lho 8 місяців тому +1

      Entendi, obrigado então! Vou começar a assistir agora!! @@leovargas

  • @lizz5042
    @lizz5042 9 місяців тому

    faz um videozinho pra iniciante, sou do back e to sofrendo demais. Por exemplo, quando criar uma div? Quando ela é realmente necessaria? Como pensar no html ja pensando nas divs/id/classes pro css?

    • @leovargas
      @leovargas  9 місяців тому

      Então, a div e o span são os elementos mais genéricos, não tem um propósito específico. Já o é usado para links, o para títulos, para parágrafos e assim por diante

    • @leovargas
      @leovargas  9 місяців тому

      Tem muito conteúdo bom para iniciantes aqui no UA-cam, vou procurar uma playlist e já lhe envio