Web Tools #383 - JS Utilities, React Tools, Uncategorizables

Advertisement

Last week you may have noticed a slight difference in the look of this newsletter. The header section (above) with the logo and slogan has been updated to be more in line with a brand new redesign for the main Web Tools Weekly website.

While I can take credit for the front-end code, the design itself was done by a friend of mine who also did the redesigns for the previous newsletter layout and my blog. This recent website redesign was long overdue and certainly gives the website a more modern feel.

I particularly like what we did with the Advertising Plans page, which now has clear options on the three ad spots available.

I'm still working out some of the minor quirks and layout issues on various device sizes, but that's always a work in progress on many websites.

Hope you like the new design – feel free to hit reply and let me know what you think or if you find any problems!
 

Now on to this week's tools!

JavaScript Utilities

Get a Free .design Domain Name
Thinking of showcasing your design skills? Claim a free .design domain name for your website. .design is like .com but more relevant to what you do as a designer. Get 1 year free today! .design. A better domain for designers. sponsored 

JSX Lite
Uses a static subset of JSX so you can write components once and run everywhere. Compiles to Vue, React, Solid, Liquid, and more.

Ace
An older, but still maintained project. An embeddable code editor written in JavaScript that matches the features and performance of native editors like Sublime, Vim, and TextMate.

Operator Lookup
Not exactly a utility, but a quick reference to lookup and learn about almost any JavaScript operator.

Searchbox
Lightweight and performance focused search UI library to query and display results from Elasticsearch.

fcal.js
Extensive math expression evaluator library for JavaScript and Node.js.

Flicking
A reliable, flexible, and extendable JavaScript carousel, compatible with React, Angular, Vue, and Nuxt.js.

Human Interval
Human-readable interval parser for JavaScript. Converts words written in English to numbers by using node-numbered.

fflate
High performance (de)compression in an 8kB package. Claims to be "the fastest, smallest, and most versatile pure JavaScript compression and decompression library in existence."

Locomotive Scroll
A simple scroll library, built on top of an older library called virtual-scroll, that provides smooth scrolling with support for parallax effects, toggling classes, and triggering event listeners.

TypeSwift
Swift-like extensions for JavaScript and TypeScript.

Butter Slider
A smooth, simple, lightweight, vanilla JS, dependency-free drag and hold slider, made for easy setup.

The Uncategorizables

Tech Productivity Newsletter
A brief weekly newsletter sent out every Monday that features productivity tools and articles on efficiency, well-being, remote work, and more.   promoted

OptimizeWP
WordPress speed optimization and maintenance service to help SEO and conversion rates.

ScrapeOwl
Simple and affordable web scraping API. Focus on scraping the data you need, not on proxies, headless browsers, and HTML parsing.

Atkinson Hyperlegible Font
A free typeface from the Braille Institute that boasts greater legibility and readability for low vision readers.

astroip.co
IP geolocation and threat intelligence API. Enrich any IP address with geolocation data, ASN and hostname information, enforce GDPR compliance, assess potential risks, and more.

Etebase
Makes it easy to build end-to-end encrypted applications by taking care of the encryption and its related challenges.

File Converter
Online file converter with no file size limit and ability to convert to and from dozens of formats, as many as you want.

ibis
A PHP tool that helps you write eBooks in markdown and convert to PDF.

Anima
The first continuous design to development platform. Go from high fidelity prototypes to developer friendly code that engineers can build upon quickly.

Lyket
Embed a clap/like button on your website that's not tied to any social network and allows you to keep your own data.

Talon
Native Windows, Mac, or Linux app for powerful hands-free input with voice control, eye tracking, and more.

Infinity Search
An open source search engine with a special focus on privacy and efficiency.

TechStax
Free developer portfolio (kind of like Carbonmade for software) with a card-based layout and support for markdown, code highlighting, and repl.it integration.

React Tools

react-s3-uploader
React component that renders an HTML file input and automatically uploads to an S3 bucket.

react-elastic-carousel
A flexible and responsive carousel component for React with element resize support (true responsiveness) and support for right-to-left languages.

react-qr-svg
React component for rendering QR codes in SVG format for better clarity in printed QR codes.

React Frontload
A library to load and manage data inline in React components that works on both client and server.
 
use-tweaks
React component for Tweakpane, and older project that lets you create GUIs for fine-tuning parameters and monitoring value changes in apps. The demo is really cool!

React Sortable Tree
Drag-and-drop sortable component for nested data and hierarchies.

react-gl-transition-image
Lazy load and transition your React images with WebGL OpenGL Shading Language (GLSL).

Radioactive State
A fast state management solution for React with the ability to directly mutate state at any level to update a component, always fresh state, and reactive bindings for inputs, and lots more.

ReactReparenting
Simple, intuitive and configurable tools to manage "reparenting" (i.e. moving a component from one parent to another) with React.

react-sortablejs
A React component built on top of the mature drag and drop library, Sortable.

react-cookie-consent
A small, simple and customizable cookie consent bar for use in React apps.
 

A Tweet for Thought

Finally, an original programming joke (at least it's one I haven't heard...)

 

Send Me Your Tools!

Made something? Send links via Direct Message on Twitter @WebToolsWeekly (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...

If you're looking for a new at-home hobby for the winter, and you've wanted to get into crypto/asset trading, you might want to try out TradingGym, an app that helps you practice asset trading in a live-like environment.

Thanks to everyone for subscribing and reading!

Keep tooling,
Louis
@WebToolsWeekly
PayPal.me/WebToolsWeekly