Getting Started with Vite, Tailwind CSS, and React Router DOM 6: Create a Multi-Page website

Are you looking to create a multi-page application with React, but don't know where to start? Look no further! In this video, we'll guide you through the process of setting up a starter project using Vite, Tailwind CSS, and React Router DOM 6.
We'll start by showing you how to create a new project using Vite and install Tailwind CSS. Then, we'll set up our project structure and create a basic Navbar and Footer using Tailwind UI Navbar component.
Next, we'll create a Home page, Services page, Portfolio page, and Contact page, all with their respective routes using React Router DOM 6. We'll demonstrate how to use Tailwind CSS to style each page, so your app looks great and professional.
By the end of this video, you'll have a solid foundation to start building your own multi-page applications with React, Vite, and Tailwind CSS. So, grab your coding tools and let's get started!
#vite #tailwindcss #react #reactrouter #webdevelopment #frontenddevelopment #coding #tutorial #howto #webdesign #uidesign #fullstack #learntocode #development #webdeveloper

[@rabiafaisal558]

kindly carete more videos like this.... on react

[@bloklab]

Thanks for the comments, be sure to subscribe and turn on notifications for when we upload more

[@lucasmoratonieto2124]

Thank you so much, you do not know how much you have helped me. I was so frustrated. Thank you very much seriously. Thank you

[@bloklab]

👍

[@itsNicoRepx]

Mate, You are brilliant! Straight to the point on the content and totally understandable. Defo a new sub! Will look forward to your new content.Keep Up!!

[@benh8199]

you didn't set the active link to highlight properly in the navbar

[@bloklab]

Thanks @benh8199 for me this is a personal preference as I like the navlinks to remain consistent and clean. I guess you could do this if you like. Hope you enjoyed the vid.

[@rabiafaisal558]

thanks .... finally i got it....

[@0lange]

can you link the github repo for this?

[@bloklab]

github.com/omar-ahm/tw-vite_project with newly updated contact form

[@mokho3027]

loved it.

[@underscore8212]

Thank you very much!

[@vedakeerthip1224]

how the colour picker was showing in the .jsx file in VS code ?

[@quinndaisies6949]

I love the concept, but when running npm run build, I believe there is a whole different principle to that? Pardon my blunder I'm two weeks into react.

[@adrianvallereanopedrosa1479]

in the root directory you can find another folder named [dist]. you can deploy that. if you have xampp you can deploy that locally

[@danielcervatescorona817]

bro video was great, but the soundtrack was dope as fuck!

[@cg-jf7lp]

why did you remove import React from 'react'? Does this have to do with React version 18?

[@user-uk7tw4tr3s]

In the last version you can remove it without any problem

[@achirasilva2567]

try to speak and explain what you are doing