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

What I Built

I built a glass UI for the Glam Up my Markup frontend challenge.

I used a very futuristic theme to move away from the traditional camp theme that has already been used by so many other websites.

It's a resizable site, which makes it usable for both desktop and mobile users.

Demo

A better preview of the site is available here
All the source code is available on Github.

Journey

I started with just styling the form, but I realized that was pretty normal.
That's why I decided to add a database feature, what made me knock with my head on my desk.

I learned tons of new javascript skills by making my own pie charts, because animating on the canvas isn't simple.

After that, I made some cool confetti and popup scripts to make it look better and spendt 2 hours on animating (yes, 2 hours, don't laugh).

Credits

• Stackoverflow for lighten and darken hex colors
• ChartsJS for inspiring me with the pie chart.
• Deta for hosting the backend
• Everything else (confetti, charts, popups and database) is made by myself!

That's all, I hope you like it!