Latest News

I’ve been having the time of my life with React lately. But on my journey, I’ve had a hard time finding good code style guidelines to keep the mix of JSX and JS clean and readable. I’ve been coming up with my own style guides that I’d love to share. Maybe these will be useful to you and, of course, feel free to share similar guidelines in the comment thread below.

Rule #1: Destructure your props

One of my favorite …

The post React Code Style Guide appeared first on CSS-Tricks.

I recently read this article by Keith Grant which introduced the newly arrived <dialog>. Excited by this new UI element, I immediately sat down to experiment with it to see how it can be used effectively as a modal — the most common use of it. While experimenting, I discovered a neat CSS trick on how to trap focus within the <dialog> element, a common accessibility requirement for modals, and a notoriously difficult one.

Disclaimer: The <dialog> demos in …

The post A CSS Approach to Trap Focus Inside of an Element appeared first on CSS-Tricks.

You know how position: relative creates a new context for absolute positioning within an element? Well, position: sticky is a locally scoped version of position: fixed. Let’s take a look at how that works using a modal with a sticky close button as an example.

The post Sticky as a Local Fixed? appeared first on CSS-Tricks.

Gonzalo García takes a crack at why webpack (not capitalized like npm) exists at all. No particular disagreements here, but here’s my crack at it…

• We use webpack because we need to import stuff from place;. This is a good pattern. We can use webpack to interpret those statements, as native support for them isn’t what it needs to be yet, and it’s not clear whether the native version will be smart for performance or not (probably not,

…

The post Why would I use a Webpack? appeared first on CSS-Tricks.

Job titles is a regular topic around here. Occasionally heated, as job titles play a role in the hiring process (why are you asking me React questions for this UX design position role?). And complicated by the fact that there is no agreed-upon standards and the loads of people and companies who don’t take them seriously (we just want people who do a good job, make your title whatever you want it to be). Complicated again …

The post The spectrum of design roles in 2018 appeared first on CSS-Tricks.

Figma launched their Web Platform API which allows developers to build on top of and extend the features of their web-based design tool. They also published a quick post about the release that showcases how design teams at Uber and GitHub are starting to use the API but they also also dig into a few public extensions that are available to use today.

Direct Link to Article — Permalink…

The post Figma Web API appeared first on CSS-Tricks.

Recently, I had to dig into the topic of code deprecation in JavaScript. I feel like this topic gets less coverage even though it may a play key role in certain projects, especially when working in bigger teams or dealing with external APIs.

In JavaScript-land, I don’t know of any true industry standards for deprecating JavaScript. It could be different per any team, library or vendor.

That’s why my goal here is to sum up my findings and thoughts on …

The post Approaches to Deprecating Code in JavaScript appeared first on CSS-Tricks.