"Every chance at coding is a chance at learning."
I wrote in my blogpost Learn to Code by Building Messy Little Things about the benefit of building mini projects. I learn and enjoy coding so much more when building small projects. I thought it would be important to showcase some of these and share with you what I've learned and continue to learn.
These mini projects span across my time learning to become a web developer and definitely show my growth. Some remain the same as they were when I first created them, while some are updated. I hope to definitely revisit a few of these and maybe even expand them into full websites/apps/interactive pieces.
Let this be your year to shine! A practice exercise in CSS art and animation.
I was interested in both CSS art and animation so in early January I spent a little time making this little sun. I needed a little inspiration for the new year, especially as I embarked on this new journey in tech. A few days later I landed my first role with MotherCoders!
Sailor Moon Color ThemesCodePen
Disney Tsum TsumsCodePen
What is your stack? A practice in CSS illustration with Pug.js for HTML.
I'm always inspired by the CSS art found on CodePen, so for fun I decided to give it a try creating Disney tsum tsums stacked on top of one another. I mostly used the before and after pseudo-elements. This was not only inspired by the CodePen community but also the Twitter community, which I had just joined at that time.
Inspiration can pop out of nowhere. A Skillcrush exercise in HTML & CSS with a parallax effect.
This was one of my first mini projects when learning to code with Skillcrush. Our original project required us to code a page based off of the Holstee Manifesto to look like this design provided by Skillcrush. But as they encouraged us to use our creative freedoms, I decided to take on the challenge of learning how to execute the parallax effect. This willingness to challenge myself and be free to learn new techniques was an attitude I carried and continue to carry throughout my learning journey.
Dark-Mode ButtonLive • Code
Rogue PickingsLive • Code
Check out full-sized projects, source code, experiments, writing, and more!