The Latest from Formidable
- 11 February 2020
How to urql, Part 1
When picking a GraphQL client for React, many default to using Apollo or Relay, but now there’s a new kid on the block rising in popularity over the last year: Its name is urql. It's not as packed with features as other GraphQL clients. Instead, urql aims to be minimal and highly customizable. This blog post series will start by walking you through getting started with urql, and then move on to more advanced topics like subscriptions, normalised caching, etc.
Read - 6 February 2020
Reflections on Renature
In this final post in our three-part series on renature, Parker looks back on how this whole thing started, what we accomplished in the six weeks, and what programs like the Fellowship mean for our commitment to open source sustainability.
Read - 15 January 2020
Our Newest Office is Now Open In Phoenix/Tempe
A year ago at Formidable we began to consider a new expansion city beyond Seattle, Denver, and London. Today we're celebrating the official launch of our office, and formalizing our commitment to growth in the Phoenix-Tempe metro area.
Read - 13 January 2020
Building Physics-Based Animations with renature
Since the initial announcement of the renature project we've made a lot of progress, adding full support for three forces and beginning to scaffold out an API for pausing, reversing, and replaying animations while preserving the simplicity of our tiny hooks API.
Read - 18 December 2019
Introducing Renature: Experimenting with Physics for UI Animation
For this first fellowship, Parker Ziegler, in collaboration with others at Formidable, is working on a new physics-based animation library for React focused on modeling natural-world forces like gravity, friction, air resistance, and fluid dynamics. The project is called renature, harkening to the inspiration it takes from the physics of our universe. It's targeted at UI developers, digital artists, and physics nerds alike. In this post, we'll introduce the motivations behind writing renature, highlight some of the technology we're using to build it, and show off the progress we've made in these first two weeks!
Read - 12 December 2019
The UX Deck: Card-Based Testing for Better Design
Formidable design team has developed a card-based user testing model to meet the needs of client projects that require early-stage research and concept validation. As part of our commitment to open source, we are sharing our learnings and best practices related to this methodology. Here's what it is, how to use it, and where to get your own copy.
Read - 4 December 2019
Runpkg v1.0 - The node packages explorer
Earlier in the year we released Runpkg, an online tool to help developers explore npm packages and their dependencies. We were pleased with the results, but, as with any prototype, there was room for improvement. Over the past few weeks, we were able to iterate on our prototype to improve the package viewing experience, the performance and speed of the site, and the overall design and user experience. Today we are delighted to announce the release of Runpkg v1.
Read - 15 November 2019
Meet Emma Brillhart
We'd like to introduce you to Emma Brillhart. Emma is a senior developer, engineering manager, experienced speaker, co-lead of our newest office in Phoenix, Arizona, and now leads our DevRel program at Formidable.
Read - 17 October 2019
urql DevTools: Introducing Explorer View
In its current state, the urql DevTools make it easy to understand how these responses come in, but you’re still not able to observe your GraphQL data as a whole. We wanted a simpler way for users to see what data their app is currently consuming with a clear overview of which exact query produced which response, without the need to check the network tab manually. We also wanted to see that data update in real time and include any metadata such as cache outcomes as part of the view.
Read - 15 October 2019
Living on the Edge: Lazy Static Sites with Modern CDNs and Lambda
Websites like the New York Times can't wait for a twenty-minute build to deliver breaking stories. A CDN-based service like unpkg can't build a static filesystem for every possible npm package without exorbitant storage and compute costs. Yet these services stay fast in spite of the pitfalls of dynamic sites. How?
Read - 8 October 2019
Responsive Images: Improving performance by letting the browser do the work
We want to serve appropriate images to all of our users, like small images on slower connections and small screens, and large, high-quality images on fast connections and high-resolution screens. Luckily, all modern browsers support a few nifty HTML features to help us optimize our images for whatever device your users are visiting your site on.
Read - 2 October 2019
Building a more accessible web with semantic HTML
I want to make a case for semantic HTML as a way to unlock the door to building accessible apps from the ground up. Accessibility is something that we must get better at slowly, not overnight, and if we do, we will end up saving time and become stronger developers.
Read - 13 September 2019
Say Hello to Kate Schaefer
Our Formidable Denver office is growing! Please meet Kate Schaefer, a software engineer from Colorado.
Read - 28 August 2019
Progress Towards OSS Sustainability
Open source sustainability has been an increasingly visible problem in recent years. The problem is too big for any one person, or any one company to solve, but at Formidable, we're hoping to make a very small, local dent by making open source work more sustainable for our business and for our engineers.
Read - 16 August 2019
Input Smoothing: An Intro To Reactive Animations
A tutorial on how to make an input smoothing object from scratch and leverage it in a React component to smoothly animate a cursor.
Read - 19 June 2019
Meet Jon Reynolds
We're launching a new blog series to showcase our talented team of Formidables across the globe. We're delighted to introduce you to Jon Reynolds from the Formidable Denver office.
Read - 18 June 2019
Glicky: A Graphical User Interface for JavaScript Development Workflows
Modern web development is hard. Long gone are the days of opening up your text editor, writing some HTML, CSS and JavaScript, saving it to an index.html file, and loading it in your browser. For many of us, fiddling with package.json and interacting with the terminal seems easy, because we've done it for a long time. But do you remember how you felt the first time you were faced with a terminal?
Read - 13 June 2019
How To Create an Ideal Design to Dev Workflow
Products that require both design and engineering find an inflection point in their lifecycle that can cause confusion, delay production, and add multiple headaches further down the road. Specifically stated, that point is when the thing that is designed must now be made. How can we, as both designers and developers, mitigate these risks and foster a more inclusive workflow that ensures the final designs are not only beautiful, but functional and developmentally sound?
Read - 11 June 2019
Jetpack: multiple engines for your Serverless packaging and more!
The 'serverless-jetpack' plugin continues its mission to make Serverless Framework packaging and deployment rocket-fast with new features including parallel build workers, full monorepo support, and a dedicated packaging CLI.
Read - 4 June 2019
Placing Radium Into Maintenance Mode
It has been more than four years since @vjeux proposed a revolutionary new idea for styling React components using javascript APIs. This CSS-in-JS talk sparked a wave of innovation in React open source community as we experimented with new ways to apply styles to our React components. Radium was one of the early tools to provide APIs for interop between JavaScript and DOM style tags, and allowed React developers to avoid specificity conflicts by scoping styles to DOM elements.
Read - 31 May 2019
Urql, Grown Up
Early 2018 we released the first version of our minimalist GraphQL client `urql`. For the last year, we’ve been rethinking, rearchitecting, and rebuilding the core of the library, and a few months ago we silently launched `urql` v1.0. Today, with the release of the new documentation site, we’re happy to call `urql` a stable, production-ready GraphQL client library for both small and large React applications.
Read - 30 May 2019
Head-First into Open Source
As more and more people enter the software industry each year, companies can benefit from learning how to bring out the best in their engineers. To that point, this is the story of how my team at Formidable and I quickly built something ambitious and valuable, without compromising my learning, support, and autonomy along the way.
Read - 29 May 2019
End-to-End Testing React Applications with Cypress
When it comes to end-to-end testing React applications, Cypress is rapidly emerging as the community standard. While nothing about Cypress is React-specific, the design of its APIs pairs uniquely well with the nuances of React's reconciliation process and virtual DOM. In this post we'll dig into how Cypress works with React, focusing specifically on how it addresses the challenges of DOM-based testing and manipulation in the era of asynchronous web applications.
Read - 28 May 2019
Jetpack revisited: Even faster Serverless packaging and deploys
After introducing the 'serverless-jetpack' plugin two weeks ago, we took the entire problem back to the drawing board and came up with an even faster and more robust method of packaging and deploying Serverless Framework applications.
Read - 23 May 2019
Game of Types: A Song of GraphQL and TypeScript
Over the last few years, the popularity of both GraphQL and TypeScript has exploded in the web ecosystem—and for good reason: They help developers solve real problems encountered when building modern web applications. One of the primary benefits of both technologies is their strongly typed nature.
Read - 21 May 2019
CI/CD In a Build-free World
Because of the build step and the increased complexity of our apps, Continuous Integration tools and processes have become an essential part of web development. But builds themselves are not why CI is valuable, they're just a side effect of the approach we as an industry have gravitated towards, and they have some drawbacks.
Read - 16 May 2019
Tipple: Stealing Ideas From GraphQL and Putting Them to REST
You've been using Redux for a while now. It was exciting at first, but the amount of code you need to ship a new feature is starting to creep upwards. With every new addition to the backend, you find yourself making sweeping changes across the project. Actions, reducers, containers — it feels like you're touching every file in the codebase and you ask yourself: Were things always this complicated?
Read - 14 May 2019
Jetpack: blazingly fast Serverless packaging and deploys
The Serverless Framework is amazing, but can become incredibly slow to package and deploy applications as projects grow. We introduce the 'serverless-jetpack' plugin, a drop-in replacement for normal Serverless behavior, that offers significantly faster packaging and deployment speed.
Read - 13 May 2019
runpkg: The Online Package Explorer
We are seeing advances in browser technologies that have the potential to change the way we write applications on the web. Now that ES6 modules are well on their way to being supported by all evergreen browsers, we may no longer need to build and bundle our JavaScript code using complex and proprietary tooling. Our source code is becoming our distributed code!
Read - 2 May 2019
Paying Cold, Hard Cash for Open Source Contributions
At Formidable, open source is at the heart of everything we do. We help our clients build mission-critical systems using open source technologies like React, Node, GraphQL, and dozens of others. In return we contribute back to these projects, and give our engineers dedicated time to maintain more than 70 of our own open source projects that others can build upon. But recently we’ve come to realize this is not enough.
Read - 17 April 2019
OSS Maintenance Levels
As Formidable has grown, we have continuously added projects to our portfolio, and today we have more than 70 open source projects that are downloaded and used a couple of million times each week. We try hard to make sure the software we build and maintain is reliable and useful. But how can we continue to maintain and improve every project in our ever-growing open source portfolio?
Read - 16 April 2019
The New React Native Architecture Explained: Part Four
In this final post we tackle the last block of the old architecture graph presented in the first article.
Read - 11 April 2019
Lightweight Client-Side Tests with React-Testing-Library
I have a confession to make: I usually dread writing tests. I especially dread writing them early on in a project, when components are still subject to rapid change and iteration. A few weeks ago, I found myself in that position—I had written new components that needed test coverage, but I knew there were several iterations of both designs and features ahead of us.
Read - 9 April 2019
The New React Native Architecture Explained: Part Three
In part three of our four-part series we will dive into the “meaty” part of the re-architecture, the one that every React Native developer has probably heard about: Fabric and TurboModules.
Read - 4 April 2019
Don’t Build That App!
I ask that you forget what you know and take a few minutes to read this post in the hope that you too can be persuaded to liberate yourself from a toolchain conglomerate that once helped us be more productive, but is now almost certainly introducing unnecessary complexity, limitations, and overhead to our web apps and dev environments.
Read - 2 April 2019
The New React Native Architecture Explained: Part Two
In part two of our four-part series we will dive into how React Native consumes the code you write, and how the re-architecture changes it.
Read - 1 April 2019
New Spectacle Lander
Formidable and the Spectacle team are excited to announce the launch of the new Spectacle lander on the Formidable website! We've updated the branding and brought the lander more in line with our company's overall brand.
Read - 26 March 2019
The New React Native Architecture Explained
In this first post in a four-part series, we discuss the aspect of the React Native re-architecture that will actually affect the code you may write—the new React features and a tool called Codegen.
Read - 14 March 2019
Locking down AWS Serverless applications, the right way
Backend services built with the Serverless Framework on AWS Lambda are enormously popular and powerful, but unfortunately often difficult to secure in the cloud. We present the terraform-aws-serverless project, which provides battle-tested, fine-grained IAM privilege isolation to help lock down your Serverless Framework applications.
Read - 20 February 2019
Upgrading styled-components from v3 to v4
The v4 release of styled-components comes with a lot of features and perfomance wins that we were excited about. If you're like me, you might look at the official v3 to v4 migration guide, see the codemod, and feel pretty confident that the migration should take you less than a day! Welp, I was wrong. Here are a few gotchas I ran into.
Read - 6 February 2019
Blazing Fast Testing in Node with MongoDB
MongoDB is a document-based NoSQL database, and is a popular choice for applications in the Node ecosystem. This post is about testing in Node with MongoDB, however, and not about why you should or should not use MongoDB, so I’ll leave it to the pundits on Hacker News to hash that out.
Read - 30 January 2019
Observation as a prerequisite for design
Observation as a discipline is difficult to summarize, and sometimes even harder to express— it is a talent that takes practice. When performed well, design seems to be obvious, to be the natural state of things.
Read - 23 January 2019
Your 2019 JavaScript Reading List
The internet can be a veritable treasure trove of resources IF you know where to look. We asked our staff to share some of their go-to sites for help, inspiration, breaking news, and more. Below are the top recommendations for 2019 from five members of the Formidable staff.
Read - 15 January 2019
Real-World Performance Wins: an E-Commerce Case Study
Some of my favorite projects are website performance audits. Hunting for opportunities to make an application faster and leaner can be exciting. Recently Tyler Thompson and I had a chance to dive into an e-commerce website’s codebase and search for performance opportunities during a quick two-week sprint.
Read - 18 December 2018
Implementing a Distributed Lock State Machine
A complex distributed computing problem application developers may encounter is controlling access to a resource or entity in a multi-user, concurrent environment. How can we guard against an arbitrary number of concurrent processes from potentially mutating or even having any access to an entity simultaneously?
Read - 12 December 2018
Nuka Carousel Gets Accessibility Updates, New Features
Over the past couple of months, we have made some exciting new changes to Nuka Carousel. Along with fixing several overdue issues, we are most excited about fixing accessibility issues with the carousel component.
Read - 5 December 2018
Moving with Intention: One Dancer's Journey to JavaScript
Anyone with passion can become a programmer. That same level of dedication, sacrifice, and intent is what’s needed to be successful. If you surround yourself with people who are passionate about a subject you are interested in, it is always inspirational.
Read - 27 November 2018
YesNo: Better HTTP Testing
YesNo is a new library for Node.js that simplifies how we write tests asserting the actual behavior of our HTTP requests.
Read - 31 October 2018
Finding and fixing duplicates in webpack with Inspectpack
Needlessly duplicated dependencies produce larger, slower web applications. Let's embark on a deep dive into how npm and webpack work, see how inefficient duplicates can arise, and learn how the Inspectpack duplicates plugin can help.
Read - 25 October 2018
Hooked
We're very excited about what we learned at React Conf and we wanted to share our take on React Hooks, a new React API that gives React functional components the ability to use state and controlled side effects without the need for any additional helper libraries.
Read - 15 October 2018
Announcing Spectacle Boilerplate MDX
Formidable is thrilled to announce the release of Spectacle Boilerplate MDX. Now you can write your Spectacle presentations in markdown while seamlessly including React components and JSX.
Read - 1 October 2018
Formidable Opens its Denver Office Doors
Formidable has opened a new branch office in the LoDo neighborhood of Denver, CO creating a centralized location to best serve our nearby clients and grow our staff of talented engineers.
Read - 25 September 2018
TypeScript and the Second Coming of Node
Long before Node.js famously entered the backend development scene, the tech industry had experienced several evolutions of the "Next Big Thing" with both successful and failed patterns and techniques. In this article, we look at some of the shortcomings of Node.js programming models and how TypeScript offers the hope of increasing the legitimacy of Node.js ecosystem in the enterprise by bringing back some storied and successful programming paradigms from the past.
Read - 18 July 2018
Victory is Turning 30
Victory is making the change to major versions with the release of victory@30.0.0! This is an unusual version bump, and a major milestone for the project, so we thought it warranted more explanation than we usually provide in our release notes.
Read - 21 May 2018
Screenshot Testing with Chromatic
Is this bubble chart correct? Answering this question with unit tests requires breaking it down into several smaller questions: Is the method responsible for calculating bubble size working as expected? Does VictoryScatter render the correct number of...
Read - 7 May 2018
Introducing react-fast-compare
We’re excited to release a tiny new open source project: react-fast-compare. react-fast-compare provides fast deep equality comparison, with specific handling for React. It’s a fork of Evgeny Poberezkin’s very clever (and very fast!) fast-deep-equal
Read - 23 April 2018
Nuka Carousel: The React Carousel, Rethought and Refined
Nuka Carousel is a pure-React carousel component that can support any kind of component as children, including text and images. Nuka has no built-in design, so it can be styled to fit any app. The carousel navigation can be controlled with either a container component...
Read - 26 March 2018
Effortless Assertions and Testing with Enzyme Matchers 6
Enzyme Matchers allows you to run common assertions on your React components using Enzyme in a Jest or Jasmine environment. With it, you can easily test styles, disabled states, stylesheet classes, text and more. With version 6.0, Enzyme Matchers simplifies setup...
Read - 30 January 2018
Introducing URQL (beta), a Universal React Query Library
Today we are formally releasing our newest OSS offering, urql. Pronounced 'urkel', it is technically an acronym for Universal React Query Library. urql is a GraphQL client created in the hopes of simplifying the use of GraphQL in React. There are some amazing solutions...
Read - 16 January 2018
OAuth and PKCE with React Native
OAuth is an authorisation protocol that utilizes a third party to gain access to user information without exposing the user’s password. The OAuth website describes the process with a great analogy: Many luxury cars today come with a valet key. It is a special key you give...
Read - 14 November 2017
Spectacle 4.0 Has Arrived
Since Spectacle was released in early 2016, it’s been fun spotting it in use in presentations at conferences and meetups. The PacMan progress indicator and other familiar UI elements tend give it away, and it is exciting to see every single time. However, plenty of people are still...
Read - 17 October 2017
Introducing Webpack Dashboard & Electron Webpack Dashboard 1.0
After releasing Webpack Dashboard and Electron Webpack Dashboard, we realized that we had hit a sweet spot for developer tooling. Developers wanted to be able to have more transparency and more visual feedback from their build processes (and they like...
Read - 9 October 2017
Adaptive UIs with react-image-palette
When you have an application driven by rich media, like images, it can be hard to develop a cohesive, universal color scheme. A lot of the time, applications end up defaulting to shades of black and white to avoid clashing with the rich colors in their content. If you...
Read - 27 September 2017
Building an Offline-Only Website
This summer I released a small personal project: Offline. It might be the only website that you forces you offline to view it. (I know, it’s weird.)The project’s seed was planted a few years ago when I was having a really hard time concentrating while writing my thesis...
Read - 16 August 2017
Introducing Electron Webpack Dashboard
One year ago yesterday, I released webpack-dashboard. It ended up getting a lot more popular than I thought it would! As it turns out, everyone wants to pretend like they are working at NASA. Shortly after releasing it, and selling it under the guise of it feeling like...
Read - 14 June 2017
Why React Native is the Best Choice for Making Native Apps
Companies often eschew building native apps, thinking hybrid solutions will be easier and more cost effective to build. They end up shoving a not-so-responsive web app into some kind of native web frame, which ultimately leads to terrible user experience. Many companies opt to have...
Read - 7 June 2017
Javascript Power Tools Part III: Real-world redux-saga Patterns
In the past two articles, we've talked a lot about redux-saga in the abstract, without much concern for real-world applications. Now that we’re equipped with new knowledge, we're ready to jump in and start putting the pieces back together. First, we'll take a look at a pattern...
Read - 31 May 2017
Live Editing React Components for Better Documentation
As stated in a previous post about documentation, Your Docs And You, the best response to well made docs is simply, 'I get it!' When writing documentation, it's sometimes easy to forget that someone on the other end will actually be reading your docs. Writing docs can be as difficult as...
Read - 17 May 2017
JavaScript Power Tools Part II: Composition Patterns in redux-saga
In the last article, we investigated redux-saga's approach to the Saga pattern in JavaScript. Specifically, the concept of a generator function that yields command objects, which describe the effects we want to happen, and rely on an external driver to actually perform those effects...
Read - 10 May 2017
JavaScript Power Tools: redux-saga
At Formidable, we're always refining our knowledge of modern JavaScript tech. This blog series, entitled JavaScript Power Tools, will take a deeper look at some of the tools, frameworks, and libraries we use to deliver reliable and maintainable code. Today, I want to talk about [`redux-saga`]...
Read - 3 May 2017
Don't Fear the Fractal: Infinite State Composition with Freactal
In the beginning, there was React. You used `createClass` to define an OOP-style UI component with associated reactive state, and custom mixins managed cross-cutting concerns. It was good. Then came ES6 classes. You used standard language features and semantics to define a component...
Read - 26 April 2017
Join Formidable at SeattleJS Conference
The SeattleJS Conference conference is coming this August 10th and 11th, and Formidable is the presenting sponsor. Have you bought your tickets yet? For background, when we heard that CascadiaFest wasn’t happening this summer, the Formidable crew was super bummed. As the ongoing...
Read - 18 April 2017
Fun with Fiber Custom Renderers at React Amsterdam
Ken Wheeler, Formidable at large, will be speaking at React Amsterdam on April 21st. His talk, Fun with Fiber Custom Renderers, will explore the new custom renderer API in React Fiber, a soon-to-be-released architectural rewrite of React. Ken will cover Fiber basics, the anatomy...
Read - 12 April 2017
Your Docs and You: A Guide for Your First OSS Portfolio
Open Source Software is arguably fated to a life of loneliness without great documentation. I’ve heard more than one developer proclaim the importance of docs, and their corresponding awe and appreciation when they find docs that are really well-made. One of my favorite responses to a docs site...
Read - 29 March 2017
Introducing Appr: A New Review Workflow for Mobile Developers
Appr builds pull requests in your Create React Native App project, deploys the changes to Expo, and posts a link and a QR code to your PR, so you can run the app on your device or emulator in seconds! I'm sure you'll agree: code reviews are a useful tool in a development...
Read - 22 March 2017
Formidable at React London: Offline-First Apps & React Native for Hardware
Ken Wheeler and Jani Eväkallio will be speaking at React London on Tuesday, March 28th. Ken's wild talk, “Weapons Grade React,” will explore the trials and tribulations he experienced while building a remotely controlled robotic crossbow with React and React Native. Using that experience...
Read - 14 March 2017
React Native App Stack, March 2017
This week, we started writing a new React Native app. With every new project, I experience a mix of giddy excitement and intense anxiety: an opportunity to right all past mistakes, and a chance to make a thousand new ones. Discussing greenfield tech choices inevitably devolves into...
Read - 8 March 2017
Be Bold For Change on Women’s Day
Happy International Women’s Day! March 8th celebrates the social, economic, cultural, and political achievement of women. As part of our celebration today, we (Autumn and Elise) are reflecting on the state of women at Formidable. As technology workers, we are lucky to be some of the most...
Read - 1 March 2017
Eric Baer Speaking at Voxxed Days Bristol
Formidafriends in the UK: Formidable Eric Baer is speaking at Voxxed Days Bristol today. Attending? Be sure to check out his talk. Eric will attempt to lay bare the lessons learned from nearly 60 years of API design, from RPC to REST. With mounting pressure on APIs from mobile devices/networks...
Read - 28 February 2017
Faster React SSR with Rapscallion
React has gained significant momentum over the four years since its initial release, and for good reason. I'll admit that I was initially a skeptic, particularly when it came to the strangeness that is JSX, but I was quickly won over by its codification of small, testable units of code...
Read - 1 December 2016
Introducing Whackage
We love React Native. Sometimes, though, it doesn't feel like it reciprocates your love. One such time is when working with codebases that span across multiple repositories. When you want to make changes to a package your app depends on, achieving that snappy hot-reloading workflow you’ve grown...
Read - 9 November 2016
Flexible Charting in React with Victory (and Introducing FormidableCharts)
Victory: React charts tailored to your data Charting directly with d3 can be difficult, but other libraries are often too simplistic. Enter Victory: React charting that is easier than direct use of d3.js but with as much flexibility as possible. Victory allows fully customized charts ranging from...
Read - 25 October 2016
On releasing my first OSS project at thirty-five
A couple weeks ago I released my first open source project at the ripe old age of thirty-five. A dinosaur by tech industry standards or whatever. Computers and programming were something that always came naturally to me in my youth— my first languages were C and x86 assembly. Growing up I...
Read - 19 October 2016
Introducing Publish-Diff
Publishing JavaScript projects to the npm registry is an exercise that, while commonplace, is often opaque to developers and fraught with peril. The opacity comes from projects frequently publishing built files that are omitted from git source and some subtle but important differences...
Read - 18 October 2016
Formidable is Now Mobile
Victory UI Explorer is now available for iOS and Android. Check out what you can do when you combine React Native and Victory, Formidable's charting library. Built by Formidable's own Angela Nicholas. Download Victory UI Explorer for iOS or Android. View the source code for Victory UI...
Read - 12 October 2016
Introducing NodeJS-Dashboard
Node.js engineers spend significant amounts of time developing from the console. The usual workflow I've encountered goes something like: npm run test && node index.js which then dumps pages of text to stdout. Errors can easily go unnoticed when large volumes of output are...
Read - 3 October 2016
Introducing React Progressive Image
Images can be big, and big can be bad on slow networks. Nobody wants to stare at whitespace while their network struggles to load your beautiful background image, so what can we do? That's where progressive image loading comes in. Progressive image loading can be the difference between...
Read - 29 September 2016
London: Formidable Has Landed.
Hi there. I'm Jani Eväkallio, Formidable's new VP of Mobile Engineering. Along with my arrival, today I have the great pleasure of announcing the opening of Formidable in London. In my previous life I was the lead engineer at Futurice London, an early React and React Native advocate,...
Read - 22 September 2016
Announcing the Release of Spectacle Editor
Formidable is pleased to announce the release of Spectacle Editor, an open souce presentation editor built with Electron on top of Spectacle, our library for authoring interactive presentations in ReactJS. We collaborated with Plotly on this project, and it features seamless Plotly integration...
Read - 19 September 2016
Victory 0.12.0: The One True Tooltip
We are pleased to announce that the latest release of Victory finally includes tooltips! This feature has been in demand for a while, but nailing down an implementation strategy proved challenging. No other chart element exhibits the range of behaviors or visual possibilities as the simple tooltip....
Read - 15 September 2016
Introducing React Game Kit
React Game Kit is Formidable’s newest release, written by the one and only Ken Wheeler. Since Ken is busy killing it in Israel at ReactNext, I’m giving a rundown of what React Game Kit is and why you should use it. Ken's slides from his React Next talk can be found here, and I highly recommend...
Read - 13 September 2016
Introducing Nested Routing in Redux Little Router
Ever since we announced Redux Little Router, we’ve worked hard to simplify the API, reduce boilerplate, and ease adoption for beginners. To advance these goals, we’ve introduced two new features: nested routes and nested fragments. Check out Redux Little Router on GitHub! Nested Routes...
Read - 8 September 2016
Builder 3.0: Battle Tested Multiple Project Management
Today we’re excited to announced the release of Builder 3.0, which contains improvements based on our experience using Builder in more than 100 projects over the past 10 months. Builder solves the problem of multiple projects needing the same dependencies, configuration, and npm tasks. For example...
Read - 29 August 2016
Terminal Charts with Victory CLI
The ability to collect, analyze, triangulate and visualize vast amounts of data in real time is something the human race has never had before. After pushing out webpack-dashboard and seeing how much people enjoy terminal based tooling, I thought perhaps I should see what else I can...
Read - 22 August 2016
Make Dope Beats with ReactJS
Before I was a software engineer, I was a music producer. Specifically, I made beats for rap songs. Then file sharing put a dent in the music industry, and it became much harder to do as a career. But hey, I had programming to fall back on! I still made music as a hobby over the years...
Read - 15 August 2016
Introducing Webpack Dashboard
As a child, I always wanted to be a hacker. I remember the first time my father showed me how to dir /p. I thought I was hacking the planet. Then I grew up, and I realized the reality of it was a bit different. I still use the CLI all the time, but it’s far less glamorous...
Read - 5 August 2016
Announcing Victory 0.10.2 and VictoryNative
It’s been a while since the release of Victory 0.9.0 back in June, so we’re excited to add several new features and bug fixes in order to continue making the creation of D3 charts in React as painless as possible. This post will explore some of the highlights of the new...
Read - 25 July 2016
Let the URL do the Talking, Part 3: Empower the URL with Redux Little Router
In parts one and two of this series, we found that, even with the help of integration libraries, we could not liberate URL state from the clutches of React Router. History explains the problem: before Redux, React libraries decided for themselves how much state they controlled...
Read - 19 July 2016
Let the URL do the Talking, Part 2: Bargaining and Acceptance with Redux and React Router
In part one of this series, I explored the pains of integrating React Router into purely-functional Redux applications. There, I discovered that not only does React Router dictate an architectural coupling between your state and view layers, but also renders a set of powerful URL-driven...
Read - 11 July 2016
Let the URL do the Talking, Part 1: The Pain of React Router in Redux
“Just use React Router!” This is how most conversations about routing end in the React/Redux ecosystem. There’s no doubt that React Router is the standard-bearer for SPA routing in the React world, and there’s more to its success than its early arrival on the scene or its SEO...
Read - 20 June 2016
Radium Grid: A React Grid System Injected with the Power of Radium
After spending my formative frontend years implementing layouts with the CSS grid systems from both Bootstrap and Foundation, I developed a clear understanding of the strengths and weaknesses of both. Later, grid systems like Jeet solved many of the pain points of the old grids: no more fixed-column...
Read - 2 June 2016
Why we chose MobX over Redux for Spectacle Editor
For Spectacle Editor, our current collaboration with Plot.ly, we decided to use MobX to handle application state instead of Redux. Redux is an amazing framework, and here at Formidable we continue to use it on new and existing client projects with great results. In part, the decision to use MobX was...
Read - 24 May 2016
Announcing Spectacle Editor, a Work In Progress
Spectacle Editor is a collaboration between Plotly and Formidable. The end result will be the first open source presentation tool with deep Plotly integration. Building on top of everyone’s favorite React slide show framework, Spectacle, we’re inviting the community to witness and participate in...
Read - 21 March 2016
Being Formidable
Inside Formidable, we encourage collaboration and bold, well-researched ideas. Some ideas stick with you longer than others, and continue to inform you work, either directly or indirectly. Here are some that keep the creative fire burning for members of our team. The idea that creating things...
Read - 29 February 2016
React Inline Styles and the Future of CSS
Writing and maintaining CSS for large applications (and large teams) can be challenging. Teams often have trouble with brittle selectors, naming collisions, specificity, and pile-ups of dead code. After seeing these issues first-hand on large projects, we built Radium: a JavaScript library for...
Read - 15 February 2016
Victory.js
I’m not a designer. I’m a JavaScript developer. When I write CSS it takes me longer than it should, and often ends with someone more talented indulgently explaining how I could have avoided making such a mess of things. So, while I can literally do the thing, I can't claim to have design...
Read - 8 February 2016
Unit Testing React Native with Mocha and Enzyme
Working in React Native has been an amazing experience. Coming from React, the workflow has been nearly frictionless. There has, however, been one question lingering: How the hell am I going to test this? Specifically, what is the best way to unit test my component logic? Testing JavaScript that...
Read - 27 January 2016
First Impressions with the Web's latest Presentation Tool: Spectacle
Spectacle, if you haven’t seen it, is another in a long line of HTML presentation tools, but this one has rocketed into popularity (which isn’t exactly common for something like presentation tooling). Since I had heard it has a few neat tricks up its sleeve, and as a born and bred skeptic, I...
Read - 7 January 2016
The Only Correct Script Loader Ever Made
A team here at Formidable was recently tasked with choosing a JavaScript loader in order to dynamically load scripts in the browser. After exhaustively testing every script loader we could think of, we found them all to fail in at least one way. With a complete test suite in hand, we set out to...
Read - 4 December 2015
Using React is a Business Decision, not a Technology Choice
Preamble: React has become very popular among developers and there are lots of resources that speak to its technical merits. However, migrating to (or choosing) a new framework ultimately comes down to selling it to everybody at the table — including non-developers. There are very few...
Read - 21 May 2015
ReactJS and D3 Part I: Layouts
I love D3 — it was one of the reason I became a developer. It introduced me to the concept of functional UI. And, given the direction of the Front-End ecosystem, re-rendering based on diffed arrays (if not diffing the resultant SVG) was clearly ahead of its time and part of the inspiration for...
Read - 1 March 2015
Inline Styles are the Future
Radium is a set of tools to manage inline styles on React elements. It gives you powerful styling capabilities without CSS, and was built over about 2 months at Formidable Labs in response to our excitement about a talk by Christopher Chedeau (and, more broadly, the mindshifting way that Facebook is...
Read - 21 November 2014
Backbone.js with React Views
On Nov. 18, 2014, I presented a talk on “Backbone.js with React Views” at the inaugural Seattle ReactJS Meetup. Backbone.js Backbone.js powers some of the largest web applications on the Internet and we use the framework extensively at Formidable Labs. It provides simple and flexible...
Read - 11 August 2014
Making JavaScript Tests Fast, Easy, & Friendly
A few weeks ago, I presented a talk on “Making JavaScript Tests Fast, Easy, & Friendly” at the CascasdiaJS 2014 conference in Portland, OR. The talk looks beyond the traditional technical details of wiring up test frameworks and focuses on creating processes and environments that...
Read - 8 May 2014
Anchors, Buttons, and Accessibility
Accessibility is a foundational feature of the web. It is a direct reflection of a key tenet of the platform: the free and universal sharing of knowledge, unfettered by language, location, or disability. This is why it’s disappointing that accessibility is so often (and so easily) overlooked...
Read