PinItUp is a modern, interactive web application that allows users to create and manage personal sticky notes with a playful and visually appealing design. Built with Next.js, TypeScript, and Tailwind CSS, the app features randomly styled notes with unique fonts, colors, and moods, along with drag-and-drop functionality, local storage persistence, and delightful animations like a loading spinner and floating background elements. Users can add, delete, and reorder notes, making it a fun and functional tool for jotting down ideas, affirmations, or reminders.
- Create notes with random fonts, background colors, text colors, moods, and pin colors.
- Drag-and-drop to reorder notes.
- Delete individual notes or clear all with a confirmation prompt.
- Persist notes in the browser's local storage.
- Responsive design for desktop and mobile.
- Interactive UI with hover effects, 3D tilt, and animations.
- Next.js: React framework for server-side rendering and static site generation.
- TypeScript: Adds static types for better code reliability.
- Tailwind CSS: Utility-first CSS framework for styling.
- React Icons: For the delete button icon (TbCut).
- Font Awesome: For additional icons (e.g., create and clear buttons).
- Google Fonts: Custom fonts for a handwritten look.
- Local Storage: Persists notes in the browser.