A library management progressive web app, written in React
Flybrary is a LibraryThing-esque library management app that keeps track of what books you’re reading. The app uses React & react-router to build a progressive web app front-end for a RESTful books API. It has a responsive, mobile-first style built with Material-UI and styled-components that should look equally great on mobile, tablet, or desktop. I built it for the first project of Udacity’s React nanodegree.
I used it as an opportunity to explore not just core React, but the full modern JS dev toolchain. The app is written in Flow, and I’m using Jest and Enzyme for a full test suite, JSDoc comments with documentation.js for documentation generation, and Gulp for task automation. The app is set up with a full continuous integration & continuous deployment toolchain using CircleCI, CodeClimate, and Heroku.
I also played with some of the React ecosystem’s more cutting-edge features. I used react-loadable for code splitting & lazy loading, and react-snapshot for static prerendering (not quite as snazzy as server-side rendering, but it did give me an awesome perf boost!).
This is probably the most fun I’ve ever had working on the front-end. While it wasn’t my first time with React, this was the first time I’ve worked with many of the other technologies, and I feel the experienced really deepened my understanding of JS development. It’s also the first time I’ve built anything that works offline, which was super cool! I did get bogged down by state management purgatory toward the end though, so I think it’s due for an eventual refactor into a proper Redux architecture.
The code is, of course, all on my GitHub.