{"id":13415824,"url":"https://github.com/skatkov/awesome-stimulusjs","last_synced_at":"2025-04-13T23:32:38.370Z","repository":{"id":43211361,"uuid":"241238936","full_name":"skatkov/awesome-stimulusjs","owner":"skatkov","description":"Modestly awesome list of StimulusJS related content.","archived":true,"fork":false,"pushed_at":"2024-02-20T11:27:51.000Z","size":69,"stargazers_count":814,"open_issues_count":3,"forks_count":34,"subscribers_count":26,"default_branch":"master","last_synced_at":"2025-04-12T08:02:21.306Z","etag":null,"topics":["awesome","awesome-list","stimulus-components","stimulus-js"],"latest_commit_sha":null,"homepage":"https://stimulusjs.org/","language":null,"has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"cc0-1.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/skatkov.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null}},"created_at":"2020-02-18T00:41:29.000Z","updated_at":"2025-04-08T23:20:55.000Z","dependencies_parsed_at":"2024-04-03T20:11:14.679Z","dependency_job_id":"5b55de18-8c0c-4d80-a911-63875a6636a5","html_url":"https://github.com/skatkov/awesome-stimulusjs","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/skatkov%2Fawesome-stimulusjs","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/skatkov%2Fawesome-stimulusjs/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/skatkov%2Fawesome-stimulusjs/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/skatkov%2Fawesome-stimulusjs/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/skatkov","download_url":"https://codeload.github.com/skatkov/awesome-stimulusjs/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248796846,"owners_count":21163043,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["awesome","awesome-list","stimulus-components","stimulus-js"],"created_at":"2024-07-30T21:00:52.370Z","updated_at":"2025-04-13T23:32:38.191Z","avatar_url":"https://github.com/skatkov.png","language":null,"funding_links":[],"categories":["Others","Front-End Development","Related Awesome Lists","Other Lists"],"sub_categories":["Tutorials","Julia Lists"],"readme":"# Awesome StimulusJS\n\u003cdiv align=\"center\"\u003e\n  \u003ch3\u003eModestly awesome list of StimulusJS related content.\u003c/h3\u003e\n  \u003cdiv\u003e\n    Stimulus is, in many ways, the opposite of other modern frameworks available today. Here is what creators have to say about it:\n  \u003c/div\u003e\n  \u003cbr /\u003e\n  \u003cdiv\u003e\n    \u003ci\u003eIt doesn’t seek to take over your entire front-end—in fact, it’s not concerned with rendering HTML at all. Instead, it’s designed to augment your HTML with just enough behavior to make it shine. \u003c/i\u003e (c)\n  \u003c/div\u003e\n  \u003cbr /\u003e\n  \u003cdiv\u003e\n    This repository aims to showcase what is possible with this approach and link any other helpful content for your modest JS journey.\n  \u003c/div\u003e\n\u003c/div\u003e\n\n## Contents\n\n  - [Packages](#packages)\n  - [Reading](#reading)\n  - [Podcasts](#podcasts)\n  - [Other Modest Code](#other-modest-code)\n  - [Community](#community)\n\n## Packages\n- [StimulusReflex](https://github.com/hopsoft/stimulus_reflex) - Phoenix Liveview based on modern rails.\n- [stimulus-image-grid](https://github.com/leastbad/stimulus-image-grid) - A StimulusJS controller for beautiful image grids.\n- [stimulus-use](https://github.com/stimulus-use/stimulus-use) - A collection of composable behaviors for your StimulusJS Controllers.\n- [stimulus-hotkeys](https://github.com/leastbad/stimulus-hotkeys) - A Stimulus controller for mapping keystrokes to behaviors\n- [stimulus-existence](https://github.com/Circuit8/stimulus-existence) - Stimulus controller to remove elements from the dom, and be notified with an event when they are added.\n- [stimulus-reveal](https://gitlab.com/initforthe/stimulus-reveal) - Stimulus controller to hide/show elements with optional transitions\n- [stimulus-flatpickr](https://github.com/adrienpoly/stimulus-flatpickr) - A Wrapper for Flatpickr library.\n- [tailwindcss-stimulus-components](https://github.com/excid3/tailwindcss-stimulus-components) - A set of StimulusJS components (tabs, dropdowns, modals, toggles, autosave, etc) for TailwindCSS users.\n- [stimulus-validation](https://github.com/jwald1/stimulus-validation) - Validation controller for StimulusJS.\n- [stimulus-autocomplete](https://github.com/afcapel/stimulus-autocomplete) - StimulusJS autocomplete component.\n- [stimulus-tabs](https://github.com/jwald1/stimulus-tabs) - A simple tabs controller for StimulusJS.\n- [stimulus-conductor](https://github.com/adrienpoly/stimulus-conductor) - An optionated StimulusJS Controller to easily manage parent/children controllers.\n- [stimulus-remote](https://gitlab.com/initforthe/stimulus-remote) - Stimulus controller to provide content handling for HTML sent over the wire whilst using Rails UJS.\n- [stimulus-sticky-table-header](https://github.com/johnbeatty/stimulus-sticky-table-header) - Sticky Table Header Controller Using StimulusJS.\n- [stimulus-getaddress-io](https://gitlab.com/initforthe/stimulus-getaddress-io) - Getaddress.io controller for StimulusJS.\n- [stimulus-toggle-util](https://github.com/damonbauer/stimulus-toggle-util) - A simple toggle utility controller to hide/show elements on click.\n- [stimulus-timeago](https://github.com/stimulus-components/stimulus-timeago) - A Stimulus controller that returns the distance between the given date and now in words.\n- [stimulus-popover](https://github.com/stimulus-components/stimulus-popover) - A Stimulus controller to deal with HTML popover. \n- [stimulus-sortable](https://github.com/stimulus-components/stimulus-sortable) - A Stimulus controller to reorder lists with drag-and-drop. \n- [stimulus-reveal-controller](https://github.com/stimulus-components/stimulus-reveal-controller) - A Stimulus controller to toggle a class on one or multiple items to show or hide them.\n- [stimulus-content-loader](https://github.com/stimulus-components/stimulus-content-loader) - A Stimulus controller to asynchronously load HTML from an url. \n- [stimulus-checkbox-select-all](https://github.com/stimulus-components/stimulus-checkbox-select-all) - A Stimulus controller for managing checkbox lists.\n- [stimulus-rails-nested-form](https://github.com/stimulus-components/stimulus-rails-nested-form) - A Stimulus controller to create new fields on the fly to populate your Rails relationship.\n- [stimulus-textarea-autogrow](https://github.com/stimulus-components/stimulus-textarea-autogrow) - A Stimulus controller for autogrowing textarea.\n- [stimulus-remote-rails](https://github.com/stimulus-components/stimulus-remote-rails) - A Stimulus controller to handle Rails UJS events.\n- [stimulus-character-counter](https://github.com/stimulus-components/stimulus-character-counter) - A Stimulus controller that counts the number of characters in any input fields.\n- [stimulus-animated-number](https://github.com/stimulus-components/stimulus-animated-number) - A Stimulus controller that animates a numerical value by counting to it.\n- [stimulus-lightbox](https://github.com/stimulus-components/stimulus-lightbox) - A Stimulus controller to add a lightbox on images.\n- [stimulus-scroll-progress](https://github.com/stimulus-components/stimulus-scroll-progress) - A Stimulus controller to add a progress bar when scrolling. \n- [stimulus-carousel](https://github.com/stimulus-components/stimulus-carousel) - A Stimulus controller to deal with carousel.\n- [stimulus-rails-autosave](https://github.com/stimulus-components/stimulus-rails-autosave) - A Stimulus controller to autosubmit Rails forms. \n- [stimulus-transition](https://github.com/robbevp/stimulus-transition) - A stimulus controller to automatically run enter/leave transitions inspired by Vue and Alpine syntax.\n- [stimulus-library](https://github.com/Sub-Xaero/stimulus-library) - A set of useful pre-built and configurable StimulusJS controllers for various common scenarios.\n- [stimulus-store](https://github.com/omarluq/stimulus-store) - Lightweight state management for StimulusJS application.\n\n\n\n## Reading\n- _onrails.blog:_ [ StimulusJS Tutorials](https://onrails.blog/stimulus-js-tutorials/) - One man journey to StimulusJS written down in form of tutorials (with demos and code). My favorite:\n  - [Building a Progressive Web App with Rails and Stimulus](https://onrails.blog/2019/05/06/hnpwa-with-rails-and-stimulus-introduction/)\n  - [Stimulus + ActionCable + ActiveJob: Loading Asynchronous API Data](https://onrails.blog/2019/02/19/stimulus-actioncable-activejob-loading-asynchronous-api-data/)\n- _thecrapthatcomesoutofmyhead.com:_ [Building beautiful, fast apps with Rails and StimulusJS](https://www.thecrapthatcomesoutofmyhead.com/2020/06/24/building-beautiful-fast-apps-with-rails-and-stimulusjs)\n- _jorgemanrubia.com:_ [Form validations with HTML5 and modern Rails](https://www.jorgemanrubia.com/2019/02/16/form-validations-with-html5-and-modern-rails/)\n- _chrislabarge.com:_ __Using Node Modules with Rails + Webpacker and StimulusJS__\n    - [Pickr - Color Picker Library](https://chrislabarge.com/posts/color-picker)\n    - [Tippy.js - Popup/Popover Library](https://chrislabarge.com/posts/stimulus-popup)\n- _shime.sh:_ [Testing StimulusJS](https://shime.sh/testing-stimulus) - Testing was never covered in official documentation, this is an interesting alternative approach.\n- _dev.to:_ [Modern Rails flash messages](https://dev.to/citronak/modern-rails-flash-messages-part-1-viewcomponent-stimulus-tailwind-css-3alm) - Modern day flash messages with undo functionality - based on rails and stimulus.\n- _honeybadger.io:_ [How We Migrated To Turbolinks Without Breaking JavaScript](https://www.honeybadger.io/blog/turbolinks/)\n- _mccollester.com_ __Using StimulusJS for Type-ahead Search__\n  - [part 1](http://mccollester.com/2019/02/11/using-stimulusjs-type-ahead-search/)\n  - [part 2](http://mccollester.com/2019/02/13/using-stimulusjs-for-type-ahead-search-2-2/)\n- _cloudsh.com:_ [StimulusJS and Shopify API; Making a Cart](https://cloudsh.com/eleventy/posts/2019/stimulusjs_and_shopify_api.html)\n- _gorails.com:_ __guides, screencasts, and tutorials__ - Premium content, covers everything one needs to know about StimulusJS in an easily digestible video format (with code, demos and text as well).\n  - [Stimulus JS Framework Introduction](https://gorails.com/episodes/stimulus-js-framework-introduction?autoplay=1)\n  - [Stimulus JS Twitter UI: Part 1](https://gorails.com/episodes/stimulus-js-twitter-ui-part-1)\n  - [Stimulus JS Twitter UI: Part 2](https://gorails.com/episodes/stimulus-js-twitter-ui-part-2)\n  - [Dynamic Nested Forms with Stimulus JS](https://gorails.com/episodes/dynamic-nested-forms-with-stimulus-js)\n  - [Drag and Drop sortable lists with Rails \u0026 Stimulus JS](https://gorails.com/episodes/rails-drag-and-drop-sortable)\n  - [Google Maps and Google Places Autocomplete API with Rails, Turbolinks, and Stimulus.js](https://gorails.com/episodes/google-maps-places-autocomplete-with-rails)\n  - [Introduction to Stimulus Reflex](https://gorails.com/episodes/stimulus-reflex-basics)\n- _boringrails.com:_ [Writing better Stimulus controllers](https://boringrails.com/articles/better-stimulus-controllers/) - Excellent article that shows the common failure paths when working with Stimulus and how you can improve your controllers by keeping them small, generic, and composable.\n- _minthesize.com:_ [Infinite Horizontal Slider with CableReady and the Intersection Observer API](https://blog.minthesize.com/horizontal-slider-intersection-observer-cable-ready)\n- _github.com:_ [Guide to Reactive Rails](https://github.com/obie/guide-to-reactive-rails) - helpful content for a Reactive Rails journey (with stimulusjs involved)\n\n## Podcasts\n- _The Changelog:_ [JavaScript sprinkles in Basecamp turned Stimulus](https://changelog.com/podcast/286) - David Heinemeier Hansson joined the show to share the story of how JavaScript sprinkles in Basecamp evolved into a full-fledged framework called StimulusJS.\n- _Full Stack Radio:_ [DHH - Stimulus in Practice + On Writing Software Well](http://www.fullstackradio.com/83) - In this episode, Adam talks to David Heinemeier Hansson about Basecamp's new JavaScript framework \"StimulusJS\" as well as David's new YouTube series \"On Writing Software Well\".\n- _Ruby Rogues:_ [Stimulus](https://www.youtube.com/watch?v=5ACErJC9ixs\u0026list=PLJesql-aSfX7ZlZvJ7KZnyluVOVTSNHW1\u0026index=20\u0026t=0s) - The panelists talk about different use cases for StimulusJS, how it works, and how it can help your project.\n- _Code with Jason:_ [Stimulus and Webpacker with Noel Rappin](https://www.codewithjason.com/podcast/9478314-002-stimulus-and-webpacker-with-noel-rappin/) - Noel Rappin talks about Webpack, Webpacker, and StimulusJS.\n\n## Other Modest Code\n- [ModestJS E-Book](https://modestjs.works/) - A short ebook for those who want to write modest JavaScript.\n- [Black Candy](https://github.com/aidewoode/black_candy) - A self hosted music streaming server. Biggest open source rails app done with StimulusJS.\n- [Trimmings](https://github.com/postlight/trimmings) - Set of patterns that allow you to add DOM manipulation by adding data-trimmings-* attributes.\n- [Turbolinks](https://github.com/turbolinks/turbolinks) - Turbolinks makes navigating your web application faster and pairs perfectly with StimulusJS.\n- [jquery-events-to-dom-events](https://github.com/leastbad/jquery-events-to-dom-events) - Pick up legacy jQuery \"events\" using DOM event listeners.\n\n\n## Community\n- [Stimulus forums](https://discourse.stimulusjs.org/) - Official community forums. Biggest wealth of information is scattered across those, but activity is slow.\n- [Stimulus Reflex discord](https://discord.gg/XveN625) - Focused on Stimulus Reflex, but a lot of discussion about stimulus and a lot of knowledgable people on matter. Very active, questions get answered in minutes.\n- [Better Stimulus](https://www.betterstimulus.com/) - An opinionated collection of StimulusJS best practices from community.\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fskatkov%2Fawesome-stimulusjs","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fskatkov%2Fawesome-stimulusjs","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fskatkov%2Fawesome-stimulusjs/lists"}