Tooling Icon

Tooling

Tooling and apps used to create and deliver awesome software.
97 Stories
All Topics

PHP github.com

A completely open source ngrok alternative

Expose is a beautiful, open source, tunnel application that allows you to share your local websites with others via the internet.

Since you can host the server yourself, you have full control over the domains that your shared sites will be available at. You can extend expose with additional features and middleware classes on the server and client side, to make it suit your specific needs.

Alan Shreve closed ngrok’s source code years ago, and every now-and-again an open source alternative pops on the scene. Add Expose to the list. It’s written in PHP and has a nice shine on it. But which of these SSH tunneling tools is best in class?

A completely open source ngrok alternative

CSS github.com

Preview minimal CSS frameworks with this drop-in switcher

Minimal CSS “frameworks” are on the rise. There are so many of them now that it’s hard to compare apples to apples. This’ll help.

This is a quick drop-in CSS switcher to allow for previewing some of the many minimal CSS-only frameworks that are available. See the demo or drop the switcher into your own page to see how different frameworks would look together with your content.

This project only includes minimal frameworks, in other words, boilerplate / classless frameworks that require no adjustment of the corresponding HTML and can be simply dropped into the project to provide a starting point for further design. No additional javascript, compiling, pre-processors, or fiddling with classes should be required for these to look good and be responsive.

Addy Osmani github.com

Automating web performance testing with Puppeteer 🎪

Addy Osmani has created an excellent resource for all developers interested in optimizing their web performance (which should be pretty much all of us).

You’ve probably heard of Puppeteer, which lets you control Chromium headlessly over the DevTools protocol. This repo shows you how to use Puppeteer to automate performance measurement, such as getting a performance trace for a page load:

const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  // Drag and drop this JSON file to the DevTools Performance panel!
  await page.tracing.start({path: 'profile.json'});
  await page.goto('https://pptr.dev');
  await page.tracing.stop();
  await browser.close();
})();

Which produces the results in the image below.

Automating web performance testing with Puppeteer 🎪

Design github.com

BlurHash – a very compact representation of a placeholder for an image

This is a very cool idea and the use case is described perfectly by the authors:

Does your designer cry every time you load their beautifully designed screen, and it is full of empty boxes because all the images have not loaded yet? Does your database engineer cry when you want to solve this by trying to cram little thumbnail images into your data to show as placeholders?

You give BlurHash an image and it gives you back a short string (20-30 chars) that represents the placeholder image. Store the string and send it along with the other data for the object and your client can decode the string into a placeholder image while the real image is loading over the network.

Lars Wikman underjord.io

A web development self-evaluation checklist

Lars Wikman:

I’ve been thinking a lot about inexperienced (junior, if you must) web developers and just how much there is to learn about programming in general but the web in particular. You often hear people say that you don’t need to know everything but you should have a solid foundation. Well, how do you establish a solid foundation and how do you know if you have one? How do you get introduced to all the relevant terminology and how do you find out what you haven’t learned yet?

To help with this, Lars created a self-evaluation checklist tool.

Slack Engineering Icon Slack Engineering

Deploys at Slack

Jonathan Chang and Michael Deng share all the details of the systems required to deploy at Slack.

Deploys require a careful balance of speed and reliability. At Slack, we value quick iteration, fast feedback loops, and responsiveness to customer feedback. We also have hundreds of engineers who are trying to be as productive as possible. Keeping to these values while growing as a company means continual refinement of our deployment system.

Deploys at Slack

Facebook Engineering Icon Facebook Engineering

Rome is an experimental JavaScript toolchain

It includes a compiler, linter, formatter, bundler, testing framework and more. It aims to be a comprehensive tool for anything related to the processing of JavaScript source code.

Rome aims to be a replacement for many existing JavaScript tools. We will, however, offer integrations for components in other tools. For example, using the Rome compiler as a plugin for another bundler.

This comes out of Facebook’s React Native team. It’s MIT licensed and was started by Sebastian McKenzie, who also authored Babel and Yarn.

Ops github.com

Quickly spin up local development environments with Lando

This tool is surrounded by mountains of marketing speak, but it does seem like it offers a quick way to spin up different dev environments, which is cool. It has built-in recipes for WordPress, Drupal, LAMP, MEAN, and more. Here’s how you get started on Drupal 7, for example:

lando init \
  --source remote \
  --remote-url https://ftp.drupal.org/files/projects/drupal-7.59.tar.gz \
  --remote-options="--strip-components 1" \
  --recipe drupal7 --webroot . \
  --name hello-drupal7

You can use these out of the box or start with a base language and mix in the things you need from there. Kinda like Docker Compose? Yeah, kinda like Docker Compose:

You can think of Lando as both an abstraction layer and superset of Docker Compose as well as a Docker Compose utility.

JavaScript snowpack.dev

With Snowpack you can build modern web apps without a bundler

No more waiting for your bundler to rebuild your site every time you hit save. Instead, every change is reflected in the browser instantly.

This relies on ESM (Mikeal gave a great rundown on the current state of things on a recent JS Party), so it’s not for everyone. The homepage has rundowns on who should use this, who should avoid it, and how to get started.

Brought to you by the fine folks at Pika.

Rust github.com

The Rust SQL Toolkit 🧰

SQLx is a modern SQL client built from the ground up for Rust, in Rust.

  • Truly Asynchronous. Built from the ground-up using async-std using async streams for maximum concurrency.

  • Type-safe SQL (if you want it) without DSLs. Use the query!() macro to check your SQL and bind parameters at compile time. (You can still use dynamic SQL queries if you like.)

  • Pure Rust. The Postgres and MySQL/MariaDB drivers are written in pure Rust using zero unsafe code.

Go github.com

A better way to handle, trace, and log errors in Go

This package is intended to give you more control over error handling via error wrapping, stack tracing, and output formatting. Basic error wrapping was added in Go 1.13, but it omitted user-friendly Wrap methods and built-in stack tracing. Other error packages provide some of the features found in eris but without flexible control over error output formatting. This package provides default string and JSON formatters with options to control things like separators and stack trace output. However, it also provides an option to write custom formatters via eris.Unpack.

0:00 / 0:00