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.
ReadA 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?
ReadOver 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.
ReadAnyone 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.
ReadYesNo is a new library for Node.js that simplifies how we write tests asserting the actual behavior of our HTTP requests.
ReadNeedlessly 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.
ReadWe'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.
ReadFormidable 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.
ReadFormidable 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.
ReadLong 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.
ReadVictory 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.
ReadIs 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...
ReadWe’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
ReadNuka 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...
ReadEnzyme 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...
ReadToday 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...
ReadOAuth 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...
ReadSince 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...
ReadAfter 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...
ReadWhen 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...
ReadThis 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...
ReadOne 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...
ReadCompanies 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...
ReadIn 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...
ReadAs 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...
ReadIn 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...
ReadAt 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`]...
ReadIn 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...
ReadThe 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...
ReadKen 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...
ReadOpen 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...
ReadAppr 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...
ReadKen 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...
ReadThis 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...
ReadHappy 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...
ReadFormidafriends 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...
ReadReact 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...
ReadWe 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...
ReadVictory: 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...
ReadA 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...
ReadPublishing 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...
ReadVictory 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...
ReadNode.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...
ReadImages 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...
ReadHi 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,...
ReadFormidable 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...
ReadWe 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....
ReadReact 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...
ReadEver 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...
ReadToday 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...
ReadThe 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...
ReadBefore 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...
ReadAs 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...
ReadIt’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...
ReadIn 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...
ReadIn 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“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...
ReadAfter 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...
ReadFor 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...
ReadSpectacle 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...
ReadInside 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...
ReadWriting 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...
ReadI’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...
ReadWorking 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...
ReadSpectacle, 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...
ReadA 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...
ReadPreamble: 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...
ReadI 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...
ReadRadium 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...
ReadOn 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...
ReadA 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...
ReadAccessibility 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