Trending Projects is available as a weekly newsletter please sign up at www.iainfreestone.com to ensure you never miss an issue.
1. Lando
A local development and DevOps tool for all your projects that is fast, easy, powerful and liberating
Lando
A Liberating Dev Tool For All Your Projects
The local development and DevOps tool trusted by professional developers across the galaxy.
Free yourself from the mind-forged manacles of lesser dev tools. Save time, headaches, frustration and do more real work.
learn more | what is it good for? | wait, doesn't docker compose do this?
Support Lando
Lando is and always will be FREE and OPEN SOURCE. As such it relies on generous contributions from its community to fund its development. Join our list of list of great sponsors! by contributing.
GitHub Sponsors | Patreon | OpenCollective
Documentation
Getting Started
Introduction | CLI Usage | Installation
Recipes
Backdrop | Drupal 6, 7, 8, 9, and 10 | Joomla | Lagoon | Laravel | LAMP | LEMP | MEAN | Pantheon | Platform.sh | WordPress
Services
Apache | Compose | dotnet | Elasticsearch | Go | MailHog | MariaDB |…
2. Next.js Commerce
The all-in-one starter kit for high-performance e-commerce sites. With a few clicks, Next.js developers can clone, deploy and fully customize their own store.
Next.js Commerce
A high-perfomance, server-rendered Next.js App Router ecommerce application.
This template uses React Server Components, Server Actions, Suspense
, useOptimistic
, and more.
Note: Looking for Next.js Commerce v1? View the code, demo, and release notes.
Providers
Vercel will only be actively maintaining a Shopify version as outlined in our vision and strategy for Next.js Commerce.
Vercel is happy to partner and work with any commerce provider to help them get a similar template up and running and listed below. Alternative providers should be able to fork this repository and swap out the lib/shopify
file with their own implementation while leaving the rest of the template mostly unchanged.
3. Turbolinks
Turbolinks makes navigating your web application faster. Get the performance benefits of a single-page application without the added complexity of a client-side JavaScript framework.
turbolinks / turbolinks
Turbolinks makes navigating your web application faster
Turbolinks is no longer under active development
Please note that Turbolinks is no longer under active development. It has been superseded by a new framework called Turbo, which is part of the Hotwire umbrella.
Turbolinks
Turbolinks® makes navigating your web application faster. Get the performance benefits of a single-page application without the added complexity of a client-side JavaScript framework. Use HTML to render your views on the server side and link to pages as usual. When you follow a link, Turbolinks automatically fetches the page, swaps in its <body>
, and merges its <head>
, all without incurring the cost of a full page load.
Features
- Optimizes navigation automatically. No need to annotate links or specify which parts of the page should change.
- No server-side cooperation necessary. Respond with full HTML pages, not partial page fragments or JSON.
- Respects the web. The Back and Reload buttons work just as…
4. Deno
Deno is a simple, modern and secure runtime for JavaScript and TypeScript that uses V8 and is built in Rust.
Deno
Deno
(/ˈdiːnoʊ/, pronounced
dee-no
) is a JavaScript, TypeScript, and WebAssembly runtime with secure
defaults and a great developer experience. It's built on V8
Rust, and Tokio.
Learn more about the Deno runtime in the documentation.
Installation
Install the Deno runtime on your system using one of the commands below. Note that there are a number of ways to install Deno - a comprehensive list of installation options can be found here.
Shell (Mac, Linux):
curl -fsSL https://deno.land/install.sh | sh
PowerShell (Windows):
irm https://deno.land/install.ps1 | iex
Homebrew (Mac):
brew install deno
Chocolatey (Windows):
choco install deno
Build and install from source
Complete instructions for building Deno from source can be found in the manual here.
Your first Deno program
Deno can be used for many different applications, but is most commonly used to build web servers. Create…
5. G2
G2 is a visualization grammar, a data-driven visual language with a high level of usability and scalability. It provides a set of grammars, takes users beyond a limited set of charts to an almost unlimited world of graphical forms.
English | 简体中文
G2
G2 is named after Leland Wilkinson’s book The Grammar of Graphics and was profoundly inspired by it in the very beginning. Here are some resources you can begin with:
- Introduction - a brief overview and G2's motivations
- Examples - a large number of demos to learn from and copy-paste
- Tutorials - interactive case-driven guides of G2's core concepts
- API Reference - complete documentation for all visualization components
- Editor - an intelligent generation tool based on AntV. It utilizes AI to reduce the development cost of data visualization, and can quickly generate visual charts through natural language.
✨ Features
- Progressive Usage - The main objective of G2 is to help you get meaningful visualizations quickly with concise declarations and it infers the rest. But you can configure much more for complex and advanced situations.
- Declarative…
6. Tailwind Starter Kit
Tailwind Starter Kit a beautiful extension for TailwindCSS, Free and Open Source.
creativetimofficial / tailwind-starter-kit
Tailwind Starter Kit a beautiful extension for TailwindCSS, Free and Open Source
A beautiful extension for TailwindCSS.
Tailwind Starter Kit is Free and Open Source. It does not change or add any CSS to the original TailwindCSS framework. It features multiple HTML elements and it comes with dynamic components for ReactJS, Vue and Angular.
CSS Components
Tailwind Starter Kit comes with 120 Fully Coded CSS elements.
Pages
This extension also comes with 4 sample pages.
JavaScript Components
We also feature 16 dynamic components.
Table of Contents
- Versions
- Documentation
- Quick Start
- Custom themes and dashboards
- Browser Support
- Reporting Issues
- Licensing
- Useful Links
- Resources
Versions
FREE Dashboard
Angular Dashboard Page | HTML Dashboard Page | React Dashboard Page | VueJS Dashboard Page |
---|---|---|---|
Download Angular | Download HTML | Download React | Download Vue |
FREE Design System (UI Kit)
Angular Landing Page | HTML Landing Page | React Landing Page | VueJS Landing Page | NextJS Landing Page |
---|---|---|---|---|
Download Angular | Download HTML | Download React | Download Vue | Download Next |
Angular Login Page | HTML |
---|
7. Razzle
Create server-rendered universal JavaScript applications with no configuration
jaredpalmer / razzle
✨ Create server-rendered universal JavaScript applications with no configuration
Universal JavaScript applications are tough to setup. Either you buy into a framework like Next.js or Nuxt, fork a boilerplate, or set things up yourself. Aiming to fill this void, Razzle is a tool that abstracts all the complex configuration needed for building SPA's and SSR applications into a single dependency--giving you the awesome developer experience of create-react-app, but then leaving the rest of your app's architectural decisions about frameworks, routing, and data fetching up to you. With this approach, Razzle not only works with React, but also Preact, Vue, Svelte, and Angular, and most importantly......whatever comes next.
Getting Started
Visit https://razzlejs.org/getting-started to get started with Razzle.
Examples
Razzle has many examples, we might have one that fits your needs
See: The examples
Documentation
Visit https://razzlejs.org/ to view the documentation.
Getting help
If you get stuck, check out Razzle's GitHub Discussions. In addition, #razzle-afterjs on the Formium Community…
8. Nivo
nivo provides a rich set of dataviz components, built on top of the awesome d3 and Reactjs libraries
plouc / nivo
nivo provides a rich set of dataviz components, built on top of the awesome d3 and React libraries
nivo provides supercharged React components to easily build dataviz apps it's built on top of d3.
Several libraries already exist for React d3 integration but just a few provide server side rendering ability and fully declarative charts.
Installation
In order to use nivo, you have to install the @nivo/core
package and then choose
some of the scoped @nivo
packages according to the charts you wish to use:
yarn add @nivo/core @nivo/bar
Features
- Highly Customizable
- Motion/Transitions, powered by react-spring
- Interactive Components Playground
- Exhaustive Documentation
- SVG Charts
- HTML Charts
- Canvas Charts
- Server Side Rendering and HTTP API
- Patterns & Gradients
- Theming
- Responsive Charts
Discussion
Join the nivo discord community.
Packages & components
nivo is comprised of several packages/components, for a full list, please use the Components Explorer.
Guides
Backers
Donations are welcome to help improving nivo [Become a backer]
Open Collective Sponsors
…9. GraphQL Server
GraphQL Server for Express, Koa, Hapi, Lambda, and more.
apollographql / apollo-server
🌍 Spec-compliant and production ready JavaScript GraphQL server that lets you develop in a schema-first way. Built for Express, Connect, Hapi, Koa, and more.
@apollo/server
This
@apollo/server
package is new with Apollo Server 4. Previous major versions of Apollo Server used a set of package names starting withapollo-server
, such asapollo-server
,apollo-server-express
,apollo-server-core
, etc.
Announcement:
Join 1000+ engineers at GraphQL Summit for talks, workshops, and office hours, Oct 8-10 in NYC. Get your pass here ->
A TypeScript/JavaScript GraphQL server
Apollo Server is an open-source, spec-compliant GraphQL server that's compatible with any GraphQL client, including Apollo Client. It's the best way to build a production-ready, self-documenting GraphQL API that can use data from any source.
You can use Apollo Server as:
- A stand-alone GraphQL server
- The GraphQL server for a subgraph in a federated supergraph
- The gateway for a federated supergraph
Apollo Server provides a simple API for integrating with any Node.js web framework or serverless environment. The @apollo/server
package itself ships with a minimally-configurable, standalone web…
10. Boring Cyborg
A GitHub App built with Probot that automatically label PRs, issues and performs all the boring operations that you don't want to do.
kaxil / boring-cyborg
🤖 A Github bot to automatically label PRs, issues and perform all the boring operations that you don't want to do.
Boring Cyborg
🤖 A GitHub App built with Probot that automatically label PRs, issues and performs all the boring operations that you don't want to do.
Features
- Add labels based on the path of the file that are modified in the PR.
- Welcome new users to your project when they open their first Issue/PR or first merged PR by an automated comment.
- Insert Issue (Jira/Github etc) link in PR description based on the Issue ID in PR title.
- Verifies if commits/PR titles match the regular expression specified
- Check if a branch is up to date with the master when specific files are modified in the PR This is helpful when you desire the changes to be applied sequentially, for example, alembic migrations.
- Add reviewers to PR based on labels present on the PR. This is especially helpful if you are auto-assigning labels based on functional areas of ownership.
Usage
Trending Projects is available as a weekly newsletter please sign up at www.iainfreestone.com to ensure you never miss an issue.
If you enjoyed this article you can follow me on Twitter where I regularly post bite size tips relating to HTML, CSS and JavaScript.
Top comments (0)