Issue #316 (CodePen Collections, Jamstack, React, Uncats)08/08/19
Over the past 6 months or so I've stopped using JS Bin for my demos and experiments and I've been more regularly using CodePen to mess around with various front-end coding features, usually JavaScript and DOM stuff (which I often include in this newsletter's intro).
Most of my CodePen demos are now categorized into CodePen collections, many of which are referenced in articles and e-books that I've published in various places. Here's a list of the collections:
Although nearly all of these demos have been associated with an article either here in this newsletter or elsewhere, the collections stand alone as a nice guide to learn various web platform features. So feel free to poke around there to pick up a few tidbits on lesser-known JavaScript and DOM stuff.
And if you're interested in full explanations for most of the above demos, you'll find those in my JS/DOM e-books bundle, which I've recently updated to use ES6+ syntax.
Now on to this week's tools!
|
Site Builders, CMS's, Static Sites, etc.
The Complete Guide to Optimizing WordPress Site Speed in 2019
What factors should be considered when optimizing a WordPress site's performance? This post looks at Hosting, CDNs, Caching, Minification, GZIP, and more. sponsored
Tumult Hype
Now at version 4+. Create beautiful interactive web content and animations that work on desktops, smartphones, and tablets, no coding required.
CoffeeCup Site Designer
One of the oldest website building software companies has released version 4 of its Responsive Site Designer (details here).
Fixture
Website builder that helps you build sites 5x faster than the competition, with Amazon S3 integration and Serverless Architecture.
VuePress
The Vue-powered static site generator is now at version 1+(details).
Storyblok
The only headless CMS with a visual editor. Has the user experience of a page builder with a modern headless architecture.
Sigle
A beautiful decentralized and open source blog maker.
Hylia
A lightweight starter kit for Eleventy (the static site generator), with Netlify CMS pre-configured to one-click install a progressive, accessible blog in minutes.
Kirby
Now at version 3+ (details). The file-based content management system. Combine forms, galleries, articles, spreadsheets and more into an amazing editing experience.
Gridbox
Advanced Bootstrap builder with pre-built components, visual designer, and in-built code-editor.
WordPressify
A build system designed to automate your WordPress development workflow.
|
React Tools
ScriptUI
Lets you write React components without JSX. Easy to read and no build or transpilation required.
React Physics Dragger
A simple, no-frills horizontal dragger/slider with physics.
Aquaman
Allows you to build composable, declarative flows with Redux. Can be helpful if you need to guide users through a series of steps through an application.
BaseTable
A React table component to display large data set with high performance and flexibility.
Haunted
React's Hooks API implemented for web components.
Styled System
Responsive, theme-based style props for building design systems with React.
react-teleporter
Teleport React components in the same React tree. In a complex app, you may have to configure one part of the application from another.
React Move
Now at version 6+ (details). Beautiful, data-driven animations for React. Just 3.5kb gzip'd.
Unstated Next
200 bytes to never think about React state management libraries ever again.
React Virtuoso
A simple, easy to use virtualized list component for React that can render huge data sets.
with-react-hooks
Add support for React Hooks in your class components.
|
The Uncategorizables
Tech Productivity Newsletter
Looking for productivity tools? I've moved most of them to my new brief weekly newsletter on productivity in tech. promoted
Lunacy
The free Photoshop and Sketch alternative for Windows is now at version 4 (details).
webmention.app
A platform agnostic service that will check a given URL for links to other sites, discover if they support webmentions, then send a webmention to the target.
i18ns
Internationalization tools for web and mobile apps.
PSPDFKit
Framework for working with PDF files. The SDK provides first-rate PDF solutions with features like annotating, signing, and form filling.
Plugserv
An ad server for your own projects that lets you shamelessly plug personal projects across your own sites.
Ananas Analytics Desktop
A hackable data integration and analysis tool to enable non-technical users to edit data processing jobs and visualise data on demand.
Chitter
Add a chat "inbox" to your website to get user feedback and provide customer support.
SSL Configuration Generator
An easy-to-use secure configuration generator for web, database, and mail software.
Campaign Builder
Ad builder to generate thousands of different ads, ad groups, and negative keywords in seconds.
webext
An extension for Firefox and Chrome to add comments to any URL.
Swagger
Simplify API development for users, teams, and enterprises with the Swagger open source and professional toolset.
|
A Tweet for Thought
Emma Wedekind on the importance of spending time building stuff and not just watching/reading.
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...
My Internet Explorer is a small IE historical archive of sorts, providing info (and downloads!) for all versions of the world's most hated browser, including IE1, released in 1995.
Thanks to all for subscribing and reading!
Keep tooling,
Louis
webtoolsweekly.com
@LouisLazaris
|
|
