Web Tools #532 - Guitar Tools, React, SVG, Uncats

Web Tools Weekly
WEB VERSION
Tools for Web Developers

Issue #532 • September 28, 2023

Advertisement

Let Auth0 by Okta Take Care of Customer Identity
Got better things to worry about than building Identity? If you’re an eligible startup, you can use Auth0’s Identity platform free for one year. By joining Auth0 for Startups, you’ll get access to the full, rich feature set of Auth0 including SSO, MFA, and universal login.

Okta

Use it to create secure, frictionless user access experiences that exceed customer expectations — and customize everything with low/no coding. This is a unique opportunity to get your application to market faster while giving your customers the best login box in the market.

Check Eligibility Now

 
 

Long before I ever got into web development (which was 1999), I started playing guitar. I was into the grunge scene in the early 90s like every self-respecting mid-twenties suburbanite. If you were a white kid living in your parents house in the 90s, Nirvana's album Nevermind was issued to you and you were required by law to start a crappy grunge band.

I was so obsessed with 90s music that I even attempted to audition for the guitar player role in the Red Hot Chili Peppers! I actually got a call to fly out to Los Angeles but couldn't afford it. But don't get too excited – everyone got the callback, those auditions were pretty much a disaster.

Over the last 6 or 7 years, I've started playing guitar again regularly and sometimes I'll jam with friends. I started a music-based YouTube channel about two years ago that I occasionally update.

Of course, this is a tools newsletter, so I'm not going to bore you too much with the history of my music hobby. Since some of you might be hobby musicians as well, I thought it would be useful to share some of the online tools I use when making YouTube videos and doing other guitar-related things.

Ultimate Guitar
Probably the most popular guitar tabs resource. I have a pro account, so I can view and contribute to "official" tabs. I regularly contribute corrections there, as even the "official" tabs are often wrong.

Ultimate Guitar


Moises
My favourite track separation tool. The free version is pretty much all most people will need. It permanently stores everything you separate. I often use it to play along with tracks or create my own backing tracks, which I sometimes upload to my YouTube channel.

https://moises.ai/


SongData.io
Sometimes I want to jam along to a song without actually playing a backing track, but I want to know the tempo. This website tells me the BPM and key for any song so I don't have to figure out the tempo myself.

SongData.io


Tap Tempo
Alternatively, this is a simple app that lets you tap along with any song to find the BPM manually.

Tap Tempo


Songcraft
My favourite website for writing custom guitar tablature. It's not perfect, but I like the way it looks and it's easy to use. I use this app to create screenshots for the guitar lessons and on-screen tab videos I've included on my YouTube channel.

Songcraft


drumbit
A simple drum machine app that's installable as a PWA. Useful for jamming along with a custom beat (although I also have a real Boss drum machine that I bought back in the 90s that's pretty cool too).

drumbit


Chord Identifier (Namer)
When I write my own tabs, I like to put the chord names at the top of the tab staffs. This is a nice tool to find the names of obscure chords.

Chord Identifier


That's pretty much the set of tools I use regularly, along with various native apps, for fiddling around and experimenting in the non-web development side of my life.

If you happen to be a musician yourself and have any interesting tools that you like to use, feel free to reply to this email or hit me up on Twitter/X. I'd love to hear what stuff you've been using and if you have suggestions for any better alternatives to the tools I listed above!

Now on to this week's (web development) tools!

 

React Tools

React Lite Month Picker
Here's something a little different and minimalist, a date picker that's nothing but a simple, customizable month picker component for React.

puck
A self-hosted, drag and drop editor for React that allows integrations with third-party CMS's and no vendor lock-in.

Daxus
A server state management library for React that provides full control over data, leading to a better user experience.

Let Auth0 by Okta Take Care of Customer Identity
We know you have a million things to worry about. Let us take care of Identity, so you can focus on everything else. Auth0 for Startups enables startups to provide secure access to any application, for any user.     SPONSORED 

AutoForm
A React component that automatically creates a @shadcn/ui form based on a zod schema.

Remix PWA
A Progressive Web App framework that seamlessly integrates PWA features into Remix including offline support, caching, installability on Native devices, and more.

React Plock
A small React package that lets you create responsive and customizable masonry layouts.

React Plock

CopilotKit
A powerful and hackable copilot for any React app that lets you get started in minutes and iterate as needed.

gltfjsx
A small command-line tool that turns GLTF assets into declarative and reusable react-three-fiber JSX components.

StateDecorator
A set of React hooks that manage a complex component state in an easy, testable and deterministic way.
 

Media Tools (SVG, Images, etc.)

PureImage
A pure 100% JavaScript implementation of the HTML Canvas 2D drawing API for NodeJS that has no native dependencies.

iconbundler
An online tool that lets you upload SVG icons  in ZIP format, then the tool will export them as React, Vue, and Svelte components.

freeillustrations.club
Four collections of free, hand-drawn illustrations in SVG format that you can use in commercial projects.

UI Skeleton Gallery
A free customizable collection of SVG skeleton loader UI elements for design wireframes and mockups.

Hal9: Chat with Your Data, Get Insights in Seconds
Chat with your enterprise databases using secure generative AI and empower business users in your team to do their own data analyses in seconds.    SPONSORED 

ImageCreator
An AI-based image copilot plugin for Photoshop, for creating generative art, customized models, and more.

Iconsans
A collection of 660+ free icons in bold and line styles, designed for use Vue and React projects.

Iconsans

Typograms
A lightweight image format (text/typogram) useful for defining simple diagrams in technical documentation.

Flatdraw
An open-source drawing web application with a nice, easy to use UI that lets you export your drawings in PNG or JPEG format.

Image-to-Pixel
An editor that lets you convert images to pixel art, add dither, set palettes, and more, made entirely in p5.js.

 

The Uncategorizables

FFmpeg
A visual web interface for FFmpeg. Just type a phrase for what you want to do with your media file and the tool will generate the code.

Neon
Rust bindings for writing safe and fast native Node.js modules with no build scripts or dependencies.

Socket Security
A Chrome extension for Socket that adds security metrics to your npm package pages and search results, protecting you from threats in open-source packages before you even install them.

Hal9: Chat with Your Data, Get Insights in Seconds
Chat with your enterprise databases using secure generative AI and empower business users in your team to do their own data analyses in seconds.    SPONSORED 

Glink
A changelog service that lets you display app updates, roadmaps, features, and even lets you add a searchable user forum to your product's page.

Documate
An open-source tool for embedding an AI chat dialog into your documentation site, to answer user questions based on your content.

MoonBit
An end-to-end programming language toolchain for cloud and edge computing using WebAssembly.

MoonBit

Nullstone
An easy-to-use developer platform that enables developers to quickly deploy any application. Includes a decent free starter plan for a single user.

Configu
A simple, modern, and generic standard for managing and collaborating software configurations.

Permit.io
Plug-and-play app-level authorization to enforce in frontend or backend and control via no-code UI elements.

Web Tools Directory
A set of online tools for doing various tasks that includes everything from generators, spell check, lorem ipsum, dummy images, and lots more.
 

Commercial Apps and Classifieds

These are commercial apps, affiliate links, PPC ads, and paid classifieds. Buy a Classified here.
Courier Inbox – APIs and SDKs to add a modern notification inbox to your web or mobile application.
Bytes – A JavaScript newsletter that's informative and entertaining, for all levels of JS devs.    AD 
Forminer – A seamless drag-and-drop form builder for React apps with a schema-first approach.
Figma to React Bootstrap - Gen-erate code-ready React-Bootstrap components from Figma designs.
Brilliant – Learn math and CS using interactive problem solving that's effective and fun.    AD 
CodeRabbit – An innovative, AI-driven platform that transforms how pull requests are reviewed.
Roll – AI-based video production studio in a mobile app for studio-quality remote video recording.

An X Post for Thought

Yeah, I'd say that's pretty irritating!
 
An X Post for Thought
 

Send Me Your Tools!

Made something? Reply to this email or send links via Direct Message on X @LouisLazaris (details here). No tutorials or articles, please. If you have any suggestions for improvement or corrections, feel free to reply to this email.
 

Before I Go...

Rooms is a platform that let's you create games and interactive experiences in the browser. You can browse and remix existing 'rooms' or create your own from the hundreds of items that become functional using code.

Thanks to everyone for subscribing and reading!

Keep tooling,
Louis
@LouisLazaris
PayPal.me/WebToolsWeekly

Older messages

Web Tools #531 - Video SDK, JS Utilities, Build Tools, VS Code

Thursday, September 21, 2023

Web Tools Weekly WEB VERSION Issue #531 • September 21, 2023 The following intro is a paid product review for Dyte, a platform that provides a powerful SDK to create immersive live video experiences

Web Tools #530 - DOM Parser, Frameworks, Media Tools, JS Plugins

Sunday, September 17, 2023

Web Tools Weekly WEB VERSION Issue #530 • September 14, 2023 Advertisement They Call it the “Tesla of Productivity Apps" Achieve maximum productivity with: Daily planning: Add or create a daily

Web Tools #529 - CSS Survey, JS Utils, ChatGPT, JSON/DB

Thursday, September 7, 2023

Web Tools Weekly WEB VERSION Issue #529 • September 7, 2023 Advertisement How To Adjust Image Size Without Distortion Resizing pictures is an easy task, but it gets terrifying when you deal with

Web Tools #528 - CSS Tools, Git/CLI, Uncats

Thursday, August 31, 2023

Web Tools Weekly WEB VERSION Issue #528 • August 31, 2023 Advertisement The Marketer's Guide to Composable Content Creating and publishing content shouldn't be that hard. Grab this marketer-

Web Tools #527 - JS Libraries, Testing Tools, Vue.js

Thursday, August 24, 2023

Web Tools Weekly WEB VERSION Issue #527 • August 24, 2023 The following intro is a paid product review for Stashpad, a cross-platform note-taking app with a developer-friendly UI. At some point many of

You Might Also Like

Issue #568: Random mazes, train clock, and ReKill

Friday, November 22, 2024

View this email in your browser Issue #568 - November 22nd 2024 Weekly newsletter about Web Game Development. If you have anything you want to share with our community please let me know by replying to

Whats Next for AI: Interpreting Anthropic CEOs Vision

Friday, November 22, 2024

Top Tech Content sent at Noon! How the world collects web data Read this email in your browser How are you, @newsletterest1? 🪐 What's happening in tech today, November 22, 2024? The HackerNoon

iOS Cocoa Treats

Friday, November 22, 2024

View in browser Hello, you're reading Infinum iOS Cocoa Treats, bringing you the latest iOS related news straight to your inbox every week. Using the SwiftUI ImageRenderer The SwiftUI ImageRenderer

iOS Dev Weekly - Issue 688

Friday, November 22, 2024

How do you get an app featured on the App Store? There's a new process, and it's great! 📝 View on the Web Archives ISSUE 688 November 22nd 2024 Comment Every developer, from solo indie devs to

Why Nvidia's CEO loves NotebookLM

Friday, November 22, 2024

I love my Alexa-enabled microwave; Best early Black Friday deals -- ZDNET ZDNET Tech Today - US November 22, 2024 Jensen Huang Even Nvidia's CEO is obsessed with Google's NotebookLM AI tool

Digest #151: Uber’s Migration, Terraform Tips, AMI Creation, and Helm Chart Scanning

Friday, November 22, 2024

Learn zero-downtime migration techniques, improve testing workflows, and master AMI creation. Plus, explore Terraform tools, Helm chart validation, and debugging AWS EC2 issues. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

SWLW #626: AI makes Tech Debt more expensive, The problem with most L&D strategies, and more.

Friday, November 22, 2024

Weekly articles & videos about people, culture and leadership: everything you need to design the org that makes the product. A weekly newsletter by Oren Ellenbogen with the best content I found

Warning: Over 2,000 Palo Alto Networks Devices Hacked in Ongoing Attack Campaign

Friday, November 22, 2024

THN Daily Updates Newsletter cover Generative AI For Dummies ($18.00 Value) FREE for a Limited Time Generate a personal assistant with generative AI Download Now Sponsored LATEST NEWS Nov 22, 2024

⚙️ Businesses increase AI spend to $13.8 billion

Friday, November 22, 2024

Plus: World leaders endorse digital green action plan ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌

Post from Syncfusion Blogs on 11/22/2024

Friday, November 22, 2024

New blogs from Syncfusion Building Oqtane Modules with Syncfusion Components for Blazor [Webinar Show Notes] By Carter Harris This blog provides show notes for our Nov. 14, 2024, webinar, “Building