🗓️ Thursday Flow | May 15, 2025

💻 Progress Report:
• #Beyond365DaysOfCode Day 137
• #100DaysOfCode Day 137
• #freeCodeCamp #CodePen #TheOdinProject #CSSInspiration
• #DevJourney #FrontendToBackend

📚 Daily Reading:
✅ 1 freeCodeCamp article
✅ 1 Daily.dev article

🛠️ Dev Tools Activated:
📌 Trello board – updated
⚙️ Installed NeoVim on WSL
🔄 Refactored BEM in TOP recipe project
🔥 Codecademy Flask track – Jinja2 & Forms (42% done)
🎥 Watched: How to Build Flask Apps Locally

Just some happy lil toast for this weeks #CodePenChallenge

CSS animations and a bit of JavaScript for state control. I got to learn about document.getAnimations() which was cool 😊

CodePen: https://codepen.io/HejChristian/pen/vEEPbpr

#CSS #CodePen

Battlefield 2042 (Loading...) #codepen
https://codepen.io/iamdtms/pen/KwwEaam

@lavxnews attr() data-color #codepen demo
https://codepen.io/iamdtms/pen/YPzwYoL

🗓️ Thursday Progress — May 8, 2025

🔧 Sharpening skills & stacking wins:
🔸 #Beyond365DaysOfCode Day 130
🔸 #100DaysOfCode Day 130
🔸 #freeCodeCamp | #CodePen | #TheOdinProject
🔸 #TechGrowth | #SkillSharpening

📖 Daily Practice:
✅ Read: 1 freeCodeCamp article
✅ Read: 1 Daily.dev article
🗂️ Trello board: ✅ Organized and on track

🎯 Coding Focus:
🎨 Adjusted CSS styling on freeCodeCamp
✅ Finished the Learn HTML course on Codecademy

薬の接客内容を簡単に報告！Webアプリ作成にチャレンジ！
https://qiita.com/mioppppe/items/b6d88885430ec2eda904?utm_campaign=popular_items&utm_medium=feed&utm_source=popular_items

#qiita #GoogleAppsScript #初心者 #codepen #Googleスプレッドシート #ChatGPT

Progress Report | May 1, 2025 📈

🔧 #Beyond365DaysOfCode Day 123
💻 #100DaysOfCode Day 123
🚀 #freeCodeCamp - Full Stack Developer Curriculum: Continuing work on the Confidential Email Page 🔐
📝 #TheOdinProject - Created README.md for the odin-recipes repo 🍴
🔨 #CodePen - Fixed the 403 error issue 🎯

📚 Daily Reading:

✅ freeCodeCamp News: Read 1 article

✅ Daily.dev: Read 1 article

🗂️ Trello: Updated the board for streamlined progress 💼

This weeks CodePen challenge got me testing the very new, very experimental, very cool CSS Carousel spec.

Horizontal and Vertical scrolling, ::scroll-marker, position-anchor, and more.

Demo only works on Chrome 135+

100% CSS 🤯

CodePen: https://codepen.io/HejChristian/pen/azzWVWL
Blog Post and more demos from Adam Argyle: https://developer.chrome.com/blog/carousels-with-css

#CodePen #CodePenChallenge #CSS

Mario #CSS #codepen
https://codepen.io/iamdtms/pen/YPPwdQR

Having some fun reskining my codepen profile
https://codepen.io/villepreux

Too bad that pens' preview generation doesn't play well with templates & pen includes, and that color-scheme preference does not apply on previews. Need to investigate further.

Also didn't find a way to apply inline svg filters. Assuming that might be a known limitation thought.

#codepen #fun #webdev #css

This weeks CodePen challenge got me learning about glowing fungi, jellyfish, and fireflies.

Amazingly CSS can animate along a SVG path and I am so happy to have learnt about that. 🥳 I thought for sure I would need JS for the fireflies.

CodePen: https://codepen.io/HejChristian/full/VYYwqza

#CodePen #CodePenChallenge #CSS #SVG

I once made this #codepen called “Super Simple Parallax Fullscreen Hero Header with Object-Fit.” Just saw it has 2,000+ views. Is that a lot? No clue—probably not. But it might’ve helped some people.

https://codepen.io/SaschaFromMars/full/oNJMdRM

#frontenddevelopment #parallaxeffect #objectfit

Took part in a #CodePenChallenge this weekend 😊

Mixed together some SVG stroke animation, 'mix-blend-mode', and inspiration from some of the board games I've been playing recently.

CodePen: https://codepen.io/HejChristian/full/RNwXexO

#CSS #CodePen

Over the weekend I got an SVG path to animate on scroll, using Anime.js.

Today I achieved the same effect with just CSS ✨

The scroll version only works in Chromium-based browsers, but others can see it on hover.

I also dabbled with a WAAPI Version, which works the same via JS.

CodePen: https://codepen.io/HejChristian/pen/GgRaEBx

#CSS #SVG #CodePen

"0 col" #css #codepen
https://codepen.io/iamdtms/full/emYooLG

If anyone wants to make a Half-square Hilbert I made a toy to play with patterns. (fixed a bug from the first go)

I need fabric - so I plan to start maybe later this week.

https://codepen.io/fractalkitty/live/pvoBwxv/edc44d4417167d59d8b2c1d9ad574109

#codepen #p5js #quilting #hilbertCurve #fiberArt #quilts #mathart

Gave Anime.js a spin this weekend - just something simple for my first experiment.

It handled SVG stroke animation really well! and it was good fun to work with. Documentation was great 👌

This experiment also got me learning more about SVG filters 🥳

CodePen: https://codepen.io/HejChristian/full/LEYvbWP

#SVG #AnimeJS #CodePen #SVGFilter

add something? #codepen
https://codepen.io/iamdtms/pen/zYjrZrX

FYI: TOC DIY #codepen
https://codepen.io/iamdtms/pen/dydmjme

I'm always forgetting the CSS mix-blend-modes, so I put together a little page to help me remember 😊

CodePen: https://codepen.io/HejChristian/full/KwKJdNd/a254d2ff42ba92fb4782207e920af439

#CSS #CodePen