DEV Community

skllzrmy
skllzrmy

Posted on

2 2 1 2 2

I Built a Shadcn Slot Machine for Hacktoberfest—and I’m Just Getting Started

I Built a Shadcn Slot Machine for Hacktoberfest—and I’m Just Getting Started

Hacktoberfest 2024 is still in full swing, but I’ve already hit my four pull requests. All of them went into shadcn-extensions, a project I started to organize the random UI components I’ve been building over the past few months. It’s a lightweight repo where I’m collecting user-submitted components for shadcn UI—nothing too wild, just something practical that I could actually use and share with others.

The idea came from realizing I had all these one-off UIs generated using v0.dev, and they were just sitting in different projects, scattered. So I figured, why not pull them all into a single repo and make something of it? It’s been fun to see the project come together, and Hacktoberfest gave me the perfect excuse to kick it off.

The One-File Social Media UI

One of the highlights for me was building an entire social media interface—all in one file. I wanted to see how far I could push shadcn components and Tailwind within a single component file. The process wasn’t super difficult, just a little tricky to keep things organized with so many interactions happening in the same place. It came together without too many headaches, though, and I ended up with a pretty clean, functional UI.

Slot Machine Fun

Halfway through the UI, I decided to take a break and do something a little more playful. That’s when I threw in a slot machine UI. It was one of those spur-of-the-moment ideas that ended up being a lot of fun to build. The animations are slick, the reels spin perfectly, and it adds a bit of unexpected flair to the repo. Sometimes, it's those random ideas that make a project memorable, and this was definitely one of them.

What’s Next?

Hacktoberfest isn’t over yet, and I’m still looking at where I can contribute next. I’ve been wanting to give something back to Oh My Zsh, a tool I’ve relied on for ages. I’m also eyeing the Next SEO package (this one), since it’s been a huge help on several projects and deserves some community love.

This has been a great way to get my wheels turning, and even though my four PRs are in, I’m definitely not slowing down. There's a lot more to explore, and I’m ready to keep contributing.

Sentry image

Hands-on debugging session: instrument, monitor, and fix

Join Lazar for a hands-on session where you’ll build it, break it, debug it, and fix it. You’ll set up Sentry, track errors, use Session Replay and Tracing, and leverage some good ol’ AI to find and fix issues fast.

RSVP here →

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay