Collective #761
Inspirational Website of the Week: Studiogusto
From the typography to the interactive elements, on Studiogusto everything is carefully crafted to create a seamless and visually stunning web experience. A clear winner this week!
Get inspiredAutomated visual component testing – powered by Storybook
Built by Storybook maintainers, Chromatic turns stories into tests. Enabling you to automate checks for visual changes and verify component behavior on each commit. Ready to start? Sign up today with a $500 credit using code "CODROPS".
Get startedAutoFocusDOF: Autofocus DOF component for React Three Fiber
The AutoFocusDOF Component by Anderson Mancini is a tool that simplifies the process of creating a scene with React Three Fiber and post-processing effects for auto-focusing. It uses RayCaster to calculate the distance of objects on Canvas and requires @react-three/postprocessing to function.
Check it outIntroducing npm package provenance
GitHub has announced a new feature for its npm packages called "provenance" that provides a verifiable way to link a package back to its source repository and the specific build instructions used to publish it. This will increase trust in the npm supply chain by giving developers the tools they need to ensure the integrity of their software supply chain.
Read itWayyy
With Wayyy you can create various types of surveys to gather feedback from your team or audience. It has features such as response analysis to provide insights and a customizable survey experience with branding options.
Check it outBuild in-browser WordPress experiences with WordPress Playground and WebAssembly
This article by Adam Zieliński and Thomas Nattestad discusses the WordPress Playground, a tech stack that runs a full WordPress-powered by PHP directly in the browser with WebAssembly. The post explores how it works, how it can help WordPress developers, and what it means for the future of WordPress.
Read itPhind: AI search engine
Phind is an AI-powered search engine optimized for developers and technical questions that provides instant answers with detailed explanations and relevant code snippets from the web. It uses large AI language models to generate answers based on information from multiple sources and is always up to date.
Check it outSpace Elevator
In this beautiful and educational scroll experience you take a trip to space and explore the atmosphere in the world's only space elevator. An amazing creation by Neal Agarwal.
Check it outStorybook 7.0
Storybook 7.0 is a major release for the popular UI workshop environment. It includes new features such as Vite support, zero-config support for NextJS and SvelteKit, improved type safety, a UI design refresh, an overhaul of the documentation system with MDX2 support, improved interaction testing, and more. The release aims to modernize Storybook and improve its stability in a rapidly-changing frontend ecosystem.
Check it outOffline Is Just Online With Extreme Latency
Jim Nielsen discusses the concept of "Local-first Software" presented by Peter Van Hardenberg, which proposes a paradigm shift in software development, from cloud-based to device-based, where the cloud is leveraged for data storage, accessibility, and collaboration without being dependent on it, and how this could lead to a more resilient approach to building for the web.
Read itAnimated Drawings
Learn about the Animated Drawings project, which is an implementation of an algorithm for automatically animating children's drawings of the human figure. The project provides a creative tool that allows users to create animations with their own drawn characters by modifying configuration files, and also offers a browser-based demo for quick and easy animation.
Check it outExtending realities for design & development — an XR Conversation
This article is about extended reality (XR), including virtual and augmented reality, and its potential for mainstream popularity in 2023. It features insights from the 14islands team on how to approach XR projects from a design and development perspective.
Read itExploring :has() Again
Michelle Barker revisits the :has() pseudo-class in CSS, demonstrating its ability to select any element in the DOM relative to another, as long as they share a common ancestor, and provides some practical demos.
Read itKV.JS: Advanced in-memory caching module for JavaScript
KV.JS is an advanced caching module for JavaScript that provides in-memory data storage capabilities, without the need for Redis or Memcached. It can handle multiple data types and supports over 140 functions for various operations.
Check it outWeb Accessibility: A Reference to Creating Inclusive Websites
A comprehensive guide to web accessibility and inclusive web design, covering over 50 points, tips, and advice across ten different categories. The article highlights the importance of ensuring that websites comply with accessibility standards to provide an inclusive online experience for individuals with disabilities, who rely on assistive technology like screen readers to browse the web.
Read itThe Complete Beginners Guide To Autonomous Agents
Learn the basics of autonomous agents, their potential applications, how they work, and their future prospects in this article by Matt Schlicht.
Read itWeb LLM
Web LLM is an innovative project that aims to bring language model chats directly onto web browsers, without requiring server support. It leverages the power of WebGPU to accelerate the process and enable users to build AI assistants with privacy and GPU acceleration.
Check it outPattern Club
Joel Rosen created this fantastic place for inspiration: A curated gallery of patterns, textures and visuals by awesome designers and illustrators.
Check it outUI Interactions & Animations Roundup #31
It's time for a new collection of Dribbble shots featuring trendsetting creative animations and motion designs that will ignite your inspiration.
Check it outUnleash Your Creative Genius with Divi
Unleash your inner creativity and build stunning websites faster than ever with Divi - the ultimate WordPress page builder. With its intuitive drag-and-drop interface, advanced design options, and lightning-fast performance, Divi empowers developers to customize client sites with ease and speed.
Try it for free for 30 days