I’ve been hearing great things about Jest lately. It’s worth checking it out: Jest is a JavaScript testing framework, used by Facebook to test all JavaScript code including React applications. Install Jest using npm (along with some extra Babel presets if you’re writing ES2015 – Don’t forget to configure Babel using .babelrc to use the …
Refactoring CSS Without Losing Your Mind
Oh, shit, git!
Git is hard: screwing up is easy, and figuring out how to fix your mistakes is fucking impossible. […] Here are some bad situations I’ve gotten myself into, and how I eventually got myself out of them in plain english*. Provides solutions (commands) to scenarios such as “Oh shit, I accidentally committed something to master …
Adding “feature X is unsupported” warnings in your CSS Demos with @supports
Great tip from tuts+: When your CodePen demos rely on cutting edge CSS it’s a good idea to warn people. Let’s provide a notification when browsers don’t support our demos, using the @supports rule to make a handy reusable CodePen asset. New to Feature Queries (e.g. @supports)? Using Feature Queries in CSS will get you …
Continue reading “Adding “feature X is unsupported” warnings in your CSS Demos with @supports“
Millennials need to ditch their parents’ outdated career ladders and embrace job-hopping
(c) REUTERS/Paul Hackett Let’s start treating our careers as a lifelong experiment instead of a preordained slog. Find experiences that allow you to quickly test assumptions about your career interests. Every job, every experience, every place you travel, is a chance to learn something new about yourself, what interests you (and just as importantly what …
JavaScript Fatigue Fatigue
Axel Rauschmayer’s tips to fighting JavaScript Fatigue: Don’t try to know everything Wait for the critical mass. Stick to things you understand: don’t use more than 1–2 new technologies per project. Do exploratory toy projects Diversify in life When in doubt, you can always fall back to the solid base you already know: HTML, CSS, …
How to Use Animation to Improve UX
Animation may be used in a wide range of scales and contexts to unite beauty and function: it can influence behavior, communicate status, guide the users attention and help the user see the results of their actions. Here are just a few examples to illustrate places where you can add some animations in your UI …
Hiding inline SVG icons from screen readers
Roger Johansson: SVG files may contain a title element which may or may not get announced by screen readers (depending on SVG embedding technique, browser name and version, and screen reader name and version). So far I haven’t run into a situation where I want any other behaviour than screen readers completely ignoring icons (since …
Continue reading “Hiding inline SVG icons from screen readers”
You Can’t Get Comfortable in Web Development
Rey Bango, after having read the aforementioned “How it feels to learn JavaScript in 2016”: A lot of the discomfort we’re feeling is the belief that we need to know how to use every new framework or tool that comes out. It’s really not the case. There will always be someone building a new tool …
Continue reading “You Can’t Get Comfortable in Web Development”
Simple Flexbox Grid System
… with blackjack, and hookers! (ref) Introduction and Requirements A while ago, I created a small and simple flexbox-based grid system for use in the projects we make at work. The developed Grid System inspired upon how Bootstrap works: it divides the grid into 12 columns (configurable). it supports gutters in between columns (configurable). it …