New Features in React 16
Facebook recently announced the release of React 16, a complete rewrite of the React library. The new core architecture, codenamed “Fiber,” keeps most of the API intact and backward compatible. You can update your existing apps…
Read More
Getting Started with Create React App
Setting up the tools to develop a React application can be intimidating and time-consuming. There are a lot of moving parts. For example, setting up Babel to transpile JSX into browser-ready code, and configuring Webpack to…
Read More
Thinking Ahead: CSS Scroll Snap Points
CSS recently introduced a scroll snap points feature that gives users a fluid and precise scrolling experience for touch and input devices. There are plenty of jQuery plugins available that create scroll snap effects. But instead…
Read More
How to Create a Sticky Navigation
Many websites use a “sticky” feature in their main navigation menu. The menu scrolls with the page, then sticks to the top once it reaches the top of the viewport. There are lots of jQuery plugins…
Read More
How to Create a Simple CSS Dropdown Menu
Many dropdown menus we see on websites use JavaScript in some way, but it’s possible to build one entirely with HTML and CSS. In this short video tutorial, we’ll take advantage of helpful CSS selectors to…
Read More
Create an SVG Sprite Sheet
Image sprites are still a useful feature in web design. They’re also important for website optimization because they combine several images into one image file to reduce HTTP requests. In this tutorial, we’ll learn how to create…
Read More
HTML5 Local Storage
HTML5’s local storage feature allows the browser to store and retrieve specific data. In this post, we’ll pick up where we left off in the previous post where we built a real-time CSS editor using the HTML5…
Read More
The HTML5 Contenteditable Attribute
Did you know that we’re able to create client-side, in-browser content editing using basic HTML elements? We could then save that edited content to the browser’s local storage. The key to making this happen is with the HTML5 contenteditable attribute. To…
Read More
Cutting-Edge CSS Features You Can Use Today
The last wave of new CSS3 features introduced in-browser design features like border-radius, gradients, multiple backgrounds, and box-shadow. CSS continues to evolve and today’s native features are becoming closer to tools we’d normally use in our…
Read More
New Course: Modular CSS with Sass
In this new course, you’re going to build a UI toolkit using Sass and many of the best practices and principles of modular CSS architecture. You’ll learn how a modular approach with Sass can boost your workflow…
Read More
Smarter Sass Mixins with Null
With Sass mixins we’re able to pass a list of arguments to set the values of properties. For example, the following mixin uses four variables as arguments to define the display, padding and margin properties of an element. @mixin display…
Read More
Modular Pseudo-Elements with Sass
When generating pseudo-elements with CSS, we usually need to define certain properties to display the elements. This often means repeating CSS declarations for content, display and position, the most common properties used for generating shapes with pseudo-elements. With…
Read More