jfgodoy / awesome-solid-js

Curated resources on building sites with SolidJS, a brand new way(now 1.0) to build Javascript based interactive web applications. A very close looking cousin to React/JSX by syntax, and to Svelte by few important principles(compiler and fine-grained reactivity), it's a highly optimised way to deliver web applications with best-in-class performance.

Awesome Solid.js

A curated list of awesome things related to SolidJS

• Resources
  • Official Resources
  • External Resources
  • Community
  • Conferences
  • Podcasts
  • Videos/Screencasts/Twitch
  • Examples, Starter Kits, Explorations and Integrations
  • Tutorials
  • Blog Posts
• Components & Libraries
  • UI Components
  • Forms
  • Routing
  • SEO
  • Translation
  • State Management
  • Frameworks & Component Libraries
  • Testing
  • DX
  • Works with Solid

Resources

Official Resources

• Official Guide
• Official Tutorial
• API Reference
• GitHub Repo
• Release Notes
• Resource Index
• Playground

External Resources

• Coming Soon

Community

• Twitter
• Reddit
• Discord

Conferences

• Coming Soon

🗣️ Podcasts

• The Deep Dive Episode 4: Reactive frontend frameworks
• React vs Svelte vs Solid & MicroFrontends | Ryan Carniato On the hard choices all companies are facing right now with their websites, especially with the performance
• Ryan Carniato on SolidJSDiscussion on some of the similarities and differences between different UI frameworks, and talk about what things SolidJS has taken from react The Runtime Podcast

📹 Videos/Screencasts/Twitch

• React to Solid - Stream With Ryan Carniato
• Solid.js - the NEXT React? In-depth Code Analysis
• REACTive Context in Solid.js
• Solid.js - A Fast, Declarative, Compiled Web UI Library - Better than React.js?
• Solid Javascript UI Framework (Youtube Playlist)
• Hottest React Competitor
• React vs SolidJS, Fight!

🏃 Examples and Starter Kits

Official Examples

• Official Examples
• Todo MVC
• Hacker News
• Realworld

Community Examples

• Whiteboard
• Kauchicups
• TailwindCSS Layouts

Starter Kits

• Solid Templates(official)
• Vite + Solid + TailwindCSS Starter
• Solid Starter Kit

Tutorials

• Learn Solid(Official)
• Solid.js for X developer. A brief guide for Vue, Svelte and React developers to Solid.js.

Books

• Coming Soon_

✍️ Blog Posts

The Why's?

• Introducing the SolidJS UI Library
• SolidJS Official Release: The long road to 1.0
• SolidJS: The Tesla of JavaScript UI Frameworks?
• JavaScript Frameworks and Metagaming
• A Look at Compilation in JavaScript Frameworks
• JavaScript UI Compilers: Comparing Svelte and Solid
• A few reasons why I love Solid.js
• The Real Cost of UI Components Revisited
• Solid - The best JavaScript UI library?
• How we wrote the Fastest JavaScript UI Framework, Again!
• The Journey to Isomorphic Rendering Performance
• 5 Ways SolidJS Differs from Other JS Frameworks
• A Hands-on Introduction to Fine-Grained Reactivity
• Building a Reactive Library from Scratch
• Building JavaScript Frameworks to Conquer eCommerce
• SolidJS creator: JavaScript innovation isn’t slowing down

Powered by Solid

• 5 Reasons why we chose to transpile to SolidJS instead of React
• Front-end Studio powered by SolidJS

The Why not's?

• 5 Places SolidJS is not the Best

📦 Components & Libraries

UI Components

Table

• Solid Simple Table(NPM)

Icons

• Solid HeroIcons(NPM)
• Solid SVG(NPM)

Charts

• Solid Chart.js(NPM)

List

• Solid Virtual Container(NPM)

Miscellaneous

• Solid Transition Group(official)
• Solid Particles - Particles, confetti, fireworks and more animations
• Phosphor Solid

Slider

• Solid Slider(NPM)

Form

Rich-Text Editor

• Solid Quill(NPM)

Helpers

• Solid Form Action

Routing

• Solid App Router(official)
• Solid Typefu Router5

SEO

• Solid Meta(official)

Translation

• Solid i18n(NPM)

State Management

• Solid Zustand

Frameworks & Component Libraries

• Solid Blocks
• Lume

Testing

• Solid Jest(official)
• Solid Testing Library(official)

DX

• Solid Refresh (HMR)(official)
• ESLint for Solid
• Roll-up preset for Solid Libraries
• ESBuild Solid Plugin(NPM)

Works with Solid

• Astro
• Mitosis(playground)

more coming soon...