javascript

Published

Tags

Using Create React App with Fable

Introduction 2019 has been a great year for me for all things F# related! I helped out with the organization of FableConf in Antwerp, gave a webinar at JetBrains and was able to release Fantomas 3.0. To wrap up the decade I’m writing this post as part of the F# Advent Calendar in English 2019. I had fun last year and I wish to continue this trend. To Feliz or not to Feliz Feliz has been receiving some traction in the community and at one-point Zaid asked me what I thought about it. My reply was, well it’s not for everybody 😅. In this blog post I’m going…

Published

Tags

Building Fable on Travis CI

Introduction Hi nojaf from the future, its you from the past. Today you created a build script for compiling Fable projects on Travis CI. Using a Docker image you maintain it is pretty easy to set up a Travis CI process. This blogpost is meant to capture what you knew then in case you sorta forgot. The good part Once you logged in to Travis, create a project by selecting a repository. Don’t worry you log in with your GitHub account and hit the add button. They know you are you and you get to choose a repository you have on GitHub. If you did that then…

Published

Tags

Writing a VSCode extension with Fable 2.1

Introduction This post is part of the F# Advent Calendar in English 2018. I’m very grateful to be a part of this and I hope you will enjoy this one as much as I have enjoyed the others. Today I would like to show you how you can create VS Code extension from scratch using Fable. Along the way we write some code that will extend the Markdown syntax. Project setup Code extension To get started we will follow the general approach of scaffolding a new extension. Using the yeoman generator we will scaffold a new JavaScript extension. Adding Fable In order to…

Published

Tags

React hooks preview with Fable

Introduction A couple of weeks ago Facebook presented React hooks, a new way of accessing React features inside functional components. In this blogpost I would like to show that the new hooks can easily be used in combination with Fable. Disclaimer: Hooks are an experimental proposal to React, currently available in , and the api is not final yet. Use at your own risk. useState() A first example of a hook is useState(). When the hook is called, we receive a variable representing the state and a function to update the state. Example: Note that accepts a…

Published

Tags

Adventures in Elm

Introduction 2016 for me personal was the year the I came in serious contact with functional languages. I started looking at F#, applied functional concepts (partial application, immutability, pure functions and so on) in JavaScript, gave RxJS a shot and fell in love with React. A logical next step was looking at Elm. I was first introduced to Elm at a Socrates Meetup a while ago by Thomas Coopman. To be honest I was a bit overwhelmed at the time and a bit skeptical afterwards. I decided to give Elm another shot and learned a lot by following Elm for…

Published

Tags

A leap in RxJS

Introduction A while ago I wrote some JavaScript to create a custom slideshow. I recently had to revisit that project and I saw an opportunity to fiddle around with RxJS Explaining the problem The way the slideshow works is that it shows three images and moves up one frame at a time. So initially the first three images are shown and the rest are hidden. slideshow example You press the right button to move forward and the left to move backwards. Of course at the beginning of the slideshow you can’t move backwards. Thus the left button is hidden. Once you…

Published

Tags

Redux Thunk, javascript middleware for Redux

Introduction Lately I’ve been using a lot of Reactjs goodness in my side projects. React is only the V in a modern day MVW (Model, View Whatever) pattern and that’s an interesting subject. Facebook uses its own Flux library/pattern/architecture to cope with the other stuff, however there seem to be a lot of different opinions when it’s comes to flux. One of those flux variants is Redux, created by Dan Abramov and others. If you never heard of Redux or don’t really know how it works, I suggest you watch these videos first. In this blogpost I’ll explain a…