The Link Sharing App is a fully functional full-stack application that allows users to create and share personalized profiles with links to their social media accounts. Built with modern web technologies, the app provides a seamless and intuitive user experience, featuring secure authentication, real-time updates, and a fully responsive design. This project is designed to showcase my expertise in building scalable, user-friendly applications with a robust tech stack.
Requirements
Users should be able to:
- Register and log in to create a personalized account
- Add, edit, and delete social media links
- Reorder links via drag-and-drop functionality
- Upload, update, and delete profile pictures
- Update their first name, last name, and email address
- View a real-time preview of their profile while editing
- Copy their public profile link to the clipboard for sharing
- View their public profile with all links and details
- Use the app on any device, thanks to a fully responsive design
Built with
Code Quality with
Project Highlights
- Account Management: Users can securely register, log in, and manage their personalized profiles.
- Link Management: Add, edit, delete, and reorder social media links with real-time updates reflected in the profile preview.
- Profile Picture Handling: Upload and manage profile pictures via AWS S3, with instant updates in the UI and a delete option.
- Dynamic Previews: Real-time updates of profile previews using Zustand for state management.
- Responsive Design: Optimized for mobile, tablet, and desktop with adaptive layouts and intuitive design elements.
- Form Handling and Validation: React Hook Form and Zod ensure seamless and robust form interactions with proper validation and error feedback.
- Database Integration: Utilizes Prisma and PostgreSQL for efficient and secure data storage and management.
- Public Profile Sharing: Generate a sharable public link for user profiles, with functionality to copy the link to the clipboard.
- Drag-and-Drop: Reorder social links intuitively with drag-and-drop functionality, synced in real-time to the state and database.
- Accessible and Scalable: Built using modern web technologies like Next.js, ensuring scalability and future-proof development.
Demo Video
Check out the demo video to see the app in action.