Web Tools #465 - VS Code, Frameworks, Build Tools, React Native

Web Tools Weekly
WEB VERSION
Tools for Web Developers

Issue #465 • June 16, 2022

Advertisement
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.

Learn More
Retool

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.

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.

Preline

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.

Tekton

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.

Screen Sizes

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.

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 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 everyone for subscribing and reading!

Keep tooling,
Louis
@WebToolsWeekly
PayPal.me/WebToolsWeekly

Older messages

Web Tools #464 - Jamstack, JS Utilities, Git/CLI Tools

Thursday, June 9, 2022

Web Tools Weekly WEB VERSION Issue #464 • June 9, 2020 Advertisement Beautiful Link Previews Automagically Mugshot Bot creates stunning link previews automatically. No more fussing with design tools or

Web Tools #463 - JS Overkill, CSS Tools, Testing, Uncats

Thursday, June 2, 2022

Web Tools Weekly WEB VERSION Issue #463 • June 2, 2022 Advertisement Stepsize: Fix Technical Debt and Ship 2x Faster Create and view code issues directly from your VSCode and JetBrains editors. Add

Web Tools #462 - Media, SVG, Git/CLI, React

Thursday, May 26, 2022

Web Tools Weekly WEB VERSION Issue #462 • May 26, 2022 Advertisement Build a Predictable Path To Engineering Leadership The On Deck Engineering Fellowship is a curated community designed to help

Web Tools #461 - Mergify, Frameworks, React Tools, Uncats

Thursday, May 19, 2022

Web Tools Weekly WEB VERSION Issue #461 • May 19, 2022 The following intro is a paid product review for Mergify, a GitHub-based service for automating your pull requests and code merges. If you're

Web Tools #460 - CSS Tools, JS Utilities, JSON, Databases

Thursday, May 12, 2022

Web Tools Weekly WEB VERSION Issue #460 • May 12, 2022 Advertisement Retool is the Fast Way to Build an Interface for any Database Custom dashboards, admin panels, CRUD apps—build any internal tool

You Might Also Like

📧 Building Async APIs in ASP.NET Core - The Right Way

Saturday, November 23, 2024

​ Building Async APIs in ASP .NET Core - The Right Way Read on: m​y website / Read time: 5 minutes The .NET Weekly is brought to you by: Even the smartest AI in the world won't save you from a

WebAIM November 2024 Newsletter

Friday, November 22, 2024

WebAIM November 2024 Newsletter Read this newsletter online at https://webaim.org/newsletter/2024/november Features Using Severity Ratings to Prioritize Web Accessibility Remediation When it comes to

➡️ Why Your Phone Doesn't Want You to Sideload Apps — Setting the Default Gateway in Linux

Friday, November 22, 2024

Also: Hey Apple, It's Time to Upgrade the Macs Storage, and More! How-To Geek Logo November 22, 2024 Did You Know Fantasy author JRR Tolkien is credited with inventing the main concept of orcs and

JSK Daily for Nov 22, 2024

Friday, November 22, 2024

JSK Daily for Nov 22, 2024 View this email in your browser A community curated daily e-mail of JavaScript news React E-Commerce App for Digital Products: Part 4 (Creating the Home Page) This component

Spyglass Dispatch: The Fate of Chrome • Amazon Tops Up Anthropic • Pros Quit Xitter • Brave Powers AI Search • Apple's Lazy AI River • RIP Enrique Allen

Friday, November 22, 2024

The Fate of Chrome • Amazon Tops Up Anthropic • Pros Quit Xitter • Brave Powers AI Search • Apple's Lazy AI River • RIP Enrique Allen The Spyglass Dispatch is a free newsletter sent out daily on

Charted | How the Global Distribution of Wealth Has Changed (2000-2023) 💰

Friday, November 22, 2024

This graphic illustrates the shifts in global wealth distribution between 2000 and 2023. View Online | Subscribe | Download Our App Presented by: MSCI >> Get the Free Investor Guide Now FEATURED

Daily Coding Problem: Problem #1616 [Easy]

Friday, November 22, 2024

Daily Coding Problem Good morning! Here's your coding interview problem for today. This problem was asked by Alibaba. Given an even number (greater than 2), return two prime numbers whose sum will

The problem to solve

Friday, November 22, 2024

​ Use problem framing to define the problem to solve This week, Tom Parson and Krishna Raha share tools and frameworks to identify and address challenges effectively, while Voltage Control highlights

Issue #568: Random mazes, train clock, and ReKill

Friday, November 22, 2024

View this email in your browser Issue #568 - November 22nd 2024 Weekly newsletter about Web Game Development. If you have anything you want to share with our community please let me know by replying to

Whats Next for AI: Interpreting Anthropic CEOs Vision

Friday, November 22, 2024

Top Tech Content sent at Noon! How the world collects web data Read this email in your browser How are you, @newsletterest1? 🪐 What's happening in tech today, November 22, 2024? The HackerNoon