And of course 3rd person who is still a secret to the community 👀.
I am Robin Malfait, a developer living in Ghent, Belgium. I hear you, I know what you think! Geez, that's a big time zone difference. Actually it is not that bad. Let me show you:
Not too bad right? (Psst, it's a tiny React component!)
The required overlap of 4 hours is not that hard to accomplish. I am also
willing to work from 2pm - 11pm
(my local time) which is 8am - 5pm
(your
local time) from time to time, which results in a full overlap. Long story
short, I don't think the timezone difference would be a big issue here.
I also am happy to take the correct legal actions (going freelance for example) when this becomes real!
I currently still work a full time job, and also am not actively searching for a job. However when I saw this job posting I had to apply since this sounds like a dream job and a once in a lifetime opportunity.
That being said, let's get to my story and why I think we are are a great fit for each other.
Let's get started. I am a 24 y/o developer from Belgium living with my girlfriend and our 2 gerbils in Ghent, Belgium.
When I started software development (when I was about 12 years old) I learned the basics of HTML, CSS and a tiny little bit of JavaScript. After that I moved to PHP. I quickly saw this cool new thing, called Laravel. I've been in the Laravel community for quite some time now. I started with Laravel while it was still in version 3. It didn't even use composer yet! I was also very active on the #laravel and #laravel-offtopic IRC channels.
In 2014 I was a volunteer at Laracon EU 2014 in Amsterdam. I was a freshman in college and had no money, I volunteered thanks to Dries Vints who invited me!
After that I moved to JavaScript development, I also jumped right on the
React hype train (when they still used
React.createClass()
).
In October 2019, together with Marcel Pociot and James Brooks, I volunteered at the Full Stack Europe conference in Antwerp which was organized by Dries Vints and Freek Van der Herten.
It's me on the left!
I love to experiment with tools to make the lives of other developers better and better. I also am the go-to JavaScript guy at my current job. I pushed the developer experience forward by introducing a bunch of things. Let me tell you a little bit more about them:
For starters, I introduced React at my current job. Previously it was AngularJS (the version back in the 1.X days).
I am very well versed in the various API's that React provides. I know my way
around components, hooks, classes and so on. I know what the dreaded key
prop
is used for (and can be used outside of lists as well!). I'm also not afraid to
use context and portals once in a while!
I think I am also pretty good at designing developer friendly component API's. I'm all about tiny and explicit API's (instead of spreading props all over the place).
Some examples of component API's I like:
1// Compound components.2// It doesn't really make sense to use a `Tab` without its `Tabs` parent:3<Tabs>4 <Tabs.Tab>Tab 1</Tabs.Tab>5 <Tabs.Tab>Tab 2</Tabs.Tab>6</Tabs>789// Explicit API > classNames:10<Badge>This is a default badge</Badge>11<Badge variant={Badge.variant.pink}>This is a pink badge</Badge>1213// Explicit API with multiple props:14// I like to expose the available options on the `Component.prop_name.XXX`15// so that you can always find the correct value.16<Badge17 variant={Badge.variant.pink}18 size={Badge.size.large}19>20 This is a large pink badge21</Badge>2223// I don't really like string-based API's because it is hard to maintain24// in my opinion (refactoring is not that easy because it is a string and not a25// reference to *something*), however, this example could also be26// written as:27<Badge variant="pink" size="large">This is a pink badge</Badge>
I also wrote a small rant about why I don't like components with a className
prop because they create implicit components. Ranted a little bit about this
after a conversation in the Tailwind UI Discord channel.
There were almost no tests in our various projects. A lot of those projects use Node.js so I introduced Jest for testing. I can now proudly tell you that we have more than 10 000 tests in our applications!
To make things even simpler, I used Tailwind CSS for our tests. Wait, Tailwind for your tests? What does that even mean?!
In Jest you can write custom
matchers, for example
if you have this piece of code, expect(true).toBe(true)
, the toBe
is a
matcher. You can also write custom reporters
. An example reporter could be a
code coverage reporter.
Back to the topic now, at my current job we have a pretty complex service that allows you to create a timetable. I sadly can't share the code because of NDA reasons, but I can tell you the gist of it. This service allows you to create a timetable which shows you a bunch of slots where a certain person is "available", this takes some rules into account for example travel time, buffer times, availability based on your Google Calendar and so on.
We then wrote a bunch of tests and in the end the assertions looked like this:
1// The `.toBeDiffedAs` is an example of a custom matcher.2expect({ left, right }).toBeDiffedAs(3 expected4);56// Replaced some "business" terms with random variable names
Using a custom reporter we could finally visualize these tests using Tailwind!
Success | Failure |
---|---|
This was a feature that I pitched to my colleagues and to our business people. I was (and still am) extremely proud of it. It was a super cool way to talk about certain behaviour. It was also super easy to spot bugs and walk through scenario's with other people.
As I've mentioned before, we have a lot of applications at my current job. It is a bit of a pain to manage everything. A lot of the developers were using a virtual machine so that we don't have to worry about different operating systems. However, this also means that we have to run everything on our computer itself.
I then started tinkering with the concept of a devbox. A virtual machine, but in the cloud. We currently use Digital Ocean droplets for this. This has a bunch of benefits, for example:
npm install
and composer install
scripts are super fast due to the
gigabit internet from the datacenters.But why am I telling you this? Well, I started working on an (Electron) application to manage this devbox. This is all built using React, TypeScript, Tailwind CSS and of course Tailwind UI!
Let me show you some screenshots:
A syslog parser + viewer:
While this looks a bit crowded, I made the trade-off of making things more compact but easier to scan with a lot of information.
Logs | Raw Logs |
---|---|
I am active on the Discord of Tailwind UI, I sometimes provide help as well. I created the Alpine.js to React bookmark (gist) that allows you to convert the Alpine.js examples to valid React examples, which is currently pinned in the React channel!
I was watching a stream on YouTube from Sam Selikoff the other day and he had it bookmarked as well, which I thought was cool.
I know you like collections! I like collections too, however when you write code
like this in JavaScript (e.g.: .map().filter().map()
) it is very readable, but
it is also a bit too slow for certain parts. Because of this reason I created a
package called
lazy-collections
. They are
based on iterators and generators under the hood. The best part? You don't need
to know how they work since you are not writing generator functions directly.
This allows me to write code in nicely abstracted functions with their own responsibility but while keeping the readability and speed of these collections.
Here is a little example:
1import { pipe, map, filter, toArray } from "lazy-collections";23const program = pipe(4 map((x) => x * 2),5 filter((x) => x % 4 === 0),6 filter((x) => x % 100 === 0),7 filter((x) => x % 400 === 0),8 toArray()9);1011program(range(0, 1000000));
I like to talk, ping pong back and forth, and have long conversations about certain topics. I love to experiment with cool ideas. I do have opinions, I like to discuss / argue / have a conversation about my opinions, but I also love to change / adapt my opinions based on new information.
We can build a lot of great things together!
block
vs
flex
).There is a bunch more I would love to talk about, but I hope I already convinced you enough to start a conversation. I am looking forward to your response / feedback!