Deepak Modideepakmodi.hashnode.dev·Feb 12, 2025Building My Personal Portfolio Website with React and Tailwind CSSIntroduction Hello everyone! 🚀 I recently built and deployed my personal portfolio website, and I’m excited to share the journey with you. This portfolio is a reflection of my work, skills, and projects, crafted with modern web technologies like Rea...28 readsportfoliowebsite
Arihant Jainarihant.hashnode.dev·Feb 5, 2025How I Rebuilt My Portfolio and Solved Deployment Woes With AILast weekend, I finally decided to revamp my portfolio, which had been sitting as a static site on GitHub Pages for a long time. Honestly, it took me four years to gather the motivation to rebuild it—mostly because I'd rather spend my time reading ho...117 reads2Articles1Week
syncfusionsyncfusion-blogs.hashnode.dev·Jan 24, 2025Effortless React Animation: A Guide to Framer MotionTL;DR: This blog post provides a comprehensive guide using Framer Motion, a React animation library. It covers key concepts like motion components, variants, and transitions and provides practical examples of creating fading button, slide-in sidebar,...framer-motion
Samir Shumanblog.devmansam.net·Jan 18, 2025Making Your First 3D Web Animation with THREE.js and Framer-Motion (It's as Easy as Pie!) 🍕Remember that pizza-filled text from my last post? Well, today we're taking that delicious inspiration to a whole new dimension. The third dimension to be exact! Instead of just filling text with pizza, we're going to be cooking up an extra-large, in...3 likes·166 readsReact
Forhad Hossaincodeforhad.hashnode.dev·Jan 4, 2025Creating a Magical Pulsing Dot Background Animation in ReactHave you ever wanted to add a touch of magic to your React applications? In this tutorial, we'll create a mesmerizing background animation using React and Framer Motion that features pulsing, glowing dots. This effect can add depth and interactivity ...26 readsJavaScript
James Amoojamesamoo.hashnode.dev·Dec 20, 2024Behind the Code: Portfolio SiteIf you came across my portfolio site and are interested in the logic, idea, and overall working principle, then this documentation is for you. In this doc, I’ll walk you through the development of my portfolio site, including all the languages used, ...Programming Tips
Brian Muchirafitness-app-react.hashnode.dev·Dec 6, 2024Craft Stunning Landing Pages with the Power of Next.js and Tailwind CSSNavbar <div className=' w-full p-4 flex items-center justify-center fixed top-0 z-50 '> <div className='border bg-neutral-950/70 border-white/50 w-full lg:w-[800px] mx-5 md:mx-24 rounded-[40px] md:rounded-full backdrop-blur'> fixed: Positions the...1 likelanding page
Ravindra Nagblog.ravindranag.in·Nov 30, 2024Route Transitions using motion (previously framer-motion)Hey there! I am working on my portfolio and plan to use motion’s AnimatePresence and layout animations. Its very exciting to see the creative peeps coming up with these amazing transitions using motion. I have managed to animate the change of routes....1 likeReact
Mary Ojoblog.maryojo.me·Nov 30, 2024Create a Loader with Infinite Movement using Framer MotionDifficulty: ⭐️ (1/5 stars) Setup/Prerequisites: React.js, TailwindCSS, Framer Motion Key Concepts: Using infinite animation in Framer Motion The Challenge Day 2 is a simple loader which shows infinite animation by bouncing. This animation is quite si...React
Sujan Dhakalsujandhakal.hashnode.dev·Nov 30, 2024My First Framer Motion Project: Bringing Animations to Life in ReactIntroduction: After spending some time learning the basics of Framer Motion, I decided to build a small project to put my new skills into practice. This post showcases the result: a [brief description of your project, e.g., simple interactive card co...React