Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

awesome-stenciljs

List of Awesome Web Components Built with StencilJS
https://github.com/mappmechanic/awesome-stenciljs

Last synced: 5 days ago
JSON representation

List of Awesome Components Made using StencilJS
- Design Systems
  - Telements - The Telements library offers a set of customizable UI components written with Stencil.js & TypeScript.
  - Duet Design System - A complete Stencil Based Design System component library which can be used with any SPA Framework like Angular/React etc.
- Component Libraries
  - RevoGrid - Powerful data grid library built with StencilJS for reactive excel like data representation. Millons of cells support and design themes included.
  - Calcite App Components - A collection of calcite components for building single page applications of certain types.
  - Fitness Dashboard Components - Fitness Dashboard Components built using StencilJS
  - D3-Stencil - An _archived_ library of web components over popular D3 graph library
  - Stencil Components
  - Stencil Components
  - Stencil Styled Components - components to StencilJS
  - Assister Chat
  - stencil-react
  - Bulmil
  - Aleph - Frame, AMI, StencilJS, and Ionic
  - wc-discord-message
  - Liquid Oxygen
  - AnywhereUI
  - Material Web Components - webcomponents)
  - BlazeUI Atoms
  - Assister Chat
  - NENT - binding, and declarative actions) without any scripting or a build process (https://github.com/nent/nent)
  - GOAT UI
  - Kickstand UI
- State Management
  - Stencil Hooks - A React-hooks API for stencil components
  - Stencil Store - Store is a lightweight shared state library by the StencilJS core team.
  - Stencil Redux - A simple redux connector for Stencil-built web components inspired by react-redux.
- Individual Components
  - Web Social Share - An amazing component to initiate sharing of a Web Page/URL at multiple Social Media Networks
  - Elsa Workflow Designer - An amazing component to design a Workflow visually and then export it.
  - Rating Component - An amazing and flexible star rating component with lots of options. There is a blog post how to create such a component too. [https://www.logisticinfotech.com/blog/custom-rating-component/](https://www.logisticinfotech.com/blog/custom-rating-component/)
  - Image Comparison Slider - Slider component to compare images before and after
  - Trombone Component - An amazing Trombone Component that makes music when you resize the window. It's A showcase on how StencilJs and the Web Audio API can collaborate to create awesome things.
  - Fast Morph
  - Web Photo Filter
  - Lazy Iframe
  - Loading Spinner
  - ST-Flippy
  - ST-Signature
  - Web Audio - audio>`, `<web-audio-source>`, `<web-audio-effect>`, `<web-audio-visualizer>`, `<web-audio-sequencer>`, and `<web-audio-debugger>`.
  - Smile To Unlock(Unique) - api-stu) to figure out how happy the person is.
  - Bruit.io - started).
  - Stencil-Apollo - A set of Web Components based on [Apollo Client](https://github.com/apollographql/apollo-client)
  - Stencil Mobx
  - Stencil Reflector - mobx)
  - Stencil Payment
  - Web Share - share).
  - ST Image
  - ST Muse - js).
  - FWT Slider
  - ST Fetch
  - Video Player
  - Cryptocurrency Data
  - SplitMe
  - Simple Buttons
  - Stencil Fragment
  - o-demo-bar - rango.github.io/orango-demo-tools/)
  - ST-Voice2Text
  - UI Avatar
  - IonPhaser
  - nice-anim
  - always-avatar
  - Katex Expression
  - web-complete - free, styleable autocomplete web component
  - word-spectrum
  - Mastodon Share Button
  - Remote Table
  - Spotify Login
  - fa-icon
  - STX-ABTest
  - Animatable
Boilerplates and templates
- Ionic official
- Community
  - Stencil Web Component Starter - A nice web components started which also tells how documentation is auto generated too.
Tools (CLIs, scripts, etc.)
- Ionic official
  - Create Stencil - and-templates)
- Community
  - Kompendium
Awesome IDE Specific Stencil Plugins/Snippets
- Visual Studio Code
  - Stencil Snippets - Stencil Snippets like st-component(generate component), st-prop(add new prop), st-event (add new @Event) etc.
  - Stencil Tools - Makes working with Stencil projects a breeze. Features new project, component, and test generators, snippets with automatic imports, and other helpful utilities.
What are Web Components ?
- ![Watch the video - k7aHkQE)
Miscellaneous
- Visual Studio Code
  - Stencil cheatsheet
Awesome Articles Related
- Visual Studio Code
  - Build a Fast Offline first PWA with StencilJS
  - Building a Modal Component using StencilJS via TDD
  - Building a web-component library using StencilJS
  - How Stencil Fit Into Micro Frontend Ideas - An interesting read to know about usability of stenciljs
  - Stencil with AngularJS(v1) - Using Stencil Component with AngularJS v1.
  - Faster Web Apps Using Stencil - An article with a small video explaining how you can develop faster web apps using StencilJS.
  - How I built Smile to Unlock - How Asim built SmileToUnlock using StencilJS components.
  - Stencil Todo with Redux - Awesome article explaining how to use stencil todo with redux.
  - Getting Started with StencilJS - Great resource to get started with StencilJS development.
  - Stencil components in React, Vue, and Angular - Step by step guide to use stencil components in the most popular JavaScript frameworks.
  - How Stencil Fit Into Micro Frontend Ideas - An interesting read to know about usability of stenciljs
List of Awesome Websites Built using StencilJS
- Visual Studio Code
  - CodeCraft Smile To Unlock Video - to-unlock) used in the videos of his course which allows users to view video only if they Smile :).
  - Venue Genie
  - Stencil with Admob (via Capacitor)
Curated By (Contributors)
- [mAppmechanic](https://twitter.com/mappmechanic):
  - https://linkedin.com/in/rahatkh
  - https://linkedin.com/in/rahatkh
- [Utwo](https://github.com/utwo)
  - http://utwo.ro
- [William M. Riley](https://github.com/splitinfinities)
  - https://twitter.com/splitinfinities

Programming Languages

TypeScript 50 JavaScript 6 CSS 2 HTML 2

Ecosyste.ms: Awesome

awesome-stenciljs

List of Awesome Components Made using StencilJS

Design Systems

Component Libraries

State Management

Individual Components

Boilerplates and templates

Ionic official

Community

Tools (CLIs, scripts, etc.)

Ionic official

Community

Awesome IDE Specific Stencil Plugins/Snippets

Visual Studio Code

What are Web Components ?

Miscellaneous

Visual Studio Code

Awesome Articles Related

Visual Studio Code

List of Awesome Websites Built using StencilJS

Visual Studio Code

Curated By (Contributors)

[mAppmechanic](https://twitter.com/mappmechanic):

[Utwo](https://github.com/utwo)

[William M. Riley](https://github.com/splitinfinities)