Een pragmatisch succesverhaal

An article, posted 5 days ago filed in pragmatic, pragmatisch, murb, werk, html, css, development, php, react & projectmanagement.

Enkele jaren geleden werd ik door een oud collega van mij geïnformeerd: hij had gehoord over een project waarvoor ze eigenlijk iemand zochten met mijn profiel (mijn naam was zelfs genoemd). Interaction design achtergrond, in staat zelfstandig een UI neer te zetten op basis van moderne standaarden. De opdracht: een oude extranet applicatie, met een historie uit begin jaren nul even een nieuwe smoel geven (en responsive maken). De opdracht werd gepubliceerd, ik reageerde, en uiteindelijk werd besloten dat ik deze mocht uitvoeren.

Tijdens het eerste gesprek bleek het te gaan om een verzameling oude stijl PHP en CGI scripts. Met een frameset gebaseerde layout, zoals je dat rond 2000 wel vaker zag, werd het samengehouden en aan de gebruiker aangeboden. Ik ken veel collega’s die liever wegrennen bij een dergelijke opdracht, zoveel oude code, zoveel historie, maar ik had het idee dat ik het wel kon doen. Een aanbestedingstraject voor complete nieuwbouw was mislukt omdat alle offertes bu…

Continue reading...

Should I use Ruby on Rails in 2021?

An article, posted 3 months ago filed in rails, ruby, ruby on rails, laravel, symfony, php, python, django, flask, hanami, comparison, enterprise & trust.

I'm still a big fan of Ruby on Rails. No other framework has ever made me as productive. And it is no a secret that it makes quite some other product companies very successful. Think of Shopify, Github, Basecamp, Hey, and others.

But if you'd look at at the list of most popular languages, the top 10 doesn't feature ruby anymore.

In their 2020 survey on most popular technologies, StackOverflow writes:

> Additionally, Ruby, once in the top 10 of this list as recently as 2017, has declined, being surpassed by newer, trendier technologies such as Go and Kotlin.

Also if you look at Google trends, ruby has always been negligible when compared to Python or PHP or Javascript, [the trend is downward for the ruby package manager](https://trends.google.nl/trends/explor…

Continue reading...

Copying / syncing files over a local network with rsync

An article, posted 4 months ago filed in how i do it, rsync, copy, files, unix & macos.

Just a short article to document for myself how to copy a large directory (e.g. a user-folder) over a local network. While (s)cp might work for smaller operations, rsync is my preferred tool as you can restart it when it breaks + in case you found an optimization, you can just abort and restart. Some things to take into account before I share the command:

  • Do not mount a drive, just use ssh
  • if you're sharing from macOS, make sure file sharing has access to the entire harddrive, otherwise some important folders will sync empty (e.g. Documents(!))
  • Make sure you exclude files you don't need (a home folder typically contains many cache-files that you don't want to sync to a new machine
  • Do not enable some form of compression (it waists cpu cycles when your network is fast enough)

So here is the command:

rsync -aWP --inplace --exclude-from=exclude-file.txt murb@someaddress:/Users/username/ .

Breakdown:

  • -a is the archival option, and it is typically what y…

Continue reading...

WebComponents with XSLT

An article, posted 4 months ago filed in xslt, xml, xhtml, html, components, web components & demo.

I’m a sucker for standards. Especially those more theoretical standards: peak theoretical standards era for the web is the era that promised the semantic web; early 2000’s.

Some history

In that time, the first version of this site was built using an XML-based index file, XML files that provided meta data on certain topics and XHTML files that featured the content. With PHP-code to tie requests and responses together, the site was mainly powered by several (big) XSL-Transforms that rendered the pages (it (c|sh)ould’ve been a static site).

Fast forward to today. While WebAssembly is gaining traction, these days the focus is on JavaScript for components. Popularised by frameworks such as React, new elements are defined in JavaScript that can be used in the DOM (the latter is not what React uses btw). The (promoted as) ‘standard’ way to make custom elements is using WebComponents. Yet this effort is driven primarily by Google.

And I’m still closing my ``’s and write `…

Continue reading...

Using Jekyll in 2021

An article, posted 5 months ago filed in ssg, jekyll, review, ruby & static site generators.

I am currently selecting a static site generator for an upcoming project. I value technical simplicity (exit React based solutions), like ruby and in the Static Site Generator category Jekyll is an established name. But doesn't the project that started in October 2008 show signs of age?

Pro’s:

  • It is ruby based (whether that is a pro for you depends on your aesthetics)
  • It is simple
  • It is easy to extend
  • Format for posts is Markdown
  • Hosting it is simple

Con’s:

  • Liquid (a templating language developed by Shopify) is limiting, I’d preferred ERB as a template language.
  • “There is a plugin for that” disappoints, many are pre-bundler era (hence requiring copying code) and quality differs a lot.
  • Lacks even a simple asset pipeline for JavaScript; hence bundle minified JS files together or build the final JS in a separate webpack-process.
  • The builds won…

Continue reading...

Tag descriptor

Static site generators

An article, posted 5 months ago filed in ssg, jekyll, jamstack, javascript, api, markup, markdown & static site generators.

Static site generators mix the maintainability of dynamically rendered sites with the speed and ease of hosting of static sites. It comes at a cost, which is interactivity. Hence typically static sites are enriched client side JavaScript communicating with API's, which has been labeled JAMstack by an org pushing this market.

I’m currently in the process of selecting a static site generator. Based on Github stars this is the current top 10 at Jamstack.org’s overview of static site generators:

  1. Next.js (JS/React)
  2. Hugo (Go) (Smashing Magazine was made with Hugo)
  3. Gatsby (JS/React)
  4. Jekyll (Ruby/Liquid) (powers Github Pages) (my review of Jekyll)
  5. Nuxt (JS/Vue)
  6. [Hexo](ht…

Continue reading...

Why I stopped inheriting from ruby’s core Array class

An article, posted 6 months ago filed in workbook, gem, rubygems, ruby, inheritance & performance.

Inheritance is considered bad practice for quite some time now (Gamma, Helm, Johnson & Vlissides, 1994). Little did I know when I started the ‘workbook’-project in 2012 (note that I don’t have a computer science background).

The main reason I wrote this workbook-gem was that I wanted the most predictable API for working with spreadsheet data (acting as arrays of arrays), not having to use a different API when reading XLSX or CSV files, nor when writing it.

After learning that inheritance is not always a good thing, I still often thought of a workbook as an array of arrays and hence an exception to the rule. But then I came accross a helpful post by Avdi Grimm: [Why you shouldn’t inherit from Ruby’s core classes (an…

Continue reading...

Design Systems and the source of truth

An article, posted 6 months ago filed in atomic design, design, design system, system, css, html, components, @bradfrost, collaboration & work.

Some excerpts I created from the transcript of the Design System Podcast, hosted by Chris Strahl, which in Episode 11 featured Brad Frost and Evan Lovely.

Hand-over of comps

The traditional process starts with the design of comps, comps, non-interactive previews, which are generated by the design team and undergo a rigid design review process up to a design director or VP, and is only then passed on to the developers who need to implement that initially static comp pixel perfect. But Evan Lovely notes that while there is nothing wrong with comps, there is something wrong with mistaking it for the final product. That’s why he likes tools like pattern lab, storybook or knapsack, because they really allow someone to quickly mock up a comp that actually works within the final environment.

To some companies this is a problem; because the formal approva…

Continue reading...

Browserondersteuning

An article, posted 7 months ago filed in browser, Edge, chrome, Firefox, support, mobile, Safari, complexity, quality & performance.

murb hanteert een browser support grading systeem (een idee dat ik ooit heb gekregen van Anselm Hanneman bij het lezen van How to define a browser support level matrix) voor browserondersteuning. We classificeren browsers met een A, B, C of D.

Klasse Omschrijving A Beste gebruikerservaring; alle features werken en weergave is duidelijk. B Alle features werken. Weergave niet altijd optimaal. C Basis functionaliteit werkt (in ieder geval rollen buiten controle (b.v. niet-admin functies)), maar geavanceerdere functies zijn niet altijd beschikbaar. Performance mogelijk niet optimaal. D Wordt niet ondersteund.

B2B projecten

Veelal kantoortoepassingen, complexe schermen, mobile support is een nice to have.

Klasse A Browsers:

  • Google Chrome op Desktop (laatste en op één na laatste versie)
  • Micros…

Continue reading...

To Tailwind or Not

An article, posted 9 months ago filed in tailwind, css, frameworks & bem.

Tailwind is a popular utility first based CSS framework, something that front-end developers can use to make a page look more stunning and/or more consistent. A few interesting takes on tailwind, one of the most popular utility first css frameworks:

I am still not convinced about Tailwind. Heck, I’m even not a major fan of full BEM, although I use it when I am building more complex components with mutiple thightly coupled related parts. The principles behind IT CSS still form the basis of how I prefer to like CSS (note: the author of IT CSS, Harry Robert, is also maintaining a [guideline on how to write maintainable CSS](https://murb.nl/feed_items…

Continue reading...

Highlights from the Atomic Design book by Brad Frost

An article, posted 11 months ago filed in atomic design, design, design system, system, css, html, react, components, @bradfrost, organization, collaboration & work.

Since his talk at Fronteers I was interested in the thinking of Brad Frost, his blog posts, etc., but never actually read his book Atomic design until recently, as it got more and more relevant to an internal discussion at an organization I was working for. A few notes:

  • Most importantly, what it is not: Atomic Design is not about being a practical guide for implementing design systems (although it has some examples in Pattern Lab, which was originally built by him). I was also hoping it would also give guidance on naming things / structuring CSS when building atomic design based design systems, but it does not. But don’t mind, plenty of good content(!)
  • Atomic design sounds like an too obvious idea and while I didn’t dismiss it because of that, I realized I also didn’t try to understand it thoroughly enough. Reading the book helped me to better understand it and especially thinking about the intermediate forms (molecules) was actually despite its o…

Continue reading...

Tag descriptor

Pruning

An article, posted about one year ago filed in pruning.

Software is never done. New ideas develop, new threaths arrive (business wise, security wise). Much like gardening really. Sometimes you can just enjoy the fruits of your labour, but at other times you have to deal with undesired plants that outgrow your crops, crop-eating insects etc. Fruit trees need to be pruned yearly to keep giving fruits. Anyway, I was realizing that I have been repeating this theme as an anology for software development for quite some years now, hence this overview ;)

Continue reading...

Using Tippy.js with Turbolinks

An article, posted about one year ago filed in library, javascript, html & TurboLinks.

Tippy.js is a nice library to show popups. It may, however, not always be obvious how to use Tippy.js with Turbolinks (or any other library that modifies the DOM). The basic ingredient is somewhat hidden in the docs: deffered. But loading a HTML template requires a slight adaptation of what is presented in their documentation to make loading of these templates deferred.

From beginning to start. Add the library:

$ yarn add tippy.js

Add a CSS-class for your templates to be hidden by default:

.tippy-template-content {
  display: none;
}

And then add the following to your application.js (or equivalent in your setup):

import {delegate} from 'tippy.js';

delegate('html', {
  content(reference) {
    const id = reference.getAttribute('data-tippy-template');
    if (id) {
      const template = document.getElementById(id);
      return template.innerHTML;    
    }
  },
  allowHTML: true,   ...

Continue reading...

99% tegen 1%

An article, posted more than one year ago filed in geld, ethiek, efficientie, duurzaamheid, ict, it, goed, energie, occupy, datacenter, cariere, verdienen, economie & fout.

Hoe ik mijn geld verdien houdt mij bezig. Ik vond deze draft terug uit ~2011.

Nietzozeer over hoe ik rijk kan worden, maar meer om te weten of ik wel (mee)werk aan iets waardig is.

… en dat ik dus niet die hefboom aan het creëeren ben waardoor 99% minder gelukkig wordt, en slechts 1% profiteerd, omdat een wereld waarin een goede middenstand bestaat beter functioneerd.

Door de focus op kostenbesparingen en efficientie, die sterk versterkt wordt door de lage prijs van het geautomatiseerd toepassen van een beproefd recept (de kracht van een computerprogramma) zorgen monopolistischd ondernemers ook voor een grotere scheiding tussen arm en rijk.

Nu ontstaan er altijd weer nieuwe banen. En er ontstaan ook altijd weer nieuwe problemen die nieuwe unieke oplossingen vereisen. Maar kunnen die onafhankelijk tot bloei komen als de het er altijd weer op …

Continue reading...

Bye Internet Explorer

An article, posted more than one year ago filed in ie, internet explorer, windows, Edge, Chromium, chrome, browser & Firefox.

It is easier said than done: "just stop supporting Internet Explorer (IE)". There are large organizations that require IE for some of their legacy often in-house applications. If you serve these organizations, you might be required to support IE. Even though, globally, roughly only 2% of the users still use this old browser.

For versions before IE the argument has been easy: "We don’t support a browser Microsoft is not supporting," but support for IE11 doesn’t seem to stop anytime soon (see the update below!): The latest IE (IE11)will be supported as long as the last version of Windows that supports it. That means untill support for the current version of Windows has ended.

With the launch of Edge, [Microsoft initially went along with popular demand not to bring support for older engines to their new browser Spartan](https://docs.microsoft.com/en-us/archive/blogs/ie/updates-from-the-project-spartan-developer-works…

Continue reading...

murb blog