Web Tools #490 - Math.random(), CSS Tools, Git/CLI, Uncats

Web Tools Weekly
WEB VERSION
Tools for Web Developers

Issue #490 • December 8, 2022

Advertisement
Use Full Power of MySQL with All-in-one IDE
dbForge Studio for MySQL is a full-fledged IDE for database development, management and administration. An intuitive interface and robust functionality let you streamline all database routines on MySQL and MariaDB and get rid of errors.

Download a 30-day Free Trial
dbForge Studio

If you're doing math calculations in JavaScript, I'm sure you know that there are some quirks to be aware of. Probably one of the most commonly-used math-related JavaScript methods is Math.random(). This comes in handy in a number of circumstances. Many functions have been written that utilizes this basic method, so I'll just go over a few things about it.

First of all, as you might know, Math.random() doesn't return a genuine random number but a pseudo-random number. Also, it returns a random number between 0 and 1. So by itself it's somewhat useless. It almost always has to be used as part of a larger function. But that's ok, because it serves as a building block. JavaScript doesn't need anything more than this.

console.log(Math.random()); // 0.1269400630808044

The other significant thing to note is that the 0 (lower bound) is inclusive, whereas the 1 (upper bound) is exclusive. This means the random number could be exactly zero but it will never be exactly 1. Of course, both are extremely unlikely to be selected.

Probably the most common snippet that uses Math.random() is one that gets a random integer between two numbers, inclusive. You can do this using something like the following:

function RandomInteger (min, max) {
  return Math.floor(Math.random() * (max - min + 1) + min);
}

console.log(RandomInteger(1, 20));

Try it on CodePen

As you can see, the above function assumes you want all decimal results to round down to the nearest integer. MDN's article has a slightly different version of this snippet, which initially forces the min value to round up and the max value to round down. This is a bit strange to me, so I prefer the above snippet, which always rounds down and does so after the number is obtained.

One final thing about Math.random() is a quote from the MDN article warning against certain uses:

"Math.random() does not provide cryptographically secure random numbers. Do not use them for anything related to security. Use the Web Crypto API instead."

Good warning, especially now as we see more and more apps requiring higher levels of security.

Now on to this week's tools!

 

CSS and HTML Tools

Use Full Power of MySQL with All-in-one IDE
dbForge Studio for MySQL is a full-fledged IDE for database development, management and administration. An intuitive interface and robust functionality let you streamline all database routines on MySQL and MariaDB and get rid of errors.     SPONSORED  

fontaine
A utility that provides an automatic font fallback, calculated based on font metrics, to help minimize cumulative layout shift (CLS).

Invisible Characters
50+ ready-to-copy-and-paste "invisible" characters (like the zero-width space), along with their Unicode code point values.

Metatags API
A dead-simple API to retrieve the title, description, and social image meta tags for a URL, completely free and open-source.

Pokémon Cards Holographic Effect in CSS
A collection of advanced CSS styles to create realistic-looking effects for the faces of Pokémon cards.

Wordmark
Enter a word or phrase and this tool will display the text using all the fonts currently installed on your computer (with permission for downloaded fonts).

Randoma11y
Online tool that generates a random, but fully accessible color combination for background color and foreground text color.

Randoma11y

Media Chrome
A set of custom elements (web components) for making audio and video player controls that look great in your website or app.

CSS Clothoid Corners
Online tool that generates CSS using the clip-path property, to give elements a more fun rounded corners look (similar to iOS app rounded corners).

uiGradients
A gallery of beautiful color gradients for inspiration. You can filter by color selection then copy individual colors or the full CSS.

Chroma
Browser extension that provides a set of color tools including an eyedropper, color picker, and palette generator.
 

Git, GitHub, and CLI Tools

The Faster Results Digital Journal
Backed by insight from the world's top institutions of learning, the Faster Results Digital Journal is packed with practical tips, inspiration and the proven structure you need to soar to new heights in your personal and professional life.   SPONSORED  

GPT3 Powered CLI
Get answers for CLI commands from GPT3 right from your terminal.

llama
A terminal-based file manager with fuzzy search, written in Go, that serves as a simpler and faster replacement for standard terminal file navigation.

aerc
An email client that runs in your terminal that's highly efficient and extensible.

gitlapp
A native iOS client for GitLab that helps you with project management, tackling issues, and staying on top of your TODOs with notifications — across different instances of GitLab.

Configure AWS Credentials
A GtiHub action to configure AWS credential environment variables for use in other GitHub Actions.

DVC
An open-source version control system for machine learning projects, built to make ML models shareable and reproducible and designed to handle large files, data sets, machine learning models, and metrics,. as well as code.

DVC

Directory Serve
A CLI library for sending and receiving files from your Android and iOS devices.

UNGH
A simplified, cached, and anonymous layer that allows you to have unlimited access to GitHub API.

Terrateam
A CI/CD platform that enables your entire team to make Terraform changes with GitHub pull requests. The free plan is pretty decent.

Schnell Console
A terminal for Windows, Mac, and Linux that also offers a browser extension for running commands from web searches and a VS Code extension to run files in the app.
 

The Uncategorizables

The Faster Results Digital Journal
Backed by insight from the world's top institutions of learning, the Faster Results Digital Journal is packed with practical tips, inspiration and the proven structure you need to soar to new heights in your personal and professional life.   SPONSORED  

ChatGPT-bot
Run your own GPTChat Telegram bot, with a single command. So you can take part in the latest crazy like all the cool kids.

Pixelfed
An ad-free and privacy-friendly open-source and decentralized photo sharing social media platform.

DuckDuckGo for Mac
A fast, privacy-friendly browser for Mac, from the makers of the privacy-friendly search engine.

Macpine
Create and manage lightweight Alpine VMs on macOS with seamless port forwarding, automatic file sharing, and more.

Flow
A browser-based, open-source EPUB reader with features like search, custom typography, highlights and annotations, share via link, cloud storage, and more.

Podman Desktop
An open source graphical tool enabling you to seamlessly work with containers and Kubernetes from your local environment.

Podman Desktop

devenv
Build, share, and run your local development environments with a single command, without containers.

Chartbrick
Create charts using your databases from Notion or Airtable. Visualize your data as insightful charts and embed them in Notion pages or anywhere else.

ILLA Cloud
A robust, open-source, low-code platform that integrates with any data source, for developers to build internal tools in minutes.

FrankenPHP
One of the few PHP tools I've shared, A modern PHP app server, written in Go, built on top of the popular Caddy web server.

Python Sandbox
And how about a Python tool? Things are getting wild. This is a JSFiddle-like environment for Python scripts.
 

Commercial Apps and Classifieds

These are commercial apps, affiliate links, PPC ads, and paid classifieds. Submit yours!
Tailscan – Build, design, and debug Tailwind projects visually inside your browser.
axeptio – Platform and service for a cookie consent popup that users will enjoy seeing.
Babbel – A language learning platform trusted by over 10 million subscribers worldwide.    AD
Noom – A science-based approach to weight loss, used successfully by millions.    AD
ApyHub – Powerful yet simple-to-use APIs that provide standard data and essential functionalities.
Analyzati – A multi-featured and privacy-focused alternative to Google Analytics.
Sip – A color picker for Mac that allows you to collect, organize, and edit colors.

A Tweet for Thought

To be fair, writing code isn't the same as writing content, but this meme on plagiarism is kind of funny.
 
A Tweet for Thought
 

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 into, or want to better at photography, you might want to check out GuruShots, where you can do daily photo challenges on the way to becoming a photo expert.

Thanks to everyone for subscribing and reading!

Keep tooling,
Louis
@WebToolsWeekly
PayPal.me/WebToolsWeekly

Key phrases

Older messages

Web Tools #489 - Array.values(), Media Tools, React, Git/CLI

Thursday, December 1, 2022

Web Tools Weekly WEB VERSION Issue #489 • December 1, 2022 Advertisement The Future Of Tech, Delivered Today. Join over 450K people by reading Emerging Tech Brew, the 3-times-a-week email delivering

Web Tools #488 - copyWithin(), JS Utilities, Databases, Uncats

Thursday, November 24, 2022

Web Tools Weekly WEB VERSION Issue #488 • November 24, 2022 Advertisement Hey Devs, Meet TelemetryHub! TelemetryHub is an observability tool that collects all your complex telemetry data into a single

Web Tools #487 - Autocomplete, CSS Tools, Build Tools, Uncats

Thursday, November 17, 2022

Web Tools Weekly WEB VERSION Issue #487 • November 17, 2022 Advertisement Turn Heads on Video with mmhmm Put yourself on screen with your slides. Move around for emphasis. Works with Zoom, Meet, and

Web Tools #486 - Future CSS, Frameworks, Media, React

Thursday, November 10, 2022

Web Tools Weekly WEB VERSION Issue #486 • November 10, 2022 Advertisement Get Early Access to TelemetryHub! TelemetryHub is an observability tool that collects all your complex telemetry data into a

Web Tools #485 - CSS Tools, Build Tools, React Native

Thursday, November 3, 2022

Web Tools Weekly WEB VERSION Issue #485 • November 3, 2022 Advertisement Stop Leaving Your // Todos for Dead 💀 Height's Code to Task feature automatically turns your // todo code comments into

You Might Also Like

Press, Pause 🗜️

Friday, May 10, 2024

Apple doesn't understand why people like hydraulic presses. Here's a version for your browser. Hunting for the end of the long tail • May 09, 2024 Press, Pause Beyond misunderstanding its iPad

Data Science Weekly - Issue 546

Friday, May 10, 2024

Curated news, articles and jobs related to Data Science, AI, & Machine Learning ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

Dell’s data breach

Thursday, May 9, 2024

Plus: Mistral AI is raising funds and Bumble's new strategy View this email online in your browser By Christine Hall Thursday, May 9, 2024 Welcome back to TechCrunch PM. Today I have for you a

💻 Issue 416 - The new disposable APIs in Javascript

Thursday, May 9, 2024

This week's Awesome JavaScript Weekly Read this email on the Web The Awesome JavaScript Weekly Issue » 416 Release Date May 09, 2024 Your weekly report of the most popular JavaScript news, articles

💻 Issue 409 - Making a 3D modeler in C in a week

Thursday, May 9, 2024

This week's Awesome .NET Weekly Read this email on the Web The Awesome .NET Weekly Issue » 409 Release Date May 09, 2024 Your weekly report of the most popular .NET news, articles and projects

📱 Issue 410 - FDA recalls defective iOS app that injured over 200 insulin pump users

Thursday, May 9, 2024

This week's Awesome iOS Weekly Read this email on the Web The Awesome iOS Weekly Issue » 410 Release Date May 09, 2024 Your weekly report of the most popular iOS news, articles and projects Popular

💎 Issue 416 - Ruby typing 2024: RBS, Steep, RBS Collections, subjective feelings

Thursday, May 9, 2024

This week's Awesome Ruby Newsletter Read this email on the Web The Awesome Ruby Newsletter Issue » 416 Release Date May 09, 2024 Your weekly report of the most popular Ruby news, articles and

💻 Issue 416 - Part 5: Building a Simple Web Server with Node.js

Thursday, May 9, 2024

This week's Awesome Node.js Weekly Read this email on the Web The Awesome Node.js Weekly Issue » 416 Release Date May 09, 2024 Your weekly report of the most popular Node.js news, articles and

💻 Issue 334 - Why React Query?

Thursday, May 9, 2024

This week's Awesome React Weekly Read this email on the Web The Awesome React Weekly Issue » 334 Release Date May 09, 2024 Your weekly report of the most popular React news, articles and projects

📱 Issue 413 - Swift’s native Clocks are very inefficient

Thursday, May 9, 2024

This week's Awesome Swift Weekly Read this email on the Web The Awesome Swift Weekly Issue » 413 Release Date May 09, 2024 Your weekly report of the most popular Swift news, articles and projects