❄️ [GAME] Snow Quotes! ❄️
RolandJLevy (1052)

Fill the night sky with gently falling ❄️ SNOWFLAKES ❄️ each of which reveals an inspirational QUOTE when you hover over it. Happy holidays everyone! 🎁

https://github.com/rolandjlevy/snow-quotes/blob/master/public/images/snow-flakes-demo.gif?raw=true

Links 🔗

Features 💡

  • Customise your Snow Quotes with various letters and numbers, select the amount and colour of snowflakes
  • Click on the 'SEE YOUR SNOW QUOTES' button to see the result on the next page
  • Hover your mouse over each snowflake to reveal an inspirational quote
  • Click on a snowflake to copy the quote text
  • Share this app with your friends by clicking on the share buttons 👍

How it works ⚙️

  • Built from scratch with Node, Express and pug template engine on the back end
  • The front end uses vanilla JavaScript - no frameworks or libraries like React or Vue
  • Completely responsive and mobile friendly
  • Inspired by this Pug and CSS Workshop by one of my favourite developers 🌟 @Jhey🌟
  • Using the node-url-shortener node package to shorten the URL for sharing
  • The quotes are fetched from an API shown in this freecodecamp.org article
  • The snowflake symbols are from the Mandala font using the @font-face rule
  • Form validation restricts keys to 0-9, a-z and A-Z
You are viewing a single comment. View All
fuzzyastrocat (1513)

This is really nice!

However, one suggestion: often I get snowflakes that look, well, not really like snowflakes. Like this:

I'd suggest trying something like I've done here for more consistent snowflakes.

RolandJLevy (1052)

Hey @fuzzyastrocat, thanks for your observation. I agree and I have written a transform function that replaces numbers or letters that render as unrealistic looking snowflake shapes with more realistic ones. For example, these characters now get replaced by different characters: 1234790ESHN.

Thanks for sharing your Flurry project with me. It's really great - nice job! I really like the coding train guy and his fun approach. He's a good teacher. I hope you have a great holiday break :)

fuzzyastrocat (1513)

@RolandJLevy Ah ok, so that's what the letters are for.

Thank you! I do too — while I find him over-enthusiastic sometimes, he does some really great stuff. (And same to you regarding the holidays!)