https://github.com/guillaumebriday/modern-datatables

They are many ways to build reactive web interfaces but do we really need to add the complexity of JavaScript frameworks like Vue.js or React?
https://github.com/guillaumebriday/modern-datatables

datatables hotwire kamal rails spa stimulusjs turbo vuejs

Last synced: about 3 hours ago
JSON representation

They are many ways to build reactive web interfaces but do we really need to add the complexity of JavaScript frameworks like Vue.js or React?

• Host: GitHub
• URL: https://github.com/guillaumebriday/modern-datatables
• Owner: guillaumebriday
• License: mit
• Created: 2020-09-03T16:38:43.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2024-11-22T15:55:11.000Z (29 days ago)
• Last Synced: 2024-12-14T08:06:26.272Z (7 days ago)
• Topics: datatables, hotwire, kamal, rails, spa, stimulusjs, turbo, vuejs
• Language: Ruby
• Homepage: https://rails-hotwire.guillaumebriday.fr/
• Size: 660 KB
• Stars: 157
• Watchers: 6
• Forks: 14
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Funding: .github/FUNDING.yml
  • License: LICENSE

Awesome Lists containing this project

• Open-Source-Ruby-and-Rails-Apps - modern-datatables - They are many ways to build reactive web interfaces but do we really need to add the complexity of JavaScript frameworks like Vue.js or React? 🔥 ✅ 🚀 (Happy Exploring 🤘)

README

        
# Modern datatables

## Concept Overview

This project shows how to build a **modern** real life application with in two different ways.

They are many ways to build **reactive** web interfaces but do we really need to add the complexity of JavaScript frameworks like [Vue.js](https://vuejs.org/) or [React](https://reactjs.org/)?

These tools are very powerful but the complexity they add to a full-stack developer's workflow is **INSANE**.

In this repo, you'll find two apps:

👉 One is build with [Rails](https://rubyonrails.org/) and [Hotwire](https://hotwire.dev/) aka NEW MAGIC.

👉 The other with Rails as a backend API and Vue.js as a full static SPA in the frontend.

They have the exact same features and level of responsiveness.

👉 Here is a blog post with some details of how it works under the hood: https://guillaumebriday.fr/hotwire-reactive-search-form-without-javascript

👉 You can already use [Stimulus Rails Autosave](https://www.stimulus-components.com/docs/stimulus-rails-autosave) to auto-submit your forms with Stimulus without writing a single line of custom JavaScript.

## Demo

Both example are available online 🥳:

- [https://rails-hotwire.guillaumebriday.fr](https://rails-hotwire.guillaumebriday.fr)

- [https://rails-vuejs.guillaumebriday.fr](https://rails-vuejs.guillaumebriday.fr)

## Resources

More and more developers come back from building dedicated SPAs and just want to use the power of Vue or React in a classic Backend application.

Many projects help you in multiples frameworks:

- [Hotwire](https://hotwire.dev/)

- [Laravel Livewire](https://laravel-livewire.com/)

- [htmx](https://github.com/bigskysoftware/htmx)

- [Inertiajs](https://inertiajs.com/)

- [Stimulus Reflex](https://docs.stimulusreflex.com/)

- [Phoenix Live_View](https://github.com/phoenixframework/phoenix_live_view)

- [Turbolinks](https://github.com/turbolinks/turbolinks)

If you're still perplex about this old school approach, you should watch this video from Sam Stephenson:

[Turbolinks 5: I Can’t Believe It’s Not Native! ](https://www.youtube.com/watch?v=SWEts0rlezA).

## Contributing

Do not hesitate to contribute to the project by adapting or adding features ! Bug reports or pull requests are welcome.

## License

This project is released under the [MIT](http://opensource.org/licenses/MIT) license.