#web-entwicklung

Why isn’t the internet more fun and weird?

Jarred Sumner ist im Begriff mit Codeblog.app eine Blogging-Plattform und Software zu starten, bei der sich neben Markdown-Text auch React-Code einbinden lässt, um das Netz so wieder „more fun and weird“ zu machen, wie es einst z.B. mit kunterbunten, selbst gestalteten, alles andere als leserlichen MySpace-Seiten der Fall.

During the internet of 2006, consumer products let anyone edit CSS. It was a beautiful mess. As the internet grew up, consumer products stopped trusting their users, and the internet lost its soul.

The internet added <canvas />, but the internet stopped being one.

Gute Idee, diesen DIY-Coding-Geist wieder aufzuleben lassen, und schönes Beispiel dieser Idee in dem verlinkten Blogpost. Sollte man alles auch jenseits von Jareds Codeblog wieder vielmehr tun.

Update, 04.02.: Sascha von PewPewPew ist dem Aufruf nach mehr Weirdness gleich gefolgt und hat sich im obigen, interaktiven Header verewigt1 und mir zukommen lassen. Gerne mehr davon!

  1. Was übrigens schon Ewigkeiten geht. []

Bookmarklet to get the number of your GitLab contributions in 2018

If you are working with GitLab and are interested in the number of contributions you’ve made this year, here’s a handy, little bookmarklet to calculate your contributions.

GitLab Contributions Bookmarklet

  • Drag the link above to your browser’s bookmark bar.
  • Go to https://gitlab.com/users/​[username]/activity
    (replace [username] with, well, your username and, if necessary, gitlab.com with your custom domain).
  • Hit the bookmarklet and – voilà – there’s the number of your contributions made in 2018! 🎉

Screenshot of GitLab contributions bookmarklet

Here’s the JavaScript, if you’re interested or want to run it in your console:

(function() {
	var rects = document.querySelectorAll('#activity .js-contrib-calendar rect.user-contrib-cell');
	var name = document.querySelectorAll('.user-info .cover-title')[0].textContent.replace(/(\r\n\t|\n|\r\t)/gm,'');
	var yearToCount = '2018';
	var counter = 0;
	rects.forEach((item) => {
		var text = item.getAttribute('data-original-title');
		var count = text.substr(0, text.indexOf(' ')); 

		if (text.indexOf(yearToCount) > -1 && count !== 'No') {
			counter += parseInt(count);
		}
	});
	alert(name + ' did ' + counter + ' contributions in ' + yearToCount + '.');
}())

OpenSC2K, SimCity 2000 build with JavaScript

In unserer beliebten Reihe der JavaScript-Nachbauten von Retro-Software folgt heute nach Winamp und MS Paint ein Spielklassiker, mit dem ich damals unendlich viel Zeit verbrachte: SimCity 2000, nachgebaut mit JavaScript, der HTML5 Canvas API1, SQLite und eingepackt mit Electron.

Update, 24.08.2018: Das Repo steht nicht mehr zur Verfügung → DMCA-Takedown-Notice.

  1. Die übrigens auch für den interaktiven Header dieses Blogs verwendet wird. []

Short Trip

Short Trip is the first instalment in a collection of interactive illustrations created for the web. It has been created as a study into capturing the essence of graphite on paper within a digital context, and to learn more about web-based graphics technologies. Short Trip will run on most devices supporting WebGL, including mobile devices.

Sehr tolle und beeindruckende Arbeit von Alexander Perrin. (via Waxy)

Matt Mullenweg: On React and WordPress

Interesting development in the WordPress community: After creating it’s modern, React-based Calypso interface in 2015, Automattic and the WordPress team are now parting ways with React, because of a patent issue in it’s license. They are going to rewrite their upcoming Gutenberg editor with a new, yet to be chosen JavaScript framework, which then should become the new standard for WordPress.

While Preact, a lightweight React alternative with the same API, would be the obvious replacement, a majority of the community prefers a switch to Vue.js. An opinion I highly support. I had the opportunity to learn and work with Vue.js in my day job and for shortfil.ms 2.0 in the last couple of months and I’m hooked. I think it’s right up WordPress‘ alley, because it’s an easy to learn, yet powerful framework and could be a perfectly fitting foundation for modern front-end development with WordPress in the years to come.

TL;DR: +1 for Vue.js