Forem: Eduard Constantin

Hacktoberfest 2025

Eduard Constantin — Thu, 09 Oct 2025 17:39:15 +0000

Another year, another Hacktoberfest event, and here I am again, tossing my repos into the wild like candy at a parade. Except instead of sugar highs, you’ll get merge conflicts, questionable variable names, and the eternal glory of open source contribution.

🪙 Crypto-Rankings
React app that shows the top three cryptocurrencies. Because who doesn’t want to know which digital coin is mooning while your wallet is crying? Built with React, Chart.js, and a sprinkle of bootstrap magic.

Contribution idea: Add more charts, improve UI, or make it look less like I coded it at 2 AM after too much coffee.

💸 Top-three-crypto
Yes, it’s another crypto project. No, I don’t have a problem. This one also shows the top three cryptos, but with Docker support and some extra flair.

Contribution idea: Help me make it cooler than its sibling. Or just add a button that says “Buy Dogecoin” for the memes.

🧘 Regenerator
A website to regenerate your body and soul. Think of it as a digital spa day, minus the cucumber water.

Contribution idea: Add new relaxation techniques, improve the UI, or sneak in an Easter egg that Rickrolls people. (I won’t stop you.)

📖 storybook-gpt
Turns React components into Storybook stories using AI. Basically, it’s like having a robot intern who doesn’t complain about unpaid overtime.

Contribution idea: Improve prompts, add new features, or teach it to generate stories that don’t look like they were written by a caffeinated squirrel.

☁️ azure-cloud-exams
A quiz app for Azure certifications. Because nothing says “fun” like studying cloud services until your brain feels like a VM running out of memory.

Contribution idea: Add more questions, improve the UI, or create a “panic mode” for when the exam is tomorrow and you’ve studied nothing.

🧞 storybook-genie
A CLI tool that generates Storybook stories from React components. Rub the lamp, type a command, and boom—storybook magic.

Contribution idea: Add new templates, improve CLI UX, or make it grant three wishes. (Okay, maybe just the first two.)

Why Should You Contribute?
You get Hacktoberfest credit and badges.
You get to say “I fixed this repo” in your portfolio.
You get my eternal gratitude (and maybe a sarcastic comment in your PR).
So fork it, clone it, break it, fix it, PR it.

🎉 Hacktoberfest 2024

Eduard Constantin — Wed, 02 Oct 2024 16:07:39 +0000

Hey there, keyboard warriors! Ready to dive into some epic GitHub repos this Hacktoberfest? Grab your favorite snacks and let’s explore some interesting projects that are waiting for your contributions.

Storybook Genie 🧞‍♂️

Ever wished you had a magical assistant to help you create your Storybook stories? Well, wish granted! Storybook Genie is a command line interface tool that can convert files containing React components into Storybook stories. Whether you’re a newbie or a seasoned pro, this repo has something for everyone. So, rub that lamp and start coding!
https://github.com/eduardconstantin/storybook-genie

Azure Cloud Exams (ACE) ☁️

Feeling like a cloud ninja? Ready to slice through those Azure certifications like a pro? Azure Cloud Exams is your dojo. Built with Next.js, TypeScript, CosmosDB, GraphQL, and TailwindCSS, this web application quizzes you on Azure cloud exams. The questions are coming from Ditectrev repos.

https://github.com/eduardconstantin/azure-cloud-exams

Storybook GPT 🤖

Imagine combining the power of Storybook with the intelligence of GPT. Sounds like a match made in tech heaven, right? Storybook GPT is a web application that converts React components into Storybook stories using the OpenAI API. Built with NextJS 13, TypeScript, and TailwindCSS. With Storybook GPT, you can easily create and share interactive UI components for your projects.

https://github.com/eduardconstantin/storybook-gpt

Why Contribute?
Because it’s Hacktoberfest, baby! 🌟 It’s the perfect time to give back to the open-source community, learn new skills, and maybe even earn some cool swag. Plus, you’ll get to brag about your contributions to your friends, family, and that one guy who always thinks he’s better than you.

How to Get Started
Register for Hacktoberfest here.
Fork the repos and start making those sweet, sweet pull requests.
Celebrate your contributions with your favorite treat (or two).

So, what are you waiting for? Get out there and make some code magic happen! And remember, with great code comes great responsibility… or something like that. 🕶️

Glam Up My Markup: Earth Day Celebration Dashboard

Eduard Constantin — Thu, 25 Apr 2024 19:55:00 +0000

This is a submission for Frontend Challenge v24.04.17, Glam Up My Markup: Earth Day Celebration Landing Page

What I Built

For this challenge I’ve crafted a dashboard that’s as vibrant and dynamic as Earth Day itself.🌿
Imagine a UI framed with the precision of a Bento box, where each element sits in harmony with the others. The cards are the real showstoppers here, with a frosted glass aesthetic that’s as cool as the other side of the pillow. They’re like little windows fogged up by Mother Nature’s breath.

Demo

I recommend watching the demo here.

Journey

So, how did this dashboard come to life? Well, it all started with a memory—a blast from the past. I was about to settle for a one page layout, you know, the usual stuff. But then, like a lightning bolt of inspiration, I remembered my old gig. A few years ago, I was the dashboard whisperer, crafting production dashboards with the precision of a watchmaker. And guess what? I used the Bento grid structure build them.

That’s right, the Bento grid—a layout so organized, it could make Marie Kondo shed a tear of joy. With the structure in place, I knew I had to make it look unique. None of that cookie-cutter dashboard business. (Remember my Xbox dashboard on Dribbble? Yeah, nothing like that.)

While looking for inspiration I stumbled upon an AI-generated image of Earth from space. Fate? Destiny? Call it what you will, but that image became the backdrop for my cards. Each card got a blurred background, but I didn’t settle for just any blur. Oh no, I went full mad scientist. Three masks — dotted patterns, corner cuts and iconic symbols — came together to form a frosted background that’s truly unique.

And the background? I couldn't decide for just one pretty picture, so I added more. Crafted with AI and a sprinkle of internet stardust, it moves in mysterious ways, just like the tides of the ocean — except it’s your mouse calling the shots.

So there you have it. A dashboard that’s not just a feast for the eyes but a tribute to our beautiful planet. Dive in, explore and let’s make every day Earth Day.

MIT License

Certifiably Thrifty: How I Snagged GitHub’s Foundation Certification for Free!

Eduard Constantin — Mon, 22 Apr 2024 18:49:52 +0000

Alright, buckle up, 'cause today I’m sharing a secret so exciting, it'll make your fingers dance across the keyboard.
So, I assume everyone knows GitHub, right? That place where coders do… code thingies? As you might be aware (or not), they now offer four juicy certifications:

Earlier this month, yours truly decided to level up and snag the Foundation Certification because GitHub was throwing a wicked 50% discount.

After I finished the registration process for the certification, I ended up at the checkout page where I stumbled upon a pre-filled input field with a coupon code chillin' inside like it owned the place. Naturally, I'm thinking: "Sweet! This must be the golden key to that sweet 50% discount". So, I hit apply and 💥BOOM!💥 The checkout price nosedives to ZERO.

I know, I know, it sounds too good to be true, but it worked for me! Snagged that cert without droppin' a dime.

Now, here's the kicker — I'm not sure if this is a limited-time glitch or a slick Easter egg from the generous crew over at GitHub. Either way, I just wanted to spill the beans while the gettin's good.

If you've been eyeing this certification, now is your chance to grab it without emptying your pockets, just head over to the GitHub Certification page, complete the registration process and at the checkout page keep those peepers peeled for that coupon code.

Glam Up My Markup: Camp Activities

Eduard Constantin — Sun, 31 Mar 2024 15:20:15 +0000

This is a submission for DEV Challenge v24.03.20, Glam Up My Markup: Camp Activities

What I Built

I built a web form that has a Camp Activities theme, aiming to enhance the markup and styling for a visually appealing experience. Here are the key features:

Background Image: I incorporated a custom background image that seamlessly blends with the camp theme. The AI-generated background adds an adventurous vibe to the page, setting the tone for camp-related content.
Custom Dropdown: To improve user interaction, I designed a custom dropdown menu. The dropdown enhances both functionality and aesthetics.
Font Style: I found that Bubblegum Sans perfectly aligns with the camp atmosphere. Its bouncy, cheerful style adds a sense of adventure and excitement to the form content.

Demo

Journey

During this challenge, I delved into CSS and JS techniques and learned how to:

Blend Backgrounds: The background image was carefully chosen to evoke the spirit of camping.
Style Custom Dropdowns: Customizing the dropdown menu involved tweaking colors, fonts and animations using both JS and CSS.
Validate Form Inputs: I also used JS to validate user's inputs, ensuring accurate and complete form submissions.

MIT License

Azure Cloud Exams: A Community-Driven Open Source Project

Eduard Constantin — Wed, 28 Feb 2024 17:08:32 +0000

I'm excited to announce the launch of my new web application designed to help you ace your Azure exams!
This comprehensive platform offers a wide range of interactive quizzes covering various Azure certifications, making it the perfect tool to test your knowledge and identify areas for improvement.

Sharpen Your Azure Expertise

Whether you're a seasoned Azure professional or just starting your cloud journey, this application provides a valuable resource to solidify your understanding of Azure services and functionalities.

Key Features:

Multiple-choice questions: Test your understanding of core concepts and essential details.
Immediate feedback: Gain insights into your performance and identify areas requiring further study.
Track your progress: Monitor your learning journey and measure your improvement over time.
User-friendly interface: Navigate seamlessly through the quizzes and access valuable resources effortlessly.

Test your Azure skills here: https://nice-sky-0509a9903.2.azurestaticapps.net

Open Source Collaboration

This project is open-source and I welcome contributions from the community!
If you're passionate about Azure and want to help expand the project or fix bugs, feel free to fork the repository and submit your pull requests.

Let's make this platform an exceptional tool for the Azure community!

My Hacktoberfest 2023 Experience

Eduard Constantin — Sun, 15 Oct 2023 08:57:40 +0000

Intro

I’m excited to share with you my experience of participating in this year's Hacktoberfest. In this post, I will talk about the highs and lows, the growth, and the benefits of contributing to open source projects during this month.

Highs and Lows

One of the biggest highs for me was discovering and contributing to two amazing repositories: illa-builder and trello-clone.

ILLA is a robust open source low-code platform for developers to build internal tools. By using ILLA's library of Components and Actions, developers can save massive amounts of time on building tools. You can use natural language to define your agent’s logic, personality, and behavior, and then deploy it as a web app, a chatbot, or a voice assistant. I was fascinated by this idea and decided to try it out for myself. I created a personalized recipe generator based on user’s culinary preferences using illa ai builder.(Github PR) I also created an app on this platform, a random rgba color generator.(Github PR) It was a fun and rewarding experience to see my AI agent come to life and suggest delicious dishes for me.

trello-clone is a web app that replicates the functionality of Trello, a popular project management tool. It uses Next.js 13, React, Tailwind CSS and Prisma. I learned a lot about these technologies while working on this project. I helped fix some bugs such as adding adding focus on inputs and fixing the WYSIWYG editor text overflow.(Github PR1, Github PR2)

Of course, not everything was smooth sailing. I also faced some challenges and difficulties during Hacktoberfest 2023. Some of them were:

Finding suitable projects to contribute to. There are so many open source projects out there, but not all of them are beginner-friendly or well-documented. I had to do some research and filtering to find the ones that matched my interests and skills.
Understanding the codebase and the workflow of the projects. Each project has its own structure, style, and conventions. It took me some time to get familiar with them and follow the guidelines. I also had to learn how to use Git and GitHub effectively to fork, clone, branch, commit, push, pull, and merge.
Dealing with errors and bugs. Sometimes, things didn’t work as expected or broke down completely. I had to debug and test my code thoroughly before submitting a pull request. I also had to deal with merge conflicts and code reviews.

However, I didn’t give up or get discouraged by these problems. Instead, I used them as opportunities to learn and grow. I adapted by:

Asking for help from the maintainers or other contributors when I was stuck or confused. They were very friendly and supportive and gave me useful feedback and guidance.
Reading the documentation, tutorials, articles, blogs, videos, podcasts, etc. related to the projects or technologies I was working on. They helped me understand the concepts and best practices better.
Practicing and experimenting with different solutions until I found the one that worked best for me.

Growth

I can confidently say that my skillset improved significantly during Hacktoberfest 2023. After working on these projects, I learned:

How to use illa-builder to create AI agents and apps without coding
How to use Next.js 13 to create fast and scalable web apps
How to use Prisma to store and manage data
How to use Husky to format all the files from each commit automatically

I also learned some soft skills that are essential for any developer:

How to communicate effectively with other developers
How to better collaborate on open source projects
How to write clear and concise code comments and documentation
How to write good bug reports and pull requests

Benefits

Participating in Hacktoberfest 2023 was not only a learning experience but also a rewarding one. Some of the benefits that I gained from it were:

Contributing to open source projects that are useful and meaningful for me and others
Connecting with other developers from different backgrounds and levels of expertise
Earning some cool swag from Hacktoberfest organizers and sponsors
Having fun and enjoying the process of creating and sharing

Azure Fundamentals

Eduard Constantin — Sat, 07 Oct 2023 09:38:06 +0000

Intro

👋 Hey there! This year, I'm excited to invite you to contribute to my Hacktoberfest 2023 GitHub repositories. It's an opportunity for us to collaborate, learn, and make a meaningful impact in the open-source community.
🌐 You can find my GitHub profile here, where I maintain a collection of projects related to web development and, of course, some exciting Hacktoberfest initiatives.

About the Project

Azure Fundamentals is a project that I created to learn cloud computing with Azure and it is one of the projects that is heavily under development with a lot of help from the community.
The main goal of this project is to help others prepare for the AZ-900: Microsoft Azure Fundamentals certification exam.
You can also check out the live demo of the web application here: Azure Fundamentals Demo.

👩‍💻 Contributing

Contributions from the community are the heartbeat of this project. I've set up a streamlined process to ensure that your ideas, code improvements, and suggestions are welcomed with open arms:

Fork and Clone: Begin by forking the repository and cloning it to your local environment.
Create a Branch: For each feature, bug fix, or enhancement you want to propose, create a dedicated branch from the dev branch. This keeps things organized.
Code Away: Make your changes, write new features, or fix bugs. Ensure that your code adheres to our coding standards.
Pull Request: Once you're satisfied with your changes, submit a pull request.
Code Review: Pull requests go through a thorough code review process to ensure that they align with project goals and quality standards.
Merge: After a successful review, your pull request will be merged into the dev branch and soon into the main branch.

Congratulations, your contribution is now part of Azure Fundamentals!

Hacktoberfest 2023 Pledge: My Journey, Goals and Projects

Eduard Constantin — Sun, 01 Oct 2023 18:44:29 +0000

Intro

Hey there, DEV community! 👋 I'm Eduard, a passionate web application developer hailing from Romania, with 5 years of experience in crafting web solutions using technologies like React, Next.js and GraphQL. While I can talk tech and web dev endlessly, I've also got a creative side — I love to sketch and immerse myself in video games, from online shooters like Counter-Strike 2 to the latest releases in the gaming world.
As someone deeply ingrained in the world of web development, I've always believed in the power of open source and the collaborative spirit of the developer community. Hacktoberfest, to me, is an opportunity to give back, learn from others, and be part of something bigger.

Background

I first heard about this amazing event last year through the buzzing tech community. The idea of contributing to open source projects and collaborating with developers from all corners of the world intrigued me. It was a chance to not only enhance my skills but also give back to the community that had nurtured my passion for coding.
So, here I am, motivated and excited to dive into Hacktoberfest for the second year. Whether you're a seasoned coder or just starting your coding journey like I once did, remember that Hacktoberfest welcomes everyone. It's a celebration of open source, creativity, and the magic that happens when developers unite for a common cause.

Pledge

Collaboration and Learning
I pledge to actively seek out opportunities to collaborate with fellow developers from diverse backgrounds and skill levels. Whether it's fixing a bug, improving documentation, or adding a new feature, I'm here to learn from others and share my knowledge.

Giving Back to the Community
One of my primary motivations for participating in Hacktoberfest is to give back to the community that has nurtured my growth as a developer. I'm committed to making meaningful contributions to open source projects that benefit others. It's a way of saying "thank you" to the countless developers who have shared their knowledge and code with me.

Exploring New Territories
Hacktoberfest is also an opportunity to step out of my comfort zone. I'm open to exploring projects and technologies I haven't worked with before. Whether it's a new programming language, framework, or domain, I'm excited to broaden my skills and embrace the adventure.

Welcoming Contributions to My Projects
In addition to contributing to other open source projects, I'm eager to play the role of a maintainer during Hacktoberfest. I have a new and exciting project in mind, and I'm inviting fellow developers to join me in shaping it. Whether you're an experienced developer or just starting out, I'm committed to providing a welcoming and inclusive environment for contributors.
I also have a few existing projects that could use some love and enhancements. I'm inviting developers to collaborate with me on these projects, whether it's fixing bugs, optimizing performance, or adding new features.

This week I will continue posting new articles about these projects in order to keep everyone up to date.

Counter-Strike 2 Button

Eduard Constantin — Mon, 11 Sep 2023 17:12:06 +0000

Impatiently waiting for what felt like an eternity, I finally gained access to Counter-Strike 2 beta.🎮

The game's new UI is nothing short of spectacular, but one element in particular caught my eye — the matchmaking button, especially the the background animation

Determined to take on a creative challenge, I set myself a goal for this month - to recreate this button for the web with CSS and animate it with framer motion.

Creating the animated squares was a breeze, but it was the topographic map did gave me some headaches because I didn't want to use just a simple image.

After some relentless tinkering and experimentation I managed to generate the map dynamically using an SVG filter, therefore offering endless variations for this button. As you can see bellow, there are more things implemented, like changing the color (it looks mesmerizing in blue), the width and the label.

The code for this project is available on GitHub: https://github.com/eduardconstantin/react-motion-components

And I also set up a story playground here

Doticons - A collection of minimal dot icons

Eduard Constantin — Tue, 18 Jul 2023 15:37:18 +0000

Doticons is a comprehensive and carefully curated collection of SVG dot icons. They are based on a 16x16 and 32x32 dot matrix, which gives them a pixelated and retro look. They are also scalable and customizable, so you can adjust their size and color.

🎨 What's Inside?

Doticons are free to use and modify for any personal or commercial project. You can download them from my GitHub repository: https://github.com/eduardconstantin/doticons

You can open a request for adding new icons, improving existing ones, or suggesting new categories or join the discussion tab if you have any feedback or questions.

I am also looking for contributors to help me improve this project, so open a PR or an issue, I appreciate any feedback, suggestion or improvement.

Storybook Genie

Eduard Constantin — Mon, 22 May 2023 18:05:12 +0000

What I built

A command-line interface tool that can generate storybook stories from react components

Category Submission:

Wacky Wildcards

App Link

https://www.npmjs.com/package/storybook-genie

Screenshots

Description

Storybook Genie is a command-line interface tool that can be used to convert files that contain React components into Storybook stories.

Link to Source Code

https://github.com/eduardconstantin/storybook-genie

Permissive License

MIT

Background (What made you decide to build this particular app? What inspired you?)

I also created a web app that does the same thing with one small inconvenient, the user has to copy-paste the components in and from the app. That's how Storybook Genie was born, I wanted to make a tool for the editor that can simplify the process.

How I built it (How did you utilize GitHub Actions or GitHub Codespaces? Did you learn something new along the way? Pick up a new skill?)

I used Github Codespaces to build this tool, which was really easy to work with. I learned how to publish a npm package on npmjs.com and on Github. and I learned how to make command-line tools in nodeJS.

Forem: Eduard Constantin

Hacktoberfest 2025

🎉 Hacktoberfest 2024

Glam Up My Markup: Earth Day Celebration Dashboard

What I Built

Demo

Journey

Certifiably Thrifty: How I Snagged GitHub’s Foundation Certification for Free!

Glam Up My Markup: Camp Activities

What I Built

Demo

Journey

Azure Cloud Exams: A Community-Driven Open Source Project

Sharpen Your Azure Expertise

Open Source Collaboration

My Hacktoberfest 2023 Experience

Intro

Highs and Lows

Growth

Benefits

Azure Fundamentals

Intro

About the Project

👩‍💻 Contributing

Hacktoberfest 2023 Pledge: My Journey, Goals and Projects

Intro

Background

Pledge

Counter-Strike 2 Button

Doticons - A collection of minimal dot icons

🎨 What's Inside?

Storybook Genie

What I built

Category Submission:

App Link

Screenshots

Description

Link to Source Code

Permissive License

Background (What made you decide to build this particular app? What inspired you?)

How I built it (How did you utilize GitHub Actions or GitHub Codespaces? Did you learn something new along the way? Pick up a new skill?)

Additional Resources/Info