Front end development with ClojureScript framework Re-frame

Abstract

Opinnäytetyössä perehdyttiin suositun web-sovelluskehitysteknologia ReactJS:n ja vähemmän tunnetun React-pohjaisen Re-framen eroihin ja punnittiin niiden heikkouksia ja vahvuuksia käyttöliittymäohjelmoinnissa. Re-framen luonteen vuoksi opinnäytetyössä pureuduttiin myös reaktiivisen funktionaalisen ohjelmoinnin konseptiin sekä mainittujen kirjastojen pääasiallisten kielten, JavaScriptin ja ClojureScriptin, eroavaisuuksiin. Käsittelyn näkökulmaksi otettiin Re-framen ja ClojureScriptin ottaminen yrityskäyttöön tilanteessa, jossa sitä punnitaan vaihtoehtona ReactJS:lle.

Opinnäytetyössä käytettiin esimerkkinä laboratoriorobotille toteutettavaa web-pohjaista käyttöliittymää ja keskityttiin erityisesti kehittämään yhtä käyttöliittymän osakokonaisuutta, jolla luodaan ohjatusti uusia työnkulkuja syöttämällä sovellukseen työnkulun parametreja ja kuoppalevykaavio. Esimerkkityön kautta tarkasteltiin teknologian olennaisimpia piirteitä käyttöliittymäkehityksessä ja pyrittiin avaamaan Re-framella toteutettavia projekteja myös yleisellä tasolla.

Opinnäytetyössä ilmeni, että vaikka Clojure ei ole kovin suosittu kieli käyttöliittymäkehityksessä, Re-frame-kirjaston kanssa ClojureScript soveltuu tähän takoitukseen hyvin. Työ toteutettiin kansainväliselle laboratoriolaitteita valmistavalle tekniikan alan yritykselle.

This thesis addresses the difference between popular web development framework ReactJS and less known Re-frame, a framework based on React, and compares their strengths and weaknesses in front end development. Due to the nature of Re-frame, this thesis also explores reactive functional programming and the primary languages of these frameworks: JavaScript and ClojureScript. The topic is addressed from an angle of adopting Re-frame and Clojure into enterprise use as an alternative to ReactJS.

A web-based user interface for a laboratory robot is used as a use case for the technology. One workflow wizard is in the center of the project. Wizards are used to create pipetting workflows by setting parameters and creating plate maps for the robot. The use case presents the most relevant features of the framework in the context of front-end development in a way approachable for people not familiar with the technology. It was discovered that despite Clojure’s unpopularity in front end development, ClojureScript paired with Re-frame is suitable for the purpose. The project was carried out for an international laboratory equipment manufacturer company.