38 private links
"The HTML of a modern app is mostly a div soup. CSS by itself does not offer any structured model at all. High-level JavaScript components use abstractions that are not consistently tied to styles or markup. At the UX level, interfaces are described in terms that have nothing in common with technical implementations. Enter BEM, a unified semantic model for markup, styles, code and UX. "
"Not all blocks have elements."
"One DOM node may host several blocks. A node may be an element within one block and (at the same time) a container for another block."
"Once the designer is familiar with BEM’s terms, they can iterate towards designing blocks and elements, instead of “screens.” This will also help them to identify similar UI parts and unify them."
certainlyakey starred bbc/gs-sass-tools
Luckily for us, solutions exist to the problem of creating fast, responsive, fully customizable grids: Susy is a Sass-based grid framework. It’s very lightweight and enables you to create entirely custom grids in CSS without touching your markup.
Grandstand is a scalable front end architecture and a lightweight Sass framework. Consisting of a collection of common CSS abstractions and utility helper classes, Grandstand allows you to quickly development components in a reusable, performant manner.
Redux is a simple, truly extensible options framework for WordPress themes and plugins.
Let's learn Gulp
Reactive Components for Modern Web Interfaces
certainlyakey starred coryhouse/react-slingshot
TITAN FRAMEWORK IS NOT YOUR TYPICAL OPTIONS FRAMEWORK. IT ALLOWS YOU TO CREATE CONFIGURABLE SETTINGS FOR WORDPRESS THEMES & PLUGINS WITH EASE WITH JUST A FEW LINES OF CODE.
Free and open source, Ionic offers a library of mobile-optimized HTML, CSS and JS components, gestures, and tools for building highly interactive apps. Built with Sass and optimized for AngularJS.
Presenting a faster, easier and more powerful way to build themes. Because WordPress is awesome, but the loop isn't.
It will come to no surprise to anybody who has heard me speak that I am no friend to Bootstrap. One of my goals with the trainings that Four Kitchens does for Responsive Web Design at various Drupal events and for companies, is to give developers the tools they need to not using Bootstrap or other similar tools. I hope to clear up why I feel that Bootstrap is the wrong tool for most websites, and what you can use instead of it.
Pattern Lab is a collection of tools to help you create atomic design systems.
A good starting point for design that takes device resolution out of the equation
Quickly create responsive HTML emails that work on any device & client. Even Outlook.
Simply put, CSSgram is a library for editing your images with Instagram-like filters directly in CSS. What we're doing here is adding filters to the images as well as applying color and/or gradient overlays via various blending techniques to mimic these effects. This means less manual image processing and more fun filter effects on the web!
Styling CSS without losing your sanity
Angular vs Backbone vs React vs Ember notes
React is about ideas as much as it is technology. For this piece, I'm going to go through the big ideas of React and look at 3 of them that developers working on other frameworks (and Backbone in particular) can learn from. There's a lot more to React and its community than just these 3 ideas, so I'll also include some extra resources at the bottom for those interested in learning more about it.
CriticMarkup is a way for authors and editors to track changes to documents in plain text. As with Markdown, small groups of distinctive characters allow you to highlight insertions, deletions, substitutions and comments, all without the overhead of heavy, proprietary office suites.