Build and Deploy a Fully Responsive Website with Modern UI/UX in React JS with Tailwind

preview_player
Показать описание
Master modern web development by building a responsive React JS application consisting of a stunning hero section, high-quality assets and gradients, business stats, reusable feature sections with call-to-action buttons, testimonials, and more!

⭐ Discount Code - JAVASCRIPTMASTERY

Showcase your dev skills with practical experience and land the coding career of your dreams:
✅ A unique YOUTUBE discount code is automatically applied!

📚 Materials/References:

In this course, you’ll learn:
- React functional components and their reusability
- React file and folder structure
- You’ll achieve mastery using Tailwind CSS
- Fundamental CSS properties to master flex
- From soft and pleasant animations to complex gradients
- Perfectly placed media queries for satisfactory responsiveness on all devices
- And at the end, you'll learn how to deploy your websites to extremely fast servers and give them a custom domain name using Hostinger

👇 Time Stamps
00:00:00 Intro & Setup
00:16:00 Structure & Layout
00:30:53 Navbar
00:44:23 Hero Section
01:07:24 Stats
01:12:36 Business section
01:27:15 Billing section
01:35:34 Card Deal
01:40:41 Testimonials
01:55:28 CTA Section
01:59:18 Footer
02:12:11 Deployment
Рекомендации по теме
Комментарии
Автор

I've been following you since your node js how to create pdf video, and since then I've learned a lot from you. You're the reason I've come into the field of freelancing, and let me tell you, the things I've learned from you helped me a lot in my career. You are really an inspiration to me because you are the only person that helps me a lot in my career, and I still wait for you to upload because there are many things to learn from you.

Lastly, thank you so much for providing such high-quality content!

SameerAhmad-qlnr
Автор

As a new comer of tech who is trying hard to build my own portfolio, this is the first web development video that I followed all the way through. Your tutorial is super organized and easy to comprehend from scratch. I even felt this 2-hr video is not long enough lol. Can't wait to watch other videos of yours. Thank you Thank you!

waynezhou
Автор

Man. I did all your React projects and have learnt SO DAMN MUCH!! Some courses taught concepts, but yours really helped me to put these concept into use. Thank you so much!! Really appreciate that you made all these content free. It has been a big help in my career! Thank you!

yyxx
Автор

When I say no one does it better than you, I mean every single word of it. You are the best, I recently started learning web development, but I can tell you that I've never seen a page that takes it time to educate people like yours, all your projects are amazing, how do one even thank you? I sincerely want to use this medium to say a big thanks for all you do, I know its time consuming but you still take it upon yourself to dedicate these times to teach and educate us, God bless and enrich you wherever you are. Thank you so so much, the best channel so far.

MichaelHughes-vxsh
Автор

Bro you are really good at teaching us how to build a project from scratch, as a beginner, i love the way you already declare all the tailwind styles and make it to look so easy to use, this video is gold if you're browsing for some mind refreshing with react + tailwind and responsive design, 100/10 bud, thanks again <3

LuisMartinez-senp
Автор

Here comes my favourite line "Welcome to a project video" 🤩❤

DeveloperJunaid
Автор

Thank you so much jsmastery, I am just 17 yrs and you have made me one the youngest and incredible developers in my state. With a lot of people asking me how I learn so fast

wilsonibekason
Автор

I love how you made styling more fun by making it dynamic! Please do more projects just like this with react and tailwind!

earthtomemphis
Автор

This looks beautiful, props to the designer. I'm inspired. I always wanted to use tailwind, great weekend project

scorpion
Автор

Just yesterday I was looking for tailwind tutorials but I couldn't find any latest videos and today I got a discord notification about your video and I'm super excited to follow along! Thanks

adityarajguru
Автор

Great video! Learned a lot from it. Something that might help some people is that instead of doing a margin right and margin bottom with the flexed items, you could just use the gaps utility class instead to save you typing a lot. For example 'flex gap-6' will flex the items and then give you a gap of 1.5rem or 24px between the flexed items, and you can use gap-x-6 for example, if you only want the gaps to affect horizontally flexed items and gap-y-6 to target the gaps on the y-axis (vertical gaps).

However, gap-6 is great if you want the gap irrespective of the orientation of the flexed items.

richardogujawa-oldaccount
Автор

Love this. 👏😃🔥This will sound weird because I’ve seen and followed along with your project videos and they are much ambitious in scale, but this is becoming my favorite because it’s allowing me to see how you are coding the design from figma which makes me see how something like a graphic or ux design is coded. It’d be great to be see more tailwind or design centric sites. Not many do this and I can see how the site comes to life. You are amazing. Please make this site evolve with e-commerce or do something similar with e-commerce. So far my favorite are your tiktik and portfolio videos.

denniszenanywhere
Автор

Thank you for sharing such a wonderful tutorial using React JS and Tailwind CSS and I really like how you manage your file and folder structure, I found this unique and really love how you structure them and thanks once again and hope more will come ! :)

sayemalmahdi
Автор

For anyone facing the issue with CSS not showing the same as it is in the video

I think we all followed what was mentioned in the latest docs of tailwind website

To be able to get things work the same way as in this video, please do this:


npx tailwindcss init -p

npm i


and then finally

npm run dev

zarrarpalekar
Автор

man I just started learning to code because I want to develop on the web and the truth is that your video has motivated even more to go after my dreams. I have no idea about half of the things you do in this video haha but I have many ideas that I want to execute and what you teach in your videos man is simply gold! Thank you with all my heart for sharing your knowledge to the world.

josalejolo
Автор

Just a day ago I was browsing entire YouTube for at least one good video to learn tailwind. Tada 🎉 now you upload this amazing course 🤩

you can't even imagine how excited I'm rn!! Thank you so muchhh

sharanvkt
Автор

Your are always fully loaded with content that is always so rich yet you do not charge even a penny!!! You are just awesome!! Your channel is like a university for us developers to learn the skills that help us to grow in our careers phenomenally. Thank you for all your glorious efforts.
P.S. Please try and add GSAP animtions in your websites and teach us that too.

darpananeja
Автор

I never knew this before. Such a wonderful new way to create website with React. Amazing!

thomaschang
Автор

I don't usually comment on videos, but I got say thank you for this. Just finished this project and added it to my portfolio. A lot of knowledge acquired

matheusferreira
Автор

Your tutorials are easy to follow and provide amazing results!

deleted_account-uw