Tools for Web Developers

Issue #412  (Data Structures, Git/CLI, Media, Jamstack)


Advertisement
Engineering Leaders Need to Know How to Structure a Remote Hiring Process
A new era of remote work suddenly arrived and managers need to enhance their recruiting process if they want to win the best talent for their companies. This guide shows you how GitLab, Zapier and other companies build thriving remote teams. Download Revelo’s free eBook.
Download it now!
Revelo

If you want a starting point for some heavy-duty reading on the topic of implementing data structures in JavaScript, this article by Neha Soni should do the trick.

Data Structures in JavaScript

As one of the comments points out, the article title is a bit misleading. These aren't data structures that are native to JavaScript but the article discusses ways to implement data structures. The ones discussed are:

  • Arrays (the only one native to JS)
  • Linked Lists
  • Stacks
  • Queues
  • Trees
  • Graphs
  • Hash Tables
The article is far from an exhaustive discussion of these structures, and it's more focused on concepts then on code. But I like stuff like this as a starting point because it opened my eyes to some new things.

Each section includes some further reading on each of the structures and those resources include some practical code examples along with an in-depth discussion of each of the structures. The conclusion also has some links for further reading on the topic.


Now on to this week's tools!

Git, GitHub, and CLI Tools

Engineering Leaders Need to Know How to Structure a Remote
Hiring Process

A new era of remote work suddenly arrived and managers need to enhance their recruiting process if they want to win the best talent for their companies. This guide shows you how GitLab, Zapier and other companies build thriving remote teams. Download Revelo’s free eBook.  sponsored 

Cake
A really thin, drop-in replacement/wrapper around Gnu Make that runs all of your targets inside of a development Docker/Podman container.

act
Run your GitHub Actions locally for faster feedback and as a replacement for your Gnu Make file.

osmos::feed
An RSS reader running entirely from your GitHub repo with free hosting via GitHub Pages and content updates via GitHub Actions.

zx
An alternative to Bash. Provides useful wrappers around Node's child_process, escapes arguments and, gives sensible defaults.

ShellCheck
Online tool to find bugs in your shell scripts.

Back Git Up
Take reliable backups of your code. Currently supports Bitbucket and GitHub, and one repository is free.

Github Blog
Turn your GitHub issues into a CMS for your blog, using the various features of GitHub issues to manage the content.

Git Command Explorer
A nice little interactive tool to quickly find the syntax for Git commands.

Git Command Explorer

bash_unit
An unit-testing framework for Bash.

git-notify
Allows you to embed announcements into your Git commit messages to communicate important updates to your team.

theme.sh
A script to let you set your terminal theme, with 270+ preloaded themes.

GumHub
Sell access to your GitHub repos via Gumroad. Not free and there aren't a lot of details before you buy.

htop
A cross-platform interactive process viewer that allows scrolling the list of processes vertically and horizontally to see info like memory and CPU consumption.

Media Tools (Images, SVG, Icons, etc)

Mediamodifier Mockups
Don't waste time creating mockups from scratch. Use Mediamodifier's intuitive drag-and-drop tools and thousands of pre-built templates to make beautiful designs and product mockups in seconds.  sponsored 

CandyGraph
A flexible and fast-by-default 2D plotting library tuned for rendering huge datasets on the GPU at interactive speeds.

Codeimg.io
Online tool to create images of code snippets for social media or presentations. You can choose from various settings to define the loo then download as JPG.

Assetroulette
Randomized placeholder assets including images, memes, Unsplash images, or even a random CSS file to apply to the page.

compressImage.io
A fast, client-side, online JPG or PNG compressor with desired quality settings and an option to convert to WebP.

Globe 3D
Upload an image to convert it to an interactive 3D Globe, or use as a Figma plugin.

Boring Avatars
A tiny React library that generates custom, SVG-based, round avatars from any username and color palette.

Iconoir
A library of 900+ open source SVG icons, searchable and available as webfonts or for React, Framer, and Figma.
 
Iconoir

Flagpack
260+ open source flag icons for Sketch, Figma, or install via CLI for React, Vue, or Angular.

PINTR
Online tool to create single-line SVG illustrations from a photo. Kind of weird, but try it out to see what they mean by "single-line".

WebM.to
A WebM file converter that lets you convert a WebM video file to or from pretty much any format.

SVG Crop
Drop or upload an SVG to remove blank space from around the SVG instantly.
 

Jamstack, CMS's, Site Builders, etc.

Mediamodifier Design Maker
A quick, easy, and cost-effective way to create professional-looking materials of all kinds. No need for services like Fiverr for quick designs – just use Mediamodifier's drag-and-drop builder along with their huge selection of design templates.  sponsored 

Loopple
Create Bootstrap-based dashboards using a drag-and-drop interface.

Welcomments
A Jamstack-friendly solution for static comments on blogs and pages. Not free but reasonably priced.

imml
Create minimalist, blazing fast no-JavaScript web pages from a single, portable Markdown file.

Dragit
A modern drag-and-drop editor for building HTML emails for marketing. Free version includes only the free templates.

Torus Kit
Create Bootstrap-based animations and interactive effects, without writing any code. Free plan has limited components and utilities.

Harold
A static site and blog generator based on Handlebars and Markdown, with a built-in search engine and ready-to-use responsive templates.

Sergey
A tiny static site generator designed to sit atop your existing HTML and can be quick-started via Netlify deployment.
 
Sergey

Frontecs
Not free. Make your static website editable like a Word document in seconds.

pxCode
Tool to quickly turn a design asset (Sketch, Figma, etc) into code (HTML, React, etc).

Coolify
An open-source, hassle-free, self-hostable Heroku and Netlify alternative.

HexoPress
A tiny blogging platform. Write your posts in Google Docs, put them under a folder in your Google Drive, and publish a blog based on them.
 

A Tweet for Thought

This is the only correct answer to what everyone's first version control system was.

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 concerned about how popular apps are using your data, someone who goes by the name Pluja has put together Awesome Privacy, a GitHub repo of categorized alternatives to popular services that aren't privacy-friendly.

Thanks to all for subscribing and reading!

Keep tooling,
Louis
webtoolsweekly.com
@WebToolsWeekly