Typo, an experiment in font viewing

November 05, 2017

Typo is a lightweight, portable font viewer built with Electron,React and Redux

I've been tinkering with this project for some time but since recently I decided to put some more time and effort behind it, in an effort to create better tools for viewing and possibly in the future editing fonts.

Typo in action


Inspiration for Typo came from a web app that used OpenType.js to load fonts to the browser, Character Map. Initial versions of Typo were based heavily on this, so credits to bluejamesbond for amazing work.

Original Character Map: https://bluejamesbond.github.io/CharacterMap/


The initial version of Typo used and relied solely on React for state and structure, I soon quickly ran into state related errors and hacky work arounds that affected performance, thus verison 2 of Typo has re-written with Redux.

Developing with redux has been a really fun experience, once I learnt to "think" in Redux features were easier to implement and maintain and just generally move around with breaking the overall project.


One of the most difficult challenges I faced while developing Typo was adapting the Redux's model and the various add-ons/functions that existed within the ecosystem of Redux (react-redux, connect(), mapStateToProps, MapDispatchToProps).

Aside from this initial learning curve, once I finally understood them, it was like developing with a jetpack strapped to my back.

Typo is now available for download (via github), I'll make a website(eventually lol).