CodePen Blog відкриті
[search 0]
більше

Download the App!

show episodes
 
Loading …
show series
 
This week I got to speak with Kevin Powell! Kevin has had tremendous success on YouTube educating people about CSS ‘n’ friends. But like so many good content creators, he’ll meet with where you are at and what you need — his personal site has written articles, resources, courses, and a newsletter. Kevin is a joy to talk to. We took the opportunity …
 
There is a “Lorem ipsum” generator built right into Emmet, which we enable on CodePen by default. So if you type lorem-Tab, you’ll get some. Good to know: you can customize how much you get of it by adding numbers. lorem10 is just 10 words of filler text. lorem1000 is 1,000 words of filler text. Lorem ipsum is just gibberish (it’s not really Latin!…
 
Lee Martin had a good idea here. On CodePen’s Live View, we use a parent to listen for updates to the Pen and then inject them or refresh the preview automatically. But that parent can be tricky to size. For example, on iOS, the height of the iframe was as tall as the content inside it and you can no control at all over that. In re…
 
I got to talk with Lea Rosema this week! She’s an incredibly talented digital artist and front-end developer. She does quite a bit of art with some of the trickiest web technology out there: shaders! But rather than just learn it and use it, she helps other people learn and get more out of it. Several times that has taken the shape of Web Component…
 
I got to talk with Micah Godbolt this week! Micah is is a long-hauler at Microsoft working on Design Systems and such. His CodePen account looks a lot like mine: steady consistent usage of “just trying to figure something out” Pens sprinkled with some ideas that somehow seem to click with the wider front-end world. I found it fascinating that putti…
 
I got to talk to Paulina Hetman this week! Paulina is a heck of a creative coder, using her skills as an illustrator and all-around web developer to make ideas come to life. And she doesn’t keep all those ideas to herself, she spends time educating other budding developers both professionally and by building courses and things like her incredibly c…
 
Klare is moving on from design at CodePen to design at GitHub. Huge congrats Klare! If you didn’t know Klare was our one and only dedicated designer here at CodePen and left a massive mark here in the design and UX of CodePen, the app, as well as internally in our organization practices. I’m talking with Klare here just a few days before her last d…
 
I got to talk to Varun! Varun is an incredible artist and would have been interesting to talk with him about literally anything, but since he’s dipped numerous toes into the world of NFTs, I wanted to chat with him about that in conjunction with his own art and other artists he’s a fan of. Time Jumps 00:50 Sharing and teaching in creative ways 02:3…
 
This week I got a chance to talk to Kyle Shook. Kyle has started a new job at Foxtrot so we talked about what that process was like. In addition to creating all sorts of incredibly creative work on CodePen (just look at this Collection of Menus), Kyle helps other people level up their front-end skills too, with sites like Frontend Practice. Time Ju…
 
This week I got to speak with Chris Nager! I’ve known Chris quite a while. I remember being inspired by his hand-drawn SVG plus symbol and subsequent guide to commands, which inspired my own shortly after I was properly obsessed with SVG. We talk about all sorts of things like accessibility, how far CSS has come, and some of the amazing stuf…
 
I got to talk to Sarah Fossheim this week! One of the impressive things that Sarah does is near photograph-quality recreations of iconic old technology in HTML & CSS. I enjoyed the fact that neither of us quite totally knows what some of these machines even did, but appreciate their incredible aesthetics. Perhaps my favorite part of the conversatio…
 
I got to chat with CJ Gammon this week! CJ is a creative technologist, a term he’s tried to hang onto as he does more development work, so he can continue to communicate that he’s a designer as well. CJ has been at Adobe for nearly 10 years and has played with a huge variety of interesting creative technologies. Time Jumps 00:18 Guest introduction …
 
Louis Hoebregts (aka Mamboleoo) has been creating wonderfully creative Pens on CodePen for many years. His early work, as we learn on this episode, was inspired by the CSS trickery of Lea Verou! He rotates his tools between HTML and CSS, SVG, and canvas, but tends to have an aspect of motion and the unexpected. Some of the most popular Pens have an…
 
As you read this, CodePen is 100% on PostgreSQL for our main relational database. It was a transition that took a couple weeks of pretty intense effort, and lots of planning and prep before that. I’ve got Alex on the show to talk about it, as he was the main instigator and led the effort, but everyone contributed in some way. Wondering why? Well… W…
 
Olivia Ng has done loads of wonderful work here on CodePen and off (check out her super cool travel bucket list site) She got started just out of pure desire to build things. “I just really like the internet” she told me. Hear hear! Her eye for design takes all her work to the next level. She had a particular focus on grid for a while there, and us…
 
Rachel and Chris dig into the many, many ways in which we use Notion at CodePen. Heads up, Notion has sponsored a couple of episodes of CodePen Radio lately, but not this. It’s just a tool we heavily use and this podcast is all about that sort of thing. Heck, this podcast itself was planned in a calendar database on Notion, which deals with dates, …
 
You might recognize Ben Evans from his absolutely incredible CSS “paintings”, like the portrait of his daughter or the still life. Paintings aren’t the quite word as Ben designs them all to be entirely scalable. And sometimes they have interactivity, like the slight parallax in the Vaccum from Space. Like so many other great artists, Ben’s skills a…
 
This week I talk with Gabrielle Wee, who’s done loads of creative coding work here on CodePen but like so many other creative people we talk to, her creativity explodes into so many other areas like illustration, photography, drawing, and even gardening. Plus a desire to share those techniques. Her path has led her to be working at Apple, a dream j…
 
Today I get the pleasure of talking with Aaron Iker. Aaron builds incredibly delightful bits and bobs of UI that give you the feeling of hey, I bet I could actually use this! And that’s exactly what Aaron wants you to do. He takes care to make sure the code is easy for you to use if you wish. This idea of taking somewhat practical-looking UI elemen…
 
Marie and Chris talk about CodePen Challenges, which have been going strong for many years now. The gist is that you pop in and make something along a theme. The “challenge” is doing the work (they aren’t meant to be tricky otherwise). We’ve seen people seriously level up their skills by participating, but of course, there is no obligation, and no …
 
Chris gets to chat with George Francis, an incredible digital artist in the generative art space as well as educator and all-around developer. George has been all over the place lately, producing really outstanding work (CSS-Tricks uses a Houdini paint worklet from George in the header and footer). Not only does George make art that has that little…
 
Rachel and Chris chat all things Apollo GraphQL. Apollo is in this weird category of software where like by far most websites do not need it or anything like it. But for CodePen, we consider it nearly essential. The typical sales pitch for GraphQL applies to us for sure (e.g. only ask for the data you need!) but you can add to that the fact that it…
 
Cassie Evans is our special guest this week! Cassie is a front-end developer with a special talent and passion for animation and SVG, as evidenced in part by her amazing work on CodePen. She’s recently became part of the team over at Greensock, a very popular JavaScript-powered animation framework. We got to talk specifically about the Greensock 3.…
 
There are lots of types of dragging that can happen on websites. While they are all click (or tap), hold down, move, and let go, they are all quite a bit different. For instance: Drag files/folders onto the browser window and drop them. The likely use case there is uploading. Drag an element on the screen to another (valid) area of the screen. The …
 
Chris & Shaw talk about a big ol’ conversion to getting CodePen’s color system to use --custom-properties all the way through, rather than Sass variables. Why? All sorts of reasons, kinda boiling down to the fact that they are just better. Here’s a tiny one: you can use the Web Inspector and see what some other element is colored easily. Here’s a h…
 
New CodePen team member! As we recorded this, it was just Robert’s 2nd day at CodePen, and we snuck this podcast in within the hurricane of stuff happening during that time. There is a pile of new software to get access to and acquainted with. There is the dev environment stuff. There is getting acquainted with people, with the extra challenge of d…
 
Dee and Chris talk about “everything money-related” at CodePen. Dee has been managing this stuff since CodePen’s beginning. First largely pro-bono (sorry, Dee), then later as a side gig and part-time job. Dee is full-time now at CodePen, but finance stuff is only part of her role (programming being the main job). It’s a lot of work, but she likes b…
 
We’ve been plucking away at some UI changes that will help slowly morph our existing Pen Editor into the editor we’re imagining for the future. That will be a big change, someday, but in order to make it feel less abrupt, we’re doing smaller changes where we can so that the final change won’t feel so big. So anyway, a little update to the Change Vi…
 
A user wrote in the other day asking us to add this PostCSS plugin: postcss-px-to-viewport. We’re always happy to consider them as needed, and this one looks pretty neat and pretty popular. It also blows my mind a little bit. All you do is size things in traditional units like px and it turns them into viewport units instead, making the entire UI s…
 
Just a little note that we’ve upgraded the upgrade experience. The upgrade UI is upgraded. Upgraded the upgrade. Yah. It’s a whole new UI that we hope is faster and more streamlined. Imagine you’re a free user and the time comes you really need to upload an image to use in a Pen. Upgrading is just a few clicks and a typical credit card (or PayPal) …
 
One of the default keyboard shortcuts I really like from VS Code is the ability to move lines around. I went a long time in my career as a developer never doing this, but once I learned the commands, I use them as naturally as copy and paste. Anytime you’re on a line (or have a selection), you can press Option Up (or Down) and move that line up or …
 
We just rolled out some improvements to how PRO Teams work. We’ve only made teams more functional—there are no changes here that remove any functionality or that require anyone’s immediate attention. Everything is documented in detail in our Teams Management documentation. Changing Roles Before, there was just one Team Owner, and they invited membe…
 
You can now use ${1} as a placeholder for where you want the cursor to go in a custom code editor snippet. For example, a CSS snippet could have: width: ${1};\nheight: ${1}; So like this: And you’ll get behavior like this! The post Custom Editor Snippets with Multiple Cursors appeared first on CodePen Blog.…
 
The .sass variant of Sass isn’t nearly as popular as SCSS. If I had to guess, it would be because SCSS is totally compatible with CSS in that any valid CSS file is a valid SCSS file, which makes SCSS easier to transition to both in terms of coding and the mental shift. But anyway, the .sass variant is still kinda cool. It doesn’t use curly braces (…
 
It used to be that in order to change a Pen, Project, or Collection from public to private (or vise versa), you had to open it directly and edit it there. Now, you can make that change from anywhere you see them in grid, be it in the Your Work section, your profile, or anywhere else you see something you own. If you have a bunch of things you need …
 
Loading …

Короткий довідник

Google login Twitter login Classic login