The latest articles on DEV Community by Max (@brat_aa2370a80138e70e36cb). https://dev.to/brat_aa2370a80138e70e36cb https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3349306%2F606a3524-311d-4ab4-947f-8261031e69c0.png https://dev.to/brat_aa2370a80138e70e36cb en Max Mon, 14 Jul 2025 06:51:44 +0000 https://dev.to/brat_aa2370a80138e70e36cb/how-i-built-a-viral-brat-album-cover-generator-in-3-days-using-laravel-2mkn https://dev.to/brat_aa2370a80138e70e36cb/how-i-built-a-viral-brat-album-cover-generator-in-3-days-using-laravel-2mkn <p>!<a href="https://quickbrat.com/assets/images/shes-the-one.png" rel="noopener noreferrer">Brat Cover Example</a></p> <p>The Brat era—loud lime green, gritty fonts, and unapologetic energy—took over pop culture. Inspired by Charli XCX’s bold aesthetic, I built a free tool where anyone can design their own <em>Brat-style album cover</em>.</p> <h2> 🎯 The Project: QuickBrat.com </h2> <p><a href="https://quickbrat.com" rel="noopener noreferrer">QuickBrat.com</a> lets users instantly create and download custom Brat covers. It’s simple, meme-worthy, and viral-friendly. The goal was to make something fast, fun, and frictionless.</p> <h2> ⚙️ Tech Stack </h2> <p>Here’s what I used to build it:</p> <ul> <li> <strong>Laravel 10</strong> – backend framework</li> <li> <strong>Blade + Tailwind CSS</strong> – for front-end templating</li> <li> <strong>JavaScript + Canvas API</strong> – for image rendering and export</li> <li> <strong>MySQL</strong> – to store templates and user data</li> <li> <strong>Vercel</strong> – for deployment</li> </ul> <h2> 👨‍💻 Built with Simple Web Technologies </h2> <p>This is a simple open-source project built using <strong>HTML, CSS, and JavaScript</strong> — no frameworks, no heavy setups.</p> <p>If you're curious about the code or want to contribute, check out the GitHub repository:</p> <p>🔗 <strong>GitHub Repo</strong> → <a href="https://github.com/max-well04/BratGenerator" rel="noopener noreferrer">https://github.com/max-well04/BratGenerator</a></p> <h2> ⏱️ Timeline </h2> <p>I built it in 3 days:</p> <ul> <li>Day 1: Frontend layout &amp; image rendering</li> <li>Day 2: Laravel backend routes, text overlays, canvas exporting</li> <li>Day 3: Mobile optimization + social share preview</li> </ul> <h2> 🌍 Going Viral </h2> <p>Once live, people started sharing it on Reddit, TikTok, and Twitter/X. Brat fans loved it. Aesthetic + Speed = 🚀</p> <h2> 🔗 Try It Out </h2> <p>👉 <a href="https://quickbrat.com" rel="noopener noreferrer">https://quickbrat.com</a></p> <p>Feel free to remix it, suggest features, or even fork the idea. The Brat energy is for everyone.</p> tailwindcss php webdev projectshowcase