I was brought into the compnay Education First as a contract front end developer to work on their home-grown application, EF SET. The team had just completed the move to AWS and the backend systems were fantastic, but the front end had been neglected. I was tasked with rebuilding the legacy front end application from scratch. The application is a test of your English language skills, guiding you through a variety of questions and tasks. At the end you get an accreditation in your English skills.
This app was built to be configurable, and the behaviour could be changed in hundreds of different ways based on the configuration passed in. To allow for this, I built many small React components, where any configurability could be tested in isolation. I also built a system wherby different themes could be loaded on demand. My brief was to build a like for like replacement with the existing design, however there were also designs for the future and I built these as part of a seperate theme that could be easily switched to, once it had been completed.
Redux was crucial for this application, as there was so much state to handle. I split the store among multiple reducers, each with a seperate area of responsibility. For example, there was the timer reducer (as tests are all time limited), and another handling the users session, plus others.
I was the sole front end developer working on this project, responsible for making architecture decisions, setting up the entire build and deploy process, and setting up unit testing. The web app is React/Redux based, entirely client side rendered, and unit tested with Enzyme, Mocha and Karma. Builds are handled by Jenkins and I used Docker and nginx to deploy and serve the application.
The application is now live and in use by around 500,000 people every month. As a bonus, this application is now much more leightweight than it's predecessor. It now weighs 150kb rather than 800kb!
Behind the scenes:
- Git Flow