Collective #656
Publikováno: 8.4.2021
Swipey image grids * Kaboom!!! * Web Browser Engineering * An accessible toggle
The post Collective #656 appeared first on Codrops.
Inspirational Website of the Week: Studio Sentempo
Harmonious, unique typography and stunning effects combined with thoughtful details. Our pick this week.
Get inspired
Instant websites for your clients with Divi Layout Packs
With the Divi Layout Packs you’ll get world-class designs ready to be used for your client projects.
Check it out
Swipey image grids
Cassie evans shows how to make use of the features of SVG for building interesting UIs.
Read it
Vanilla JavaScript Code Snippets
A guide to vanilla JavaScript code snippets — with resources and lightweight libraries to help you solve a problem without a large overhead or third-party dependencies.
Check it out
Kaboom!!!
Kaboom.js (beta) is a JavaScript library that helps you make games fast and fun! Read more about it in this article.
Check it out
Fixing a slow site iteratively
Learn how to improve site performance step-by-step in this article by Kealan Parr.
Read it
Building a Simple Image Gallery with Eleventy
Learn how to use the Image plugin with Eleventy to build a simple gallery. By Raymond Camden.
Read it
Web Browser Engineering
In this book Pavel Panchekha and Chris Harrelson explain how to build a basic but complete web browser, from networking to JavaScript, in a thousand lines of Python.
Check it out
Minimum Viable Dice Wars
Learn how to code a minimum viable version of Dice Wars.
Read it
An accessible toggle
Kitty Giraudel shares a HTML + CSS only implementation of an accessible toggle that you can copy in your own projects and tweak at your own convenience.
Read it
Paper Snowflakes: Combining Clipping and Masking in CSS
Michelle Barker explains how she built the paper snowflakes demo.
Check it out
Prescriptive software is better than descriptive software
Kilian Valkhof explains what the advantages of prescriptive software are.
Check it out
Inspect Element As A Way To Feed Your Curiosity
A really great idea: inspect elements in the DevTools to learn new things and make yourself a better front-end developer.
Check it out
Mario Carrillo
The cool temporary site by Mario Carrillo.
Check it out
Integration Tests with Jest, Supertest, Knex, and Objection in TypeScript
Learn how to set up and tear down a database for integration tests using Jest and Supertest in a TypeScript API. By Tania Rascia.
Check it out
Lipgloss
Style definitions for nice terminal layouts. Built with TUIs in mind.
Check it out
Coolify: Heroku & Netlify alternative
An open-source, hassle-free, self-hostable Heroku and Netlify alternative.
Check it out
Sortable Table Columns
Adrian Roselli dives into accessible sortable table columns that are usable.
Read it
Classic Windows Calculator
A cool calculator made by Jon Kantner.
Check it out
3 Ways to Merge Arrays in JavaScript
Read how to merge arrays in JavaScript using the spread operator, array.concat() and array.push().
Read it
React + D3.js
Amelia Wattenberger on using D3.js inside of a React.js application.
Check it out
SvelteKit is in public beta
After five months and hundreds of commits, you’re finally invited to try out the SvelteKit beta.
Check it out
Deletion Day
Although it’s from April 4th, there’s lots of valuable information here: Deletion Day challenges the prevailing notion that “more is more”. In a culture that strives for permanence, we celebrate ephemerality, growth, and change.
Check it out
Poulette, the color palette
Proof of concept for a color mixer interface.
Check it out
How to Create a Globe and Add Cities using Three.js
A coding session where you’ll learn how to create a globe and add cities to it with Three.js.
Check it out
Preview to Full Content Page Transition
An experimental page transition concept for magazines and blogs where an excerpt item opens for a full page view.
Check it outThe post Collective #656 appeared first on Codrops.