Loading...
「ツール」は右上に移動しました。
利用したサーバー: wtserver1
380いいね 13,654 views回再生

🔥Complete Responsive Gym Website with ReactJS + Tailwind CSS + Framer-motion | Yoga Website

🧑🏻‍💻In this tutorial we'll build and deploy Animated Responsive Gym Website with ReactJS , Tailwind CSS and Framer-motion.

👀 Live Preview: https://coders-gym.netlify.app/

💖 Source Code ( Support me ) : https://buymeacoffee.com/thecodingjou...
👨🏻‍💻 Starter code (Files + Assets) : https://github.com/dilshad-ahmed/code...
🎁 Join our community and Get the source code absolutely Free

💬 Join our community
WhatsApp :- https://chat.whatsapp.com/Hu643OfjQax...
Telegram :- https://t.me/the_coding_journey

🎬 Playlist ( Full website Build from scratch + Free Assets + Free Code )
   • Complete Responsive Websites ReactJS and T...  

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Features:
👉🏻 Animated Hero page.
👉🏻 Responsive Navbar section with Mobile sidebar menu.
👉🏻 Framer Motion animation.
👉🏻 Fully responsive Hero page (All device supported ).
👉🏻 Tabs section
👉🏻 Responsive Footer section.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

What you will learn:
🔥 How to build Responsive Navbar using ReactJS.
🔥 How to build Modern Responsive Animated Hero page using ReactJS and Tailwind CSS.
🔥 You'll learn to animation on websites using Framer motion.
🔥 You'll build fully responsive website in reactJS using Tailwind CSS
🔥 Best practices and debugging skills.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

⏱ Timestamps
00:00 Demo
04:18 Project Setup
06:38 Configuring tailwind CSS
08:03 Responsive Navbar Section
24:38 Hero section
35:46 Equipment section
47:43 Banner Section
01:01:36 Tabs section
01:16:02 Testimonial Section
01:30:05 Discount banner section
01:36:43 Responsive Footer section with Tailwind CSS
01:47:11 Deploying the app
Like👍🏻 and Subscribe 💖 the video to get more videos like this.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

💼 Packages :
tailwind css - https://tailwindcss.com/
react - https://react.dev
framer-motion- https://www.framer.com/motion/
vite js - https://vitejs.dev/guide/
react icons - https://react-icons.github.io/

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Follow us on -
Facebook -
  / thecodingjourney  
Instagram -
  / the.coding.journey  
Twitter -
  / thecodingjourny  

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

#reactjs #reactproject #gymwebsite #yoga #yogawebsite #tailwind #fitness #fitneswebsite #framermotion #gym #responsivewebsite #tailwindcss #reactwebsite #websitedesig #css #webdesign #webdevelopment #frontend #frontenddevelopment #uidesign #thecodingjourney #tcj #coding #codingtutorial #coding #uiux

コメント