JavaScript without JavaScript

Javascript Ljubljana Meetup

08. 11. 2022

We will explore how the popular project was built using Fable, a F# to JavaScript compiler and why (and when) you may find this approach interesting.

Talk recap

This talk was automagically recapped with help of Wordsmith AI.
Subjected to paraphrasing and mirror errors.
  • Joh talks about the COVID-19 record project, which was developed using the latest front-end technology. The project was all about the data, and the lesson it taught is how important the data is when it comes to pandemics.
  • Data is harvested from different sources, stored on GitHub, made available through an API, and then visualised on the website.
  • On the first day, we had one case, and then it grew exponentially as you might remember. Me personally, I started to get interested into that, and I joined Twitter to get the data, and that's how I got into contact with other people who were way smarter than me.
  • Sledilnik started collecting data at the beginning of the pandemic, and then it gradually grew, and now it is available on GitHub. You can see the magnitude of how much data is collected, and how it changed throughout the pandemic, for various reasons.
  • I really liked the idea of storing data on GitHub, because it gives you an environment where you can also see the history of the data, and also makes it more accessible for more people than you would usually do with an API.
  • One thing I would add to this is that I would probably opt for more for including more meta data into the data, so that you really better understand what certain data means.
  • The website is the result of all this data gathering and processing because there is a lot of it. It has around 30 visualisations that cover quite a lot of aspects of the pandemic data.
  • The code for data pipelines is mostly Python, and validates the data before it is ingested into the system. The NIST National Institutes of Health launched their own Power BI portal, and we are scraping some of the data from their portal using JavaScript.
  • I'm not a JavaScript developer, but I've done my share of it. So please be gentle when it comes to that part. I chose F sharp and Fable, and I think that high charts is a very good visualisation library. It's declarative in nature, so you write the configuration of what you want to provide the data and then it would render nicely.
  • F sharp is a functional first universal programming language for writing simple, robust and performant code. It is part of the broader family of ml languages, which includes C sharp, a camel and JavaScript.
  • Microsoft treats F sharp like a pasture child, but in reality a lot of concepts and ideas that are used in C sharp are actually coming from F sharp.This is all open source, Microsoft made a huge effort to open source a lot of their code, and it works on all the major platforms.
  • Fable is a relatively new project that compiles F sharp code into JavaScript. It will also compile into Python, rust, Dart, PHP, I think it's experimental and TypeScript.
  • When you take this approach to JavaScript, you are not forced to do all your projects in F sharp and forget the JavaScript, you can just take one little part of your code base and do it in JavaScript in within F sharp, which then gets compiled to JavaScript.
  • In mathematics, functions are deterministic, but in programming languages, this is not always the case because we have data that is being mutated. So when you call a function, you get the result one time, and then you call it again, you get the result another time.
  • When I first looked at the JavaScript, you had to create a new version of a dictionary every time you wanted to do some operation on it. But now, this is not a problem anymore because the compilers got way more clever. I'm going to showcase a number of really small programmes that try to demonstrate what I'm trying to convey in this video.
  • Algebraic data types are a property of functional programming languages, and are usually tied together with functional programming languages, although there are cases like examples of programming languages that are functional in nature but don't have algebraic data types.
  • In F sharp, you say type, and then your name of the type. Then you say what are the fields, and you have a name field and an age field, both of which have their own types, which are called product types.
  • Functional programming languages are conceptually coming from math, they have much stronger theoretical foundations when compared to other languages, and they are usually made by mathematicians, based on some sort of mathematical theory that they have. And developers usually don't hate math, but it's a good thing.
  • The Asterix type is a binary tree with nodes and children. Each child can be another note or a leaf that carries an integer value, and the Asterix type is a product from above, only in this case, it's not a record.
  • Functional programming languages allow you to write tests that are backed by a nice, well funded theory. This allows you to catch a wide array of really nasty bugs that would otherwise occur when writing code.
  • Functional stack makes programmes easier to compose, understand and reason about, we talked about it earlier. Type system may modelling and refactoring is almost a joyful experience in languages like C, where you just go through the error messages, and when you are done, there is a very good chance that the programme is doing what you want it to do.
  • The idea behind Redux is to provide a better foundation of understanding what programming is. It comes from a small functional programming language called elm, which introduced this idea.
  • The hooks in React are based on a concept of effect management, which is a relatively new concept. It was developed by two guys from Faculty of Mathematics, and then people at Facebook saw it and thought it was a really nifty idea.
Joh Dokler Seven Past Nine

This talk was powered by

BTC City Ljubljana