 | | Issue #342 • February 6, 2020 | | This week I did something I hadn't done in a while. I expressed a strong opinion about something being discussed in the community (the horror!). I have to admit, in recent years I've shied away from being too opinionated on certain topics, partly because it's easy to be wrong in cases like this and it's easy to divide the community for little gain.
But in this case, I felt like it was important to speak up. Below are links to the posts in question, all about the topic of "CSS4" and whether or not that term would be good for the industry (in particular, evangelizing CSS to not-so-techy audiences). Fortunately, this discussion has already disclosed what might be a good compromise: A yearly versioning of the language similar to what's being done with ECMAScript (i.e. "CSS 2021", "CSS 2022", etc). Interestingly, according to Wikipedia, this sort of "snapshot" versioning of CSS has already kind of happened. Though I'm not sure if that's the same thing that's being proposed by Amelia in the comments of Chris's article. Whatever the case, I encourage you to read the different posts and the comments. I think this has opened up an important discussion on what CSS should look like going forward.
Now on to this week's tools!
| React Tools The New Tab Page You’ll Actually Use
The minimal new tab page you’ll actually use. Chrome and Firefox extensions available. sponsored
material-table
A React data table component based on Material-UI (a React components library).
react-range
Accessible range input component with a slider that can be custom styled and includes lots of different built-in styles.
react-colorpickr
A simple color picker component for React.
React PDF Viewer
A PDF viewer component for React 16.8+, written in Typescript.
React Dropdown Select
Customizable dropdown select/multi-select component for React with custom render callback props to override inner components.
React Carousel Image Gallery
React carousel image gallery component with thumbnail support.
React Tabs
An accessible and easy to use tab component for React.
react-spring-slider
A carousel/slider component that uses react-spring (a React physics library) under the hood for the animations.
ReactIntersectionObserver
A fully declarative React component acting as a wrapper for the IntersectionObserver API.
use-simple-state
A simple, lightweight (3kb), dependency-free state manager for React, built using hooks.
Rodal
A React modal window component with animations (zoom, fade, flip, rotate, etc).
SWR
A React Hooks library for remote data fetching based on `stale-while-revalidate`, an HTTP cache invalidation strategy.
chart-race-react
Seamless and fully customizable bar chart component for React that animates the bars in a "race"-like format. | Front-end Frameworks   | Graphile Starter
An opinionated quick-start project for full-stack application development in React, Node.js, GraphQL and PostgreSQL.
Proton Native
Now at version 2+. Create cross-platform desktop applications through a React syntax, on all platforms. Same syntax and components as React Native.
Buildo React Components
A collection of reusable React components that integrates with a webpack workflow and is easily customizable and flexible.
Elastic UI framework
An internal design library in use at Elastic for their products and brand.
CoreUI for Vue.js
An open source Vue.js and Bootstrap 4 based admin template.
Tailwind Starter Kit
Open source starter for Tailwind that features multiple HTML elements and comes with dynamic components for React, Vue, and Angular.
Vue Component Development Kit
A small set of components, plugins, and mixins for Vue.
Ant Design
An enterprise-class UI design language and React UI library.
Userbase
Create secure and private web apps using only static JavaScript, HTML, and CSS. The easiest way to add user accounts and data persistence to your static site.
Redwood
An opinionated, full stack, serverless web application framework to build JAMstack applications with ease.
production-ready-webapp-boilerplate
Very opinionated and well-structured production-ready modern web application boilerplate (SPA with SSR to boost SEO).
Microfronts
Polyglot front-end solution for running multiple frameworks as one. | JSON, GraphQL, Databases, etc. | | @rehooks/local-storage
React hook for enabling synchronization with local-storage.
graphql-react
A lightweight and powerful GraphQL client for React using the Context and Hooks APIs.
Mongoose
Elegant MongoDB object modeling for Node.js.
JSON Crew
An extensible JSON viewer, editor, formatter, and validator, based on Monaco Editor.
Mighty Merge
Instantly merge multiple CSV and TSV files into one master file. Includes vertical and horizontal merging with smart headers enabled.
pg-structure
Reverse engineer a PostgreSQL database as a detailed JavaScript object.
EasyDB
A one-click database. No server required.
GraphQuill
VS Code extension that performs GraphQL API endpoint testing in VS Code. Removes the need to switch between VS Code and GraphiQL, Postman, or other API tool.
Stein
Use Google Sheets as your no-setup data store. Build fast and get a familiar interface for managing the data.
DataLoader
A generic utility to be used as part of your application's data fetching layer to provide a simplified and consistent API over various remote data sources such as databases or web services via batching and caching. | |
0 коммент.: