🐴 Frontend Horse

Learn techniques from the best creative frontend developers.
Discord: by @TrostCodes

[🐴 Frontend Horse @FrontendHorse]

The final lineup for the Holiday Snowtacular fundraiser! ☃️

@cassidoo
@wesbos
@techgirl1908
@cassiecodes
@jlengstorf
@KevinJPowell
@Ace_KYD
@devdevcharlie
@Mappletons
@stolinski
@chriscoyier
@whitep4nth3r

Register now, so you don't miss it!
https://t.co/KVA2GsnOsc

[🐴 Frontend Horse @FrontendHorse]

This week's issue is sponsored by @polypane, The browser that puts you in the saddle!

Polypane is the browser for web developers. Loved across the prairie, it helps you build responsive, accessible and all-round good websites. Polypane has about as many features as you can fit horses between the earth and the moon (160 million, if you care to know) and each is designed to make your life as a dev easier.

Quit horsing around in a normal browser, and switch to one that "feels like devtools with cheats enabled". Try it out for free and see for yourself. Use code FRONTENDHORSE20 to get 20% off any plan.

https://t.co/TL70F1EoIC

[🐴 Frontend Horse @FrontendHorse]

This week's issue of the Frontend Horse newsletter is out!
We've got some great articles, inspiration, CodePens and more!

https://t.co/Y6MiXk5Sie

[Rich Harris @Rich_Harris]

come hang out in my flat with me and @trostcodes

had a lot of fun recording this

[🐴 Frontend Horse @FrontendHorse]

The greatest prank ever pulled on developers started in 1991.

Since its creation, Vim has inspired other hoaxes like "Birds aren't Real", "Flat Earth", and "Agile Software Development."

[🐴 Frontend Horse @FrontendHorse]

Check out the article here where I break down Fabio's awesome CodePen:
https://t.co/HB4UZ0LPVL

[🐴 Frontend Horse @FrontendHorse]

I love this gooey effect!

The fact that it's only a couple of SVG filters combined makes it that much cooler.

[🐴 Frontend Horse @FrontendHorse]

Check the full list with more details and links here:
https://t.co/AZ9uXhlUBb

[🐴 Frontend Horse @FrontendHorse]

Which JavaScript projects are growing the fastest?

One way to tell is by checking the number of GitHub stars gained. It's not a perfect metric, but it helps to see where the public interest is. Here's the top 10 from 2023.

[🐴 Frontend Horse @FrontendHorse]

@sulamitaivanov @tactusmarketing Ah I'd love to see what spin you put on it! I'm sure you'll come up with something awesome.

[🐴 Frontend Horse @FrontendHorse]

I love it when you can get an eye-catching effect with just one line of CSS!

That's exactly what @tactusmarketing achieved with this great hero effect. With just a video, some text, and CSS’s mix-blend-mode, we can recreate the effect for our own stylish hero!

[🐴 Frontend Horse @FrontendHorse]

@lwkchan This is the correct response! I especially love doing overlay with a paper texture behind. Makes it look like actual ink on paper.

[🐴 Frontend Horse @FrontendHorse]

@kiru_io @tactusmarketing Ah I totally agree! A seamless loop would be SO satisfying!

[🐴 Frontend Horse @FrontendHorse]

@ashish1732 @shadeed9 Sure thing! I asked the same thing in the Frontend Horse Discord before making this video and @kilianvalkhof pointed me towards that blog post, so you're in very good company 😉

[🐴 Frontend Horse @FrontendHorse]

Sometimes you want to show your little scroll animation on phones but the address bar says no.

That's where dynamic viewport units come in handy.

[🐴 Frontend Horse @FrontendHorse]

@ashish1732 Great question! I asked the same.
For things like responsive typography, you wouldn't want the size jumping back and forth as you scrolled.

@shadeed9 Shows a great example at the bottom of his post - https://t.co/YgsWusJsr4

[Steve Gardner @steeevg]

I've made some fun experiments with animated 3D text rendered in HTML! @CodePen. I plan to turn this into a handy little library to help make these kind of effects easier. These are animated with @greensock.

https://t.co/zWH3roIu7i

[🐴 Frontend Horse @FrontendHorse]

I'm thrilled to announce thanks to more viewer donations and sponsors giving more than we asked of them, we've exceeded our original fundraiser numbers!

We didn't raise $16,000
We didn't raise $17,000

We raised $18,000 for @MSF_USA thanks to you and our sponsors! 🎉

[🐴 Frontend Horse @FrontendHorse]

We want to thank the wonderful folks at @github for matching your donations from the Holiday Snowtacular show!

They matched $1,620 to help us reach $18,000 for @MSF_USA!

We appreciate their support for this great cause 💜

[🐴 Frontend Horse @FrontendHorse]

We want to thank the wonderful folks at @xata for matching your donations from the Holiday Snowtacular show!

They ended up giving $2,000 to help us reach $18,000 for @MSF_USA!

We appreciate their support for this great cause 💜