How to Make Google Website Using React JS & Styled Components - Beginner Tutorial

Поделиться
HTML-код
  • Опубликовано: 20 май 2024
  • How to Make Google Website Using React JS & Styled Components in this Beginner Tutorial. We will use React JS, styled-components & React Router for this project.
    If you want to follow me along my coding journey, be sure to subscribe :)
    / @briandesign
    If you want to get 2 FREE Stocks valued up to $1850, you can here bit.ly/webull-join
    Source Code:
    www.codavilla.com/posts/how-t...
    Timeline
    0:00 What we are building
    0:48 Creating React App
    3:12 Creating Project Files
    7:16 Creating Navbar
    17:02 Creating Pages
    18:33 Creating Routes/Links
    22:08 Creating Home Page/Search Section
    35:34 Creating Global Styles
    Check out this awesome tech gear
    Macbook M1: amzn.to/3nBvfkM
    Wireless Keyboard: amzn.to/2Wxf5g1
    Wireless Mouse: amzn.to/3r6VRfj
    Wireless Earphones: amzn.to/3gZlLgt
    If you want to follow me along my coding journey, be sure to subscribe :)
    / @briandesign
    Check out my other React Website Videos
    Make a React Real Estate Website
    • Make a React Website w...
    Make a React Website Using Tailwind CSS
    • Make a React Website w...
    Make a Website using Gatsby & Graph QL
    • Build a Responsive Web...
    Some links in the description are affiliate links, which means that if you use them I will receive a small commission.

Комментарии • 39

  • @MahmoudMahmoud-xo4xe
    @MahmoudMahmoud-xo4xe 2 года назад

    Bro thank you so much for your tutorials, been learning react this year so i'm thankful to the RUclips Gods you popped up

  • @masaocodes
    @masaocodes 2 года назад

    Hey Brian, nice video! I just started my channel and also did a React / Google tutorial (but with Material UI). I found your Google tutorial after!

  • @jotarz96
    @jotarz96 2 года назад

    Great tutorial, thanks you !

  • @vibelover5444
    @vibelover5444 2 года назад +1

    as usual enjoyed, thank you, volume could have been enhanced a bit!!

  • @CodingFire
    @CodingFire 2 года назад

    Great content sir

  • @kirant9339
    @kirant9339 2 года назад

    Hi thanks for giving this good tutorial ,as usual ur tutorial are awesome ,and be safe thanks once again

  • @Mr_Brian
    @Mr_Brian 2 года назад +1

    Hey Brian, keep up doing what you do. I miss your 2 hour + videos on react JS. I have done several videos that you've posted so I know I enjoy them.
    Please consider making one full FREE course. For instance a shopping cart site or anything else that takes your fancy as long as it's in react JS and it's over 2 hours.
    Thanks in advance.

    • @briandesign
      @briandesign  2 года назад +5

      Thanks Brian! Yeah I've been super busy with other things lately, so haven't had the time to make those longer videos atm. They sometimes take 2-3 months to make, so once my time frees up I'll work on them

  • @crb1crb239
    @crb1crb239 2 года назад +2

    good tutorial. keep them coming brother...volume sounds a bit low.....i have to max my audio to hear u ..

  • @jamessmith_321
    @jamessmith_321 2 года назад

    Been watching your video...awesome.. Would love to see yous hare about how you learned coding? I'm a designer learning coding now and I want to know how to learn faster.

  • @kimdequilla7503
    @kimdequilla7503 2 года назад

    Thanks

  • @subhashparwani5843
    @subhashparwani5843 2 года назад

    Sir, can you make the video on React js navbar click function? After clicking the navbar item, it should go to that section on the same page. NOT THE ROUTING from one page to another. PLEASE, SIR.

  • @tranucquang2617
    @tranucquang2617 2 года назад

    Thanks for your tutorial.
    I have one issue. when I run the app again, it only start with navbar only, the searchbar doesn't show up

  • @lazargumarov5008
    @lazargumarov5008 2 года назад

    Hi. Where can I find your SVG file source code?

  • @samchen5462
    @samchen5462 2 года назад

    Great video. Can you make one on how to make a website to track stocks going to the moon?

  • @affiliateMandanimation2919
    @affiliateMandanimation2919 2 года назад

    Hey, I want to talk to you regarding design stuff. How can I do that?

  • @Ma-yi8fg
    @Ma-yi8fg 2 года назад

    Can you make a video on how to make a signin/register button that fully works

  • @Strikas_shroud
    @Strikas_shroud Год назад

    For people having issue with routing:
    reactrouter is upgraded to v6.
    "Switch" is degraded and you have to use 'Routes' to wrap up the 'Route' elements. Also now in reactrouter v6 route should be embedded as " ". 🔧

    • @Strikas_shroud
      @Strikas_shroud Год назад

      @BrianDesign ,plz pin this up for future viewers

    • @briandesign
      @briandesign  Год назад +1

      I made two new tutorials on react router v6.4 with the new routes

    • @Strikas_shroud
      @Strikas_shroud Год назад

      @@briandesign

  • @jaesuklee8585
    @jaesuklee8585 2 года назад

    is this really for beginner?

  • @yama331
    @yama331 2 года назад

    I love your video, Plz Add korean subtitles :(

  • @byzeezus
    @byzeezus 2 года назад

    hi brian can you make an html, css and js tutorial but with an actual image in the navbar

    • @briandesign
      @briandesign  2 года назад

      like a logo?

    • @byzeezus
      @byzeezus 2 года назад

      @@briandesign yea like a logo for the navbar

  • @anbubala3237
    @anbubala3237 2 года назад

    Hey brain, please upload website like swiggy and zomato.

  • @CrookzArtwork
    @CrookzArtwork 2 года назад

    Hope u well

  • @ipsb
    @ipsb 2 года назад

    Hey Brian Checkout JellyFish Theme for vscode. Highly recommended

  • @ejbrocfc
    @ejbrocfc 2 года назад

    Your volume is ?????

  • @daoverlord1913
    @daoverlord1913 2 года назад

    Yoo how u been

    • @briandesign
      @briandesign  2 года назад

      yoo been good! just have a lot of other things I'm working on

  • @muhammadolim6959
    @muhammadolim6959 2 года назад

    YOO YOO WHAT'S GOOD EVERYONE

  • @lloparyllopary
    @lloparyllopary 2 года назад

    github?