Thanks to everyone who has shown this series love, I obtained the domain ModernCSS.dev
Right now, it's essentially using DEV as a headless CMS to feed posts directly. But I'd love to expand it to additional resources, so stay tuned!
It was fun to design, really fun to learn 11ty, and includes stuff I've talked about in this series plus a few things to hopefully surprise and delight.
Tech & Stats
- 11ty - a static site generator capable of using Node modules and mixing template languages which was perfect for this type of project. It's also wickedly speedy!
- html-css-jumpstart - I expanded the minimal Sass/HTML starter that I recently released
- Netlify - hosting
- IFTTT - watches RSS feed to ping Netlify webhook to republish site when new DEV post published
- one single teensy JS function for a bit of delight on the main page
- 3.4kb CSS, Gzipped
- Speed index - 0.702s
- Lighthouse score - just shy of perfect 💯due to Google Web fonts which I'm going to resolve soon!
Feedback welcome!
Visit ModernCSS.dev >
If you find an issue, you can file it on Github.
If you have suggestions for future content or any other comments, drop 'em below!
Top comments (19)
The site looks great!
Thank you! 😊
Just found your site through CSS trick. It is an instant bookmark. Amazing.
Aww, thanks so much!
Wow. Great work!! 💯 That speed index is fire 🔥
Also, really liked the rainbow border! 🤩
Awww, thanks!! 💫
Wow, these rainbow blocks look amazing! Great idea and execution. Makes me wanna read the series now :D
Thanks so much, I hope you enjoy! New episode dropping shortly 😉
Wow the site looks brilliant.
Thank you so much! 💫
I've bookmarked to refer to later. Currently checking out Inspector to see all the pretty gradients done so well! Lovely site!
Thank you so much!! 💫
🙌🏻🤣
I could learn a lot of web development from your examples - the site mentioned here being one of them! Great work.
Thank you, Eric! I'm so glad to hear you find this useful! 🌟
Site looks great, can't wait to share this with my whole dev team! Keep it up :D:D:D
Oh wow, thanks! ✨
great job
nice work b