recentpopularlog in
« earlier  
How To Architect A Complex Web Table
Tables frequently appear on the web but aren’t easy to design and code. This illustrated guide explains the table anatomy and how to build a table, keeping in mind its future elaboration.
fridayfrontend  cssbasics  html  tables 
5 days ago
Revisiting the abbr element
All of that said, here’s my attempt at enhancing the <abbr> element and creating a tooltip experience that works for touchscreen, keyboard, and mouse. This solution isn’t perfect, as I discuss below under the limitations, but I wanted to make an attempt anyway :)
fridayfrontend  cssbasics  html  abbr  accessibility 
5 days ago
Slide an Image to Reveal Text with CSS Animations
Pretty neat little animation, right? It’s relatively subtle and acts as a nice enhancement to UI elements. For example, I could see it used to reveal explanatory text or even photo captions. Or, a little JavaScript could be used to fire the animation on click or scroll position to make things a little more interactive.
fridayfrontend  css  cssbasics  animation 
5 days ago
Form design: when to use the number input
You might think the number input is appropriate for the card number, expiry date, and CVC number — after all, they all consist of numbers. But it’s more complicated than that. By looking at what the spec says, what browsers do, and what users want, we can more easily determine when the number input is appropriate or not.
fridayfrontend  cssbasics  forms  html  numbers  inputs 
5 days ago
A Guide To CSS Support In Browsers
It can be frustrating when you want to use a feature and discover that it is not supported or behaves differently across browsers. In this article, Rachel Andrew details the different types of browser support issues, and shows how CSS is evolving to make it easier to deal with them.
fridayfrontend  css  cssbasics  support  supports  browsers 
5 days ago
Quick Tip: CSS Triangles
Making a triangle in CSS is quite a common UI task. If you want to build a tooltip or any dropdown menu, it is possible you need one.
fridayfrontend  css  cssbasics  shapes 
5 days ago
Where Do You Learn HTML & CSS in 2019?
The question of how and where to learn CSS is a highly reasonable thing to ask. The answer depends on all sorts of things: how serious you are, your current foundation, what other resources are available to you, what you hope to do with what you learn, and how much time you have, among probably a zillion other things.
fridayfrontend  css  html  cssbasics  learning 
5 days ago
CSS :placeholder-shown
The :placeholder-shown pseudo-clas targets an <input> element's placeholder only when it's shown, and thus I could select just the placeholder but not the input's text:
fridayfrontend  css  cssbasics  placeholders  placeholder-shown 
5 days ago
Applying Styles Based on the User Scroll Position with Smart CSS
By mapping the current scroll offset to an attribute on the html element we can style elements on the page based on the current scroll position. We can use this to build, for example, a floating navigation component.
fridayfrontend  css  javascript  scroll 
5 days ago
Mastering Maps: Build a Flexible Variable System in Sass
Sass maps give you clearer, more flexible variables — learn how to make a map-powered stylesheet with some basic examples.
fridayfrontend  sass  maps  variables  css 
5 days ago
Learn React App
Application that will help you learn React fundamentals. Install this application locally - there's tutorial, code snippets and exercises. The main objective of this project is to help you get off the ground with React!
fridayfrontend  javascript  react  tutorials 
5 days ago
Vue Interactive Demo Tutorial
A blog post-shaped codepen tutorial to teach the basics of Vue and how it works, with multiple interactive elements and code examples to hopefully illustrate Vue's core principles in an easy-to-understand way.
fridayfrontend  javascript  vue  demos  tutorials 
5 days ago
JavaScript Regular Expressions for Regular People
Regular expressions, also known as regex or regexp, is a difficult subject to tackle. Don’t feel ashamed if you’re not 100% comfortable with writing your own regular expressions yet, as it does take some getting used to. My hope is that by the end of this article, you’ll be one step closer into rocking your own expressions in JavaScript without the need of relying so much on copypasta from Stack Overflow.
fridayfrontend  javascript  regex 
5 days ago
The “C” Is For Accessibility, by Evangelina Ferreira
Screen readers, semantics, label tags, aria and alt attributes… All these things are essential instruments of accessibility; but so are contrast, visibility, pseudo-elements and many others. CSS’s impact on users with disabilities is many times underestimated, which leads to deficiently written code that affects the lives of many of our users. In this talk we will learn how our CSS code affects accessibility and how we can write more responsible stylesheets.
fridayfrontend  video  css  accessibility  contrast 
5 days ago
JavaScript Dominates Browser CPU
as browser CPU time grows the percentage used by JavaScript also increases. Ten years ago the network was the main bottleneck. Today, the main bottleneck is JavaScript.
javascript  performance 
5 days ago
You can’t be a great developer without great communication skills
This is SO HARD for us as developers. It gets drilled into us from day one that consistency is key to good code.

And if you had good code, then sure, that would be true. But right now you don’t.

programming  culture  communication  refactoring 
5 days ago
Navigation Should Be Boring
With a delightfully boring navigation scheme, users don’t need to learn how to explore your app. Their “attention span budget” can thus be spent considering how your new thing can fit into their lives, rather than trying to recall how many fingers they’re supposed to drag from the left side of the screen in order to pull out the Alternate Quick Access Wheel.
accessibility  usability  ux  ui  design  navigation 
5 days ago
Learn Web Development in 2019
A guide to launching your career in web development in 2019. I list the required skills and top courses to learn frontend and backend software engineering.
html  css  javascript  training  learning 
5 days ago
JavaScript for Cats: An introduction for new programmers
So easy your human companion could do it too! JavaScript is a programming language or, in other words, a means by which a computer is instructed to do things. Just the same as one controls humans with hisses and meows, one controls computers with statements written in a programming language. All web browsers understand JavaScript and you can take advantage of that to make web pages do crazy things!
javascript  tutorials  training  learning  cats 
5 days ago | The US government's web traffic.
Official data on web traffic to hundreds of US federal government websites. Published by the Digital Analytics Program.
analytics  government  official 
5 days ago
Solving a Tricky Layout Problem with CSS Grid
This article is a case study on a particular component with a unique layout and a set of constraints. Building a layout that worked for the large number of requirements, as well as unknown content, required applying lateral thinking and a great deal of problem solving to find the right solution.
fridayfrontend  css  cssbasics  layout  grids  cssgrid  flexbox 
11 days ago
How to use web fonts in CSS
Web fonts have revolutionized site typography during the past decade. Designers have fewer constraints and can implement typefaces which work on all mainstream devices and browsers. In this tutorial, we discuss various techniques and best practices for adding custom fonts to web pages.
fridayfrontend  css  cssbasics  webfonts  typography  fout  foit  font-display 
11 days ago
A Detailed Guide to CSS Animations and Transitions
Read along as this is an extensive excerpt covering the basics of CSS animations and transitions that could immensely help you in achieving the same for your business website.
fridayfrontend  css  cssbasics  animation  transitions  transforms  keyframes 
11 days ago
A look at CSS hyphenation in 2019
Let’s have a look at the browser support of CSS Hyphenation, how to use it today and which feature I would like to see in browsers.
fridayfrontend  css  cssbasics  typography  hyphens  word-wrap  overflow-wrap  hyphenate-limit-chars 
11 days ago
My Grid Layout
My site’s design came through a lot of iterations, including the latest complete rewrite and a partial redesign, but its layout is something I used for a while. In this article, I’ll describe what I tried to achieve with it and how it was re-implemented using CSS Grids.
fridayfrontend  css  cssbasics  layout  grids  cssgrid 
11 days ago
Table Design Patterns On The Web
Tables are a design pattern for displaying large amounts of data in rows and columns, and have not yet seemed to fall out of favor, so let’s take a look at how we can create tables on the web in 2019.
fridayfrontend  css  cssbasics  tables  html  responsive  javascript  accessibility 
11 days ago
CSS Position Sticky - How It Really Works!
CSS position sticky has really good browser support, yet most developers aren’t using it. The reason for that is twofold: First, the long wait for good browser support: It took quite a long time for browser support to happen, and by the time it did the feature was forgotten. The second reason is that most developers don’t fully understand the logic behind how it works, and that’s where I come in.
fridayfrontend  css  cssbasics  position  sticky 
11 days ago – Solved by Flexbox High Kick
Flexbox is nowaday one of the problem solvers you should master to help you in your working daily habits. Follow those little demonstrations and case studies to learn more about CSS Flexbox Layout, step by step, and become a Flexbox Ninja!
fridayfrontend  css  cssbasics  flexbox  layout  grids 
11 days ago
Don’t feel like an expert? Share anyway.
Too many of the most interesting voices in tech and design talk themselves out of writing or speaking about their work—because they don’t think they have enough experience. But you don’t have to wait for “enough“ (whatever that means). Here’s how to find what’s special about your perspective right now—wherever you are in your career.
fridayfrontend  writing  cssbasics  learning  teaching  blogging 
11 days ago
Firefox DevTools for CSS authors
If you’re a developer, chances are there’s a set of tools you hold near and dear to your heart, and of course, any browser DevTool is numero uno on that list. With Firefox releasing amazing improvements to their DevTools at a rapid rate, it’s a good time to investigate the powerful aspects specifically geared towards CSS authors.
fridayfrontend  css  cssbasics  firefox  devtools 
11 days ago
CSS: From Zero to Hero
CSS defines the way things look on your websites. HTML is your content, JavaScript adds interaction, but the appearance comes down to CSS. CSS is super powerful, and has a ton of awesome stuff built in. This post will take you from introductory syntax through creating layouts and making sites responsive!
fridayfrontend  css  cssbasics 
11 days ago
What is actually CSS-in-JS?
CSS-in-JS refers to a collection of ideas to solve complex problems with CSS. Since it is NOT a particular library, different libs might solve a different subset of problems and use different approaches, depending on their implementation details. However, all implementations have in common that they tackle the problems using APIs instead of convention and they leverage JavaScript as a language.
fridayfrontend  css  cssbasics  javascript  css-in-js 
11 days ago
prefers-color-scheme: CSS Media Query
Wouldn't it be amazing if websites would also go dark or light based on user's system preference? The CSS working group agrees, which is why they've created a prefers-color-scheme media query; a media query that signals what the user's theme preference is and allows you to code your site to match that preference!
fridayfrontend  css  cssbasics  prefers-color-scheme  darkmode 
11 days ago
Limiting JavaScript?
Yesterday there was a bit of a heated discussion around a WebKit issue that suggested putting a limit on the amount of JavaScript a website can load. In the issue, Craig Hockenberry makes the case that enforcing a limit on the amount of JavaScript would provide a sort of “meet me in the middle” solution for users currently using content blockers.
fridayfrontend  performance  javascript  browsers 
11 days ago
A Year of Utility Classes
Last year at Mud we adopted a utility-first approach to CSS (also known as atomic CSS). In this article I’ll summarise what I’ve learnt from adopting atomic CSS in an agency context over the past year, and where it might or might not be appropriate to apply it.
fridayfrontend  css  utility  atomic  tailwind  tachyons 
11 days ago
HTML, CSS and our vanishing industry entry points
Everyone is angry about CSS again. I’m not even going to try to summarize the arguments. However it always seems to boil down to the fact that CSS is simultaneously too easy to bother with, yet so hard it needs to be wrapped up in a ball of JavaScript in case it scares the horses.
fridayfrontend  css  html  javascript  drama 
11 days ago
It’s My (Third) Party and I’ll Cry If I Want To, by Harry Roberts
Like it or not, a huge part of modern web development involves the use of third-party providers: fonts, analytics, ads, tracking, and more all have an impact of performance, and can leave us (or, more worryingly, our visitors) susceptible to performance degradation.

In this talk, we'll take a look at unruly or uninvited (third-)party guests: how to detect them, how to audit them, and how to manage them. We'll also look at the different tools available to help us stress-test and quantify the overhead these third parties bring, and what that means for users and businesses alike.
fridayfrontend  performance  video  javascript  analytics  devtools 
11 days ago
Accessible Page Navigation in Single Page Apps
Single Page Apps are a bit different. Since we’re not relying on the native page load functionality, we’re now in the tricky business of managing focus ourselves. But don’t fret, there are essentially two solutions to help non-sighted or keyboard-only users get to where they’re going: 1) Emulate a native page load and move focus to the top of the document. 2) Move Focus on the content (heading or possibly form control).
fridayfrontend  accessibility  navigation  focus  spa  react  javascript 
11 days ago
The Many Ways to Change an SVG Fill on Hover (and When to Use Them)
SVG gives us a powerful feature: the ability to manipulate their properties with CSS. Those interactions include changing color on hover states. It sounds like such a straightforward thing here in 2019, but there are actually a few totally valid ways to go about it — which only demonstrates the awesome powers of SVG more.
fridayfrontend  svg  animation  color  hover  fill  css 
11 days ago
Formatting code and pre text
In a recent project, I came across a situation where there were varying lines of text that had to be displayed in the UI. This falls under something that I don’t work with a lot. Also, a couple of the properties have similar names, so I had to double check them to make sure I was styling things correctly (word-break, break-word, etc.). I’ll be talking through the various ways to display text and go a few ways to correct the “bad wrapping” issue. I’ve setup an experimental Codepen.
fridayfrontend  css  cssbasics  pre  word-break  break-word  word-wrap  overflow-wrap  hyphens  white-space 
19 days ago
CSS is a Declarative, Domain-Specific Programming Language
15 years ago, CSS would still be a programming language according the liberal definition laid out here, and now, in 2018, it’s a programming language according to other definitions, too. In it’s current implementation, CSS/HTML is Turing complete, CSS has functions and variables, CSS has math. And it’s only getting more powerful!
fridayfrontend  css  cssbasics  programming 
19 days ago
Building Better Forms™ by not taking away affordances
Don’t fiddle too much with your forms‘ look and feel. A small innocent-looking piece of CSS, even when combined with semantically correct HTML, could leave you with a degraded User Experience and make your forms less Accessible.
fridayfrontend  css  cssbasics  html  forms  accessibility 
19 days ago
3 Useful CSS & HTML Features You Might Have Forgotten About
The inspiration for this article came from running across a tweet from Potch and realizing I had made the exact mistake that was described just a day earlier. It led me to thinking of a couple more CSS & HTML features we often forget about that can be very useful throughout our day-to-day work.
fridayfrontend  css  cssbasics  html  selectors  summary  details  progress 
19 days ago
CSS Specificity
CSS Specificity is the set of the rules applied to CSS selectors in order to determine which style is applied to an element. The more specific a CSS style is, the higher point value it accrues, and the likelier it is to be present on the element's style. There are many benefits of understanding CSS Specificity and leveraging it to your benefit.
fridayfrontend  css  cssbasics  specificity 
19 days ago
How do you figure? |
Introduced as part of HTML5, the figure and figcaption elements are meant to create a meaningful markup structure that provides a descriptive label to a piece of content that is relevant to the current document, but not vital to its understanding. To get more specific, let’s look at these elements individually.
fridayfrontend  cssbasics  html  figure  figcaption 
19 days ago
SVG Filters 101
Best of all, as you’re going to see in this series, SVG filters are capable of creating Photoshop-grade effects in the browser, using a few lines of code. I hope this series will help demystify and unlock part of SVG Filters’ potential and inspire you to start using them in your own projects.
fridayfrontend  design  css  svg  filters 
19 days ago
2019 CSS Wishlist
In observing several sources of conversation around things people desire in CSS, these seem like the most common asks: Parent queries. Container queries. Standardized styling of form elements. Has/Contains Selectors. Transitions to auto dimensions. Fixed up handling of viewport units.
fridayfrontend  css  containerqueries  parent  forms 
19 days ago
Much Ado About No Lists
What does it mean for me as a web developer that Safari is not reading lists when it doesn't look like a list? Nothing.
fridayfrontend  safari  accessibility  voiceover  lists  semantics 
19 days ago
React Introduction For People Who Know Just Enough jQuery To Get By (2019 version)
Many React tutorials begin by explaining how React works or why React is awesome. This tutorial does not. Instead, we’ll get right to building a simple UI, alternating between jQuery implementations and React implementations, explaining the differences along the way. I believe that you’ll think more this way as opposed to just typing out examples.
fridayfrontend  javascript  react  tutorials  jquery 
19 days ago
We are Colorblind
About 4% of the world has some form of color blindness. The color blind have the inability to clearly distinguish between different colors, they tend to see colors in a limited range of hues. Because of this, color blind people experience difficulties and challenges in their daily life. We are Colorblind is dedicated to making the world a better place for the color blind.
fridayfrontend  design  color  colorblind  accessibility 
19 days ago
Your CSS Layout Toolkit for 2019, by Rachel Andrew
As we head into the final quarter of 2018, let’s take a look at where we are with CSS Grid Layout, and CSS layout in general. In this talk you will learn the key elements of layout. The things you need to know as you plan your projects now and into the next year. Rachel will take you on a tour of what we have now and what is coming next, with plenty of practical advice and takeaway code examples, so that you can start to use these features in your own work.
fridayfrontend  video  layout  css  grids  cssgrid  flexbox  multicol 
19 days ago
Tris Webpack Boilerplate
A webpack boilerplate for static websites that has all the necessary modern tools and optimizations built-in.
webpack  boilerplate  reference 
19 days ago
Git Command Explorer
Find the right commands you need without digging through the web.
git  reference 
19 days ago
Learn Vanilla JS
A vanilla JS roadmap, along with learning resources and project ideas to help you get started.
javascript  learning  tutorials  vanilla 
19 days ago
Does it mutate?
A clear list of JavaScript methods with a warning flag to indicate if mutation occurs. Includes code examples and descriptions
javascript  mutation  methods 
19 days ago
Using Content Editable Elements in JavaScript (React)
contenteditable is an attribute that can be placed on nearly any HTML element and the contents of that element will be editable by the user. This attribute is used all over the web, such as in Google Sheets. I’m not going to tell you to use or not to use contenteditable elements in your app. If you’re choosing to use contenteditable, you may find this article useful. I’m going to share a bunch of stuff I figured out while using contenteditable, so that someone else can find it all in one place.
javascript  contenteditable  react 
19 days ago
Lightning Talk - Better Living through Git Hooks, by Leta Keane
(Hopefully) you might already use source control on your React projects. Leta explains how you can use git hooks to keep your codebase clean and running smoothly. She explains the different hooks that exist and potential uses within your React projects.
git  hooks  video 
21 days ago
Automated testing with aXe
Manually reviewing a site for accessibility issues can be a time consuming process. Automated tools help streamline the work and make it easier to catch subtle mistakes. Today on A11ycasts we'll show one of those tools, a library called aXe, and how you can use it as a drop in script, a Selenium runner, or from your command line.
accessibility  video  axe 
21 days ago
Using Lighthouse CI to set a performance budget
You’ve done hard work to get fast so let’s make sure you stay fast! Let’s automate performance testing with Lighthouse CI.
lighthouse  performance  ci  travis  accessibility  github 
24 days ago
The Great Divide
Let’s say there is a divide happening in front-end development. The divide is between people who self-identify as a (or have the job title of) front-end developer, yet have divergent skill sets.

On one side, an army of developers whose interests, responsibilities, and skill sets are heavily revolved around JavaScript.

On the other, an army of developers whose interests, responsibilities, and skill sets are focused on other areas of the front end, like HTML, CSS, design, interaction, patterns, accessibility, etc.
fridayfrontend  culture  titles  frontend  javascript  css  html 
25 days ago
HTML5 Input Types: Where Are They Now?
HTML5 introduced thirteen new types of form input, adding significantly to the number of different fields web designers and developers could add to our forms. These new types all require browsers to support them, and take-up has been slower than some of us would have liked. What is the state of those field types in 2019? Which can we use, and which should still be avoided?
fridayfrontend  cssbasics  html  html5  forms  input 
25 days ago
Dissecting Front-end Job Titles
It used to be straight forward. There was frontend, there was backend, and there was often a graphic designer. In the world of web development titles, things were pretty straight forward. If you stated you did frontend, it was assumed that you knew HTML, CSS, some JS, jQuery, and you knew your way around Adobe and Macromedia products. The multitude of tech boot camps would have you think that we’ve moved to UX/UI, Frontend, Full Stack, and Backend (in which you have a selected stack of programming languages). In reality, the tech world has become so diverse that what would otherwise be front-end roles have such obscure titles that you aren’t sure what you’re applying to.
fridayfrontend  cssbasics  titles  jobs  careers 
25 days ago
Creating Accessible SVGs
Based on these results, it is clear that not all SVG patterns are created equal when it comes to accessibility. Which pattern you choose to implement depends on many factors like how difficult it is to modify baked-in framework code and which browsers/screen readers you are targeting. But no matter which pattern you choose to use, be sure to set aside some time to do your own accessibility/user testing. As SVGs continue to dominate the visual world, it is important not to leave AT users in the dark!
fridayfrontend  svg  accessibility  cssbasics 
25 days ago
How Well Do You Know CSS Layout?
The difference between a CSS good experience and a long frustrating one is oftentimes a matter of a few small details. CSS is indeed nuanced. One of the most common areas where I see struggles is layout. Personally, I like to study patterns. I notice that I tend to use a small group of patterns to solve the majority of my layout problems. This article is about those CSS patterns I use to get myself through layout challenges. It is also about approaching situations agnostically, regardless of the CSS methodologies used, whether that’s SMACSS, BEM, or even the hot topic of CSS-in-JS because they all focus on the properties themselves rather than architecture, organization, or strategy.
fridayfrontend  css  layout  cssbasics 
25 days ago
Web Standards: The What, The Why, And The How
Web Standards, and the documentation to support them, provide huge insight into ‘the why’ and ‘the what’ of the world wide web. They are a fantastic resource for any web developer and help people build stuff for the web that is functional, accessible and cross-compatible. In this article, we take a look at the history of Web Standards, how to use them in your work and ways you can get involved in making them.
fridayfrontend  css  cssbasics  standards 
25 days ago
The Complete Guide To SCSS/SASS
You can’t really appreciate the power of Sassy CSS until you create your first for-loop for generating property values and see its advantages. But we’ll start from basic SCSS principles and build upon them toward the end.
fridayfrontend  css  cssbasics  sass 
25 days ago
Understanding the Albatross
This morning, I read Heydon Pickering’s post on switching from a multiple column flexbox layout to a single column layout without an intermediate step. I spent a bunch of time figuring out *why* it works.
fridayfrontend  css  layout  responsive  flexbox  containerqueries 
25 days ago
Keeping a React Design System Consistent Using Visual Regression Testing
Ensuring visual consistency is one of the biggest challenges of working on a UI component library. Since visual regressions in one component can lead to unwanted changes across an entire application, it becomes vital that we test not only our components functionality, but also their visuals. What follows is the story of how we introduced visual regression testing into our React component library that implements our design system.
fridayfrontend  css  react  designsystem  qa  testing 
25 days ago
Disable animations for users who prefer reduced motion
@media (prefers-reduced-motion: reduce) {
* {
animation: none !important;
transition: none !important;
fridayfrontend  css  accessibility  animation 
25 days ago
An introduction to CSS Containment
Despite how simple is each of the items in this example, we’re getting a big improvement by using CSS Containment in layout time going down from ~4ms to ~0.04ms which is a huge difference. Imagine what would happen if the DOM tree has very complex structures and contents but only a small part of the page gets modified, if you can isolate that from the rest of the page you could get similar benefits.
fridayfrontend  css  contain  performance  layout 
25 days ago
What CSS Taught Me, by Dan Cederholm
Reflecting on 20 years building websites, Dan shares what CSS taught him. Often, it had little to do with CSS itself, but everything to do with making mistakes, teaching while you're still learning, and that everything we create on the web will eventually disappear. And that's ok.
fridayfrontend  css  video 
25 days ago
Use the :lang pseudo-class over the lang attribute selector for language-specific styles
The :lang pseudo-class provides a solution to the limitations of styling the lang attribute in two ways: 1) It uses the actual language of the element selected. 2) It can be applied to any element and is not directly based on the lang attribute.
language  lang  pseudo-classes 
26 days ago
Yelp GraphQL API intro
Yelp has a GraphQL API that is _perfect_ for playing around with graphql without any headache of setting up servers or dealing with authentication
yelp  graphql  api 
26 days ago
CSS Wisdom from Goofus and Gallant
Goofus sneezes his overly specific selectors and !important rules all over the codebase. Gallant carefully follows the low specificity naming conventions of the project and cleans up after his messes.
css  goofus  gallant  comics  satire 
26 days ago
Pure CSS Content Filter
By using CSS’ :target pseudo-selector, we can work out what a user has clicked on, and by using the adjacent sibling selector, we can use that user’s action to style subsequent parts of the DOM.
css  target  filters  selectors 
26 days ago
It’s 2019 and I Still Make Websites with my Bare Hands
Except for the minimum requirements (a text editor and a local web server), my “process” doesn’t need any special tooling: no compiling, no installation steps, no package management. It’s just me, my text editor, my web server, and understanding the basics of how websites work.
fridayfrontend  css  cssbasics  process  javascript  frameworks 
4 weeks ago
New horizons in CSS: Houdini and the Paint API
The way we write CSS is about to change. No, I don’t mean you have to change how you write your styles, but we as developers are about to get a lot more control. What am I talking about? That would be the CSS Houdini spec and the new browser APIs that are coming out as a part of it.
fridayfrontend  css  houdini  api 
4 weeks ago
Why we need CSS subgrid
There has been a lot of discussion over the last 2 years about the use cases for subgrid, how it should be implemented, and even some debate over whether you even need it. A lot of that discussion was centered around two other approaches that can handle many of the same problems as subgrid: nested grids and display: contents. This article will explore both of those approaches, and I hope to demonstrate that there are still some very valid cases where a subgrid is truly needed, and others where it is not strictly needed, but would make for a much cleaner solution.
fridayfrontend  css  cssbasics  cssgrid  layout  grids  subgrid 
4 weeks ago
New ES2018 Features Every JavaScript Developer Should Know
The ninth edition of the ECMAScript standard, officially known as ECMAScript 2018 (or ES2018 for short), was released in June 2018. Starting with ES2016, new versions of ECMAScript specifications are released yearly rather than every several years and add fewer features than major editions used to. The newest edition of the standard continues the yearly release cycle by adding four new RegExp features, rest/spread properties, asynchronous iteration, and Promise.prototype.finally. Additionally, ES2018 drops the syntax restriction of escape sequences from tagged templates.
fridayfrontend  css  cssbasics  javascript  es6  es2018  regex  rest  spread  async  finally  promises 
4 weeks ago
« earlier      
per page:    204080120160

Copy this bookmark:

to read