notes

I recently came across an interesting Bookmarklet bei Nicolas. It’s meant to make link-blogging easier for anyone with a GitHub-hosted blog. The script isn’t perfect yet, but it inspired me to develop it further. Here’s my version of the bookmarklet (function() { // Funktion zum Erstellen eines "Slug" aus einem Text const slugify = text => { let str = text.toString(); // Den Text als Zeichenkette behandeln str = str.replaceAll("/", " "); // Schrägstriche (/) durch Leerzeichen ersetzen str = str.normalize("NFD"); // Unicode normalisieren (diakritische Zeichen trennen) str = str.replace(/[^\w\s-]+/g, ""); // Sonderzeichen entfernen (außer Buchstaben, Zahlen, Leerzeichen, Bindestriche) str = str.toLowerCase(); // In Kleinbuchstaben umwandeln str = str.replace(/\s+/g, " "); // Mehrere Leerzeichen auf ein einzelnes reduzieren str = str.trim(); // Führende und endende Leerzeichen entfernen str = str.replace(/ +/g, "-"); // Alle Leerzeichen durch Bindestriche ersetzen return str; // Slug zurückgeben }; // Titel der aktuellen Seite aus dem Dokument abrufen let pageTitle = window.document.title; // Falls ein Text markiert ist, diesen als "linkSelection" setzen, ansonsten leer let linkSelection = "getSelection" in window ? window.getSelection().toString().trim() : ""; // Inhalt für den Link ermitteln: // Zuerst den markierten Text verwenden, falls vorhanden, ansonsten eine Meta-Beschreibung, // oder den ersten Absatz im <main>, <article>, oder <p>-Tag let linkContent = linkSelection || window.document.querySelector("head meta[name=description]")?.content.trim() || window.document.querySelector("main p")?.textContent.trim() || window.document.querySelector("article p")?.textContent.trim() || window.document.querySelector("p")?.textContent.trim(); // Die URL der aktuellen Seite let linkUrl = window.location.href; // Eingabeaufforderung für den Link-Titel (Standardwert: Seiten-Titel) let title = window.prompt("Title of the link?", pageTitle); if (title !== null) { // Nur fortfahren, wenn der Benutzer einen Titel angegeben hat // Eingabeaufforderung für den Link-Slug (Standardwert: aus Titel generierter Slug) let slug = window.prompt("Slug of the link?", slugify(title)); if (slug !== null) { // Nur fortfahren, wenn der Benutzer einen Slug angegeben hat // Das aktuelle Datum und die Uhrzeit im ISO-Format abrufen und in lesbare Form bringen const currentDate = (new Date()).toISOString().replace("T", " ").replace(/\.\d{3}Z/, " +00:00"); // Dateiinhalt für den Blogeintrag erstellen let fileContent = `---\n` + `date: ${currentDate}\n` + `title: "${title}"\n` + `authors: "maik"\n` + `tags: []\n` + `---\n\n` + `[${title}](${linkUrl} "${title}") für ${linkUrl}\n\n` + `${linkContent ? linkContent.replaceAll("\n", "\n> ") : ""}\n`; // GitHub-URL für das Erstellen einer neuen Datei zusammenbauen let githubUrl = `https://github.com/Maik-Wi/blog/new/main/?` + `filename=${`content/notes/${currentDate.slice(0, 10)}-${slug}-index.md`}` + `&value=${encodeURIComponent(fileContent)}` + `&message=${encodeURIComponent(`New link: ${title}`)}`; // Die URL in einem neuen Fenster öffnen, sodass der Nutzer sie bei GitHub weiterbearbeiten kann window.open(githubUrl); } } })(); The text was automatically translated from German into English. The German quotations were also translated in sense. ...

If you don’t have your own web presence and need a place to quickly jot something down and share it, it’s worth taking a look at the tool »itty.bitty«. It lets you easily write up text and share it with others. If needed, the page can also be password‑protected, and you can set additional metadata. A very useful service. What’s technically interesting is that the entire content is contained in the URL. ...

The site »One Million Screenshots« is currently making the rounds on social media. The project reminds me of the »Million Dollar Homepage«, which is explained in detail on Wikipedia. The text was automatically translated from German into English. The German quotations were also translated in sense.

In their article “Dark Mode: How Users Think About It and Issues to Avoid” on nngroup.com, the authors Tanner Kohler and Amy Zhang dispel common misconceptions about dark mode in user interfaces. They also offer helpful tips for making dark mode more user-friendly. The text was automatically translated from German into English. The German quotations were also translated in sense. ...

“netbeep” is an entertaining and useless browser extension for Chrome and Firefox. It plays sounds as soon as network traffic occurs while a page is loading. That said, one wonders why they didn’t include the nostalgic sounds of old modems. The text was automatically translated from German into English. The German quotations were also translated in sense. ...