Pinned Cheep
Jhey Tompkins's feed
Excited
Create a scrolling gallery effect with only CSS? Couldn't resist 😅
Get an intro to CSS scroll-driven animation in this article!
Nerdin' out
Circular text rings on the web. SVG? CSS? Without prodding in the dark for magic numbers?
Let's take a look in this article!
Howdy! 👋
I'm Jhey (pronounced "J"). I'm a web developer that thrives on bringing ideas to life with code!
I advocate for creative coding giving you the confidence to build anything imaginable. I enjoy speaking about this and showing people how to level up their skills.
I'm known for my whimsical creations and ability to solve complex problems. This led to me getting branded as somewhat of a polyglot coder. It's incredible to me that you can open a computer and learn about anything at your fingertips!
I've been fortunate to work with and for names such as Google, Uber, Nike, and Monzo. I'm currently a Developer Relations Engineer at Google where I work on the web platform.
I also create a lot of demos. And I mean, a lot. I've created well over 1500 demos on CodePen, featuring on the "Most Hearted" many times. As for code; I like to dig in with React, architect CSS in or out of JavaScript, animate with GSAP, and nerd out in Node. I've got a track record of delivering eye-catching results ahead of schedule. All whilst possessing a keen eye for design, accessibility, performance, and well-structured code.
Besides demos, I love to create videos, stream, write articles, and speak at conferences. Check out the "Content" tab for more on that.
Reach out and say "Hey!". I look forward to hearing from you!
Stay awesome!
When you make a lot of content, it's hard to keep tabs on all of it. Here are some links to various things I create or have been involved with.
Latest posts
I write a bunch, here are some of my latest posts.
- Rotating gallery with CSS scroll-driven animations
JHEY.DEV - Feb 2023
- What the Git? My Git workflow
JHEY.DEV - Feb 2023
- Circular text with CSS?
JHEY.DEV - Jan 2023
Published articles
I'm fortunate to have written for some of my favorite publications. You can check out more of my writing at /writing. If I was to recommend one post that gives some insight into what I'm about, it's this one.
- Playfulness in code: Supercharge your learning by having fun
SMASHING MAGAZINE - Nov 2020
- A guide to audio visualization with JavaScript and GSAP (pt.1)
SMASHING MAGAZINE - Mar 2022
- Pop-ups: They're making a resurgence!
DEVELOPER.CHROME.COM - Sept 2022
- Get started with React by building a Whac-A-Mole game
SMASHING MAGAZINE - May 2021
- Building Chrometober
WEB.DEV - Oct 2022
- Exploring @property and it's animating powers
CSS TRICKS - Mar 2021
- :has(): the family selector
DEVELOPER.CHROME.COM - Aug 2022
- It's good to talk: Thoughts and feelings on creative wellness
SMASHING MAGAZINE - Jul 2020
- Going "Meta GSAP": The quest for perfect infinite scrolling
CSS TRICKS - Apr 2021
- CSS in 3D: Learning to think in cubes instead of boxes
CSS TRICKS - Oct 2020
Speaking
I've traveled all over the world showing people how to do awesome things with code. I'd love to speak at your event. Shall we speak about a topic? Hit me up!.
- Supercharge your skills with creative coding vol. IV
WDC 2022 - Oct 2022
- Supercharge your skills with creative coding vol. I
ALL DAY HEY! 2022 - May 2022
- Supercharge your skills with creative coding vol. VI – The quest for a styleable <select>
TOKYO DEVFEST 2022 - Dec 2022
- Supercharge your skills with creative coding vol. V
MODERN FRONTENDS LIVE! - Nov 2022
- Speedy Dev Insights
STATE OF THE BROWSER 2022 - Oct 2022
- Supercharge your skills with creative coding vol. III – Create your own web platform showcase
SMASHING CONF SF 2022 - Jun 2022
- Supercharge your skills with creative coding vol. II.a – Getting creative with :has()
GDG DEVFEST UKRAINE - Jun 2022
- Supercharge your skills with creative coding vol. II
PIXEL PIONEERS! 2022 - Jun 2022
- What's new in Web? 2023
GDG BERLIN - Jan 2023
Appearances
I sometimes pop up in other places on and off the internet. Podcasts, live streams, meetups, etc.
- #348: With Jhey
CODEPEN RADIO - Dec 2021
- Parallax powered by Tailwind CSS
CODÚ - Jan 2022
- Jhey Tompkins Chats About Building Awesome Demos – Chats with Kent
KENT C. DODDS - Oct 2021
- Whimsical SVG Animations Using GSAP (with Jhey Tompkins)
LEARN WITH JASON - Dec 2020
- Creative coding with Jhey – GSAP, CSS, animations, games!
SCRIMBA - Mar 2022
- Speaker Spotlight: Jhey Tompkins
PIXEL PIONEERS - May 2022
- On making learning development fun
LANDING IN TECH - Nov 2020
- 2.10 – Creative coding to boost your skills
PURRFECT DEV - Mar 2022
- State of CSS 2022: Survey Results Party
KENDO UI - Dec 2022
- How to inspect animations – DevTools Tips
GOOGLE CHROME DEVELOPERS - Aug 2022
Code
I'm a big believer in learning by doing and having fun. I shift the focus from "How?" and "Why?" to "What?" to produce fun demos to learn from and teach others. I've created over 1500 CodePens. Here are some of my favorite demos and projects.
- The impossible checkbox [Most hearted 2020]
CODEPEN
- 3D CSS Plane [Most Hearted 2021]
CODEPEN
- Infinite Cover Flow [Most hearted 2021]
CODEPEN
- Vincent van Git – Paint your Github!
GITHUB
- Newton's Light Bulbs [Most hearted 2020]
CODEPEN
- The Little Book of Jhey
CODEPEN
- Superstar DJ
CODEPEN
- Turbo Kitty
CODEPEN
- React Whac-a-Mole
CODEPEN
- Interactive Lightsaber
CODEPEN
- Pure CSS Working 3D Stopwatch
CODEPEN
- Neon Text Intro
CODEPEN
Videos
I find it pretty fun making video content. But, I've yet to work out which style of video I prefer to create. Perhaps you can help. Let me know what you prefer!
- Tic Tac Toe with SVG && CSS
EGGHEAD.IO
- Speedy CSS Tip – Boujee Text
TWITTER
- CSS Tips && Tricks
EGGHEAD.IO
- Making a Pure CSS Stopwatch with @property
YOUTUBE
- Animate Bendy Strings with GreenSock
YOUTUBE
- Use CSS to create art and illustrations
EGGHEAD.IO
