Issue #465  (VS Code, Frameworks, Build Tools, Mobile)06/16/22

I know many of you that read this newsletter use Visual Studio Code (VS Code) as your primary code editor. Over the last 5 years or so, VS Code has exploded in popularity. I remember years ago TextMate was a popular choice. Then Sublime Text took over as the front-runner for some time. Maybe you used one of those and still do.

I'm sure many of you prefer one of the JetBrains products like WebStorm or IntelliJ IDEA, or the super-popular Vim that's been around since 1991. But like I said, it really seems like VS Code has taken off over the last little while, especially in the front-end development niche.

In this newsletter, I've regularly included a section featuring text editors, IDEs, code playgrounds, and similar tools. I found that most of the tools I was finding lately in that category were VS Code-related extensions.

Since I have plenty of stuff to include here without that category, I decided that VS Code would be the perfect topic to have its own newsletter: VSCode.Email.

As many of you have already noticed, I've been promoting it a little bit in the latter part of this newsletter. I thought I'd give it a proper shout-out in the intro here so you can consider if you want to subscribe to that one as well.

Of course, the last thing the world needs is Yet Another Weekly Newsletter. But I promise, this one is different from Web Tools Weekly and is relatively brief. I've already sent out 8 issues so far that include:

• A quick tip in the intro on using and customizing VS Code
• A short list of VS Code tools and extensions
• A brief list of VS Code-related articles or other resources
• A final brief list of tools and articles for other IDEs and editors

You can check out the archive to see what's been published so far. But generally, each issue is no more than about 10-12 links in total along with the introductory tip.

Of course, if you don't want to flood your inbox with more emails, you can always periodically just check out the archives, follow the Twitter account (which automatically Tweets each week's new issue), or subscribe to the MailChimp RSS feed for the archive.

This means if you still want code editor-related tools and new extensions for VS Code, you won't find those here anymore. All of that will be included exclusively in VSCode.Email. Hope you enjoy it!
 

Now on to this week's tools!

Front-end Frameworks

Build Internal Tools 10x Faster with Retool
Retool is the fast way for developers to build and share internal tools. Teams at thousands of companies like Amazon, DoorDash, Peloton, and Brex collaborate around custom-built Retool apps to solve internal workflows.  SPONSORED 

Formation
20+ open-source and customizable interactive components, written in TypeScript and WCAG 2.0 compatible.

Component Party
A playground of sorts that lets you get a quick overview of the syntax for the various features different libraries like React, Vue, Svelte, Angular, and more.

Nx Serverless
An opinionated monorepo starter for Node.js serverless applications with first-class TypeScript support, CORS, ESLint, Jest, and more.

LiveTerm
A highly customizable, easy-to-use, and minimal website template, powered by Next.js, for building terminal-style websites in minutes.

Preline
An open-source set of 250+ prebuilt UI components based on Tailwind CSS and compatible with React and Vue.

Plasmo
A framework and toolkit for building browser extensions with first-class React and Typescript support.

Workbench
A design system and component library for Gusto, an HR and payroll platform.

NextJS FullStack Starter
A starter for Next.js full-stack projects with Tailwind, Zustand for state management, Prisma and Postgres for database, and lots more.

Cirrus CSS
An SCSS framework of beautiful pre-built components and utility classes, designed for rapid prototyping.

eth-nextjs-boilerplate
An Ethereum, Next.js, and React boilerplate for building decentralized apps ("dapps") that also uses wagmi, Ethers, and Chakra UI.

Instagram MERN
A full-stack Instagram clone using the MERN stack and Socket.io. Also uses Tailwind, Redux, Material UI, and more.

Build Tools, Bundlers, etc.

The Modern Guide to Financial Tech App Development
Learn how to build financial tech (fintech) applications faster, with lower maintenance costs, using charts and dashboards with this free guide. Make better decisions by building and deploying sophisticated-looking, elegant, and enterprise fintech apps.    SPONSORED 

Ratchet
A Go-based tool for improving the security of CI/CD workflows by automating the process of pinning and unpinning upstream versions. Like npm, pip, or Yarn, but for CI/CD workflows.

wds
A reloading dev server, similar to ts-node-dev, for server-side TypeScript projects. Compiles TypeScript fast and on-demand and restarts the server when things change.

Create Ultra App
A build tool for creating projects using Ultra, the SSR React framework in Deno.

relative-deps
Introduces an additional dependency section in your package.json, called relativeDependencies, that contains paths to local sources of any dependency, that will be built and installed over the publicly available versions, when needed.

Shuttle
Serverless for Rust. A web application platform that uses traits and annotations to configure your back-end deployment – including databases.

Tekton
A powerful and flexible open-source framework for creating CI/CD systems, to build, test, and deploy across cloud providers.

Putout
A pluggable and configurable code transformer based on Babel with built-in ESLint that keeps your code clean and readable, with support for JavaScript, JSX, TypeScript, YAML, JSON, and Markdown.

Lightview
Small, simple, powerful web UI and micro front end creation that includes concepts from Svelte, React, and Vue combined into a single small tool.

dependency-review-action
A GitHub Action for detecting vulnerable dependencies in your pull requests.

Wireit
From Google, currently in alpha. CLI tool that upgrades your npm scripts to make them smarter and more efficient.

Changesets
A TypeScript-based tool to manage versioning and changelogs, with a focus on multi-package repositories.

React Native and Mobile

The Modern Guide to Financial Tech App Development
Learn how to build financial tech (fintech) applications faster, with lower maintenance costs, using charts and dashboards with this free guide. Make better decisions by building and deploying sophisticated-looking, elegant, and enterprise fintech apps.    SPONSORED 

react-native-bignumber
A fast Big Number library for React Native, made for crypto apps and wallets.

react-native-bars
React Native components to control your app status and navigation bars.

react-native-location
Native GPS location support for React Native that includes some additional features over native Geolocation.

React Native Reorderable List
A drag-and-drop re-orderable list for React Native applications, powered by Reanimated, the popular React Native animation library.

React Native Figma Squircle
Figma-flavored "squircles" (squares with rounded corners) for React Native.

Screen Sizes
A one-stop resource for looking up and comparing apple devices so you can get info on screen resolution, OS support, features, and more.

react-native-select-dropdown
A highly customizable dropdown/select picker/menu component for React Native.

CodeSandbox for iOS
A full-fledged development environment that brings the power of modern JavaScript development to your iOS device. Use your iPhone or iPad to develop and run Node.js apps or collaborate in real-time with others.

toggle-switch-react-native
A toggle-switch component for React Native with lots of API options for different customizations.

react-native-mask-text
A library to mask text and input components in React Native and Expo.

Commercial Apps and Classifieds

These are commercial apps (i.e. not free or limited free plan), paid classifieds, and affiliate links.

Digger – One-click full-stack AWS deployment for just about any stack.

Windo – A simple Shopify alternative to create beautiful online stores.

Emerging Tech Brew – The future of tech in our 5-minute newsletter.    AD 

Boostack – Boilerplate starter kit to build SaaS apps with the MEVN stack.

TinyStacks – Build, operate, and scale your back end on AWS.

ScraperBox – Web scraping API to scrape pages without getting blocked.
 

A Tweet for Thought

If you're just getting started in development (or even if you're not!) I'm sure you'll enjoy this thread by Pratham where he shares 9 points for junior developers.

 

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 enjoy discovering new music that's not super-mainstream, from a variety of genres, you might want to check out Here Before A Million. As the name implies, it features a playlist of YouTube songs/videos that are under a million views. Any songs that reach a million get removed from the list.

Thanks to all for subscribing and reading!

Keep tooling,
Louis
webtoolsweekly.com
@LouisLazaris