-
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
cb441f5
commit d029a4a
Showing
2 changed files
with
55 additions
and
0 deletions.
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,55 @@ | ||
--- | ||
$schema: /static/_schemata/blog.schema.yaml | ||
title: Kurzschnitte II - The eighth | ||
description: Explore web development tools, learning resources on CSS and JavaScript, plus fun AI tools and emoji innovations in Kurzschnitte II's 8th edition. | ||
summary: Dive into the latest in web development, CSS guides, and JavaScript tips in Kurzschnitte II's edition 8. Includes unique AI text transformations, emoji creativity, and tips for efficient DOM manipulation, plus resources for enhancing your coding and design skills. | ||
date: 2024-10-10T11:10:57.557Z | ||
publishDate: 2024-10-10T11:10:57.557Z | ||
lastmod: 2024-10-10T11:12:01.180Z | ||
resources: | ||
- title: Photo by [Kelsy Gagnebin](https://unsplash.com/@kelsymichael) via [Unsplash](https://unsplash.com/) | ||
src: header.jpg | ||
categories: | ||
- kurzschnitte | ||
tags: | ||
- kurzschnitte | ||
- bookmarks | ||
- 100DaysToOffload | ||
type: blog | ||
unsplash: | ||
imageid: UcEzgZ6k19o | ||
--- | ||
|
||
Welcome to the eight edition of Kurzschnitte II. The number eight, also the atomic number of oxygen, holds significant interest in various contexts. It has been argued that, since the cardinal number seven is the highest number of items that can be universally processed as a single set, the etymology of "eight" might reflect a composite nature, seen as "twice four" or "two short of ten." In our Solar System, following Pluto's reclassification as a dwarf planet on August 24th, 2006 (meh), eight bodies are now recognized as planets orbiting the Sun. Additionally, eight is the first composite number, neither prime nor semiprime. | ||
|
||
Having said that, here are the links for this edition: | ||
|
||
## Webdev | ||
|
||
- [FacesJS](https://github.com/zengm-games/facesjs) is a JavaScript library on GitHub developed by Zengm Games. It enables the generation of random face graphics programmatically. This library can be particularly useful for games, avatars, or any other project requiring unique, computer-generated faces. The repository includes examples and thorough documentation to help integrate face generation into projects. | ||
- BlockNote.js introduces a markdown-based note-taking tool that is compact and user-friendly. Designed for quick note capture and organization, it leverages Markdown for formatting and offers features like tagging and searching to enhance productivity. For more information on its capabilities and usage, visit [BlockNote.js](https://www.blocknotejs.org/). | ||
- [SVGL.app](https://svgl.app/) provides access to a growing collection of nearly 450 brand icons available in SVG format, which can be downloaded or requested via API for use in various projects. They offer extensions for popular design tools like Figma, Sketch, and Adobe XD, but also VSCode, making it easy to incorporate these icons into your workflow. The icons are free to use, with the option to donate to support the project via Github sponsoring. | ||
- [FSX](https://humanwhocodes.com/blog/2024/01/fsx-modern-filesystem-api-javascript/) is a modern filesystem API for JavaScript. It is designed to enhance file handling capabilities in JavaScript by simplifying interactions with the filesystem, offering developers a more powerful and intuitive way to manage file operations directly within their applications. | ||
|
||
## Learn | ||
|
||
- [Patterns for Efficient DOM Manipulation in Vanilla JavaScript](https://blog.logrocket.com/patterns-efficient-dom-manipulation-vanilla-javascript/) discusses techniques to optimize DOM interactions without relying on frameworks. The article delves into best practices such as minimizing DOM access, using document fragments, and leveraging modern JavaScript APIs like `MutationObserver` for observing changes. It offers valuable insights for developers aiming to enhance performance in web applications. | ||
- [Solved by CSS: Scroll-Driven Animations to Hide a Header](https://www.bram.us/2024/09/29/solved-by-css-scroll-driven-animations-hide-a-header-when-scrolling-up-show-it-again-when-scrolling-down/) explores using CSS to create animations that control header visibility based on scroll direction. The tutorial guides you through setting up CSS to hide the header as you scroll up and reveal it again when scrolling down, enhancing user interface dynamics without JavaScript. | ||
- [A Comprehensive Guide to CSS Container Queries](https://ishadeed.com/article/css-container-query-guide/) by Ahmad Shadeed offers an in-depth exploration of container queries in CSS, which enable style encapsulation based on the container's size rather than the viewport. This guide provides practical examples and insights into creating responsive designs that adapt to various container contexts, enhancing the flexibility and reusability of components across different layouts. | ||
|
||
## Fun and stuff | ||
|
||
- [TextFX](https://textfx.withgoogle.com/) is a tool created by Google that utilizes AI to transform text in creative ways. It allows users to apply various effects to their text, such as making it sound like a recipe, turning it into a weather forecast, or creating various types of lists. The tool is designed to showcase the flexibility and creativity possible with AI-driven text manipulation. | ||
- Álvaro Montoro demonstrates how to create a depiction of Homer Simpson using only CSS and HTML in a creative coding tutorial. The process involves strategically positioning colored circles to form the recognizable image of the character. This technique showcases the potential of CSS for artistic purposes beyond typical web design. Check out the full guide on his [blog](https://alvaromontoro.com/blog/67853/drawing-homer-simpson-using-circles-in-css). | ||
- [Cry Once a Week](https://www.cryonceaweek.com/) is a unique wellness platform that explores the therapeutic benefits of crying. The site encourages visitors to embrace their emotions through weekly crying sessions, providing strategies and insights on how to constructively harness the cathartic power of tears to improve mental health and emotional resilience. | ||
- [Emoji Kitchen](https://emojikitchen.com/) is a creative platform that lets users mix different emojis to create fun, hybrid stickers. The site provides an interactive way to combine elements of various emojis, offering nearly endless combinations for personalized expression through digital stickers. Those emojis are available for use in messaging apps (for instance via Gboard) and social media platforms. | ||
|
||
## Watch and Listen | ||
|
||
- [Studies for Player Piano](https://en.wikipedia.org/wiki/Studies_for_Player_Piano_(Nancarrow)) is a collection of compositions by Conlon Nancarrow, featuring works specifically for the player piano (an auto playing piano, allowing for complex compositions unplayable by human performers. This body of work is renowned for its intricate rhythms and innovative exploration of musical tempo and structure, utilizing the mechanical capabilities of the player piano to extend the limits of human performance. And here we have a laundry machine ripping itself apart to Study no. 21: | ||
|
||
{{< youtube id="8T9xSoaXPPg" >}} | ||
|
||
## What you missed | ||
|
||
{{< tagnavigation "kurzschnitte" >}} |