{"id":13878713,"url":"https://github.com/templatus/templatus-hotwire","last_synced_at":"2025-04-12T23:40:47.511Z","repository":{"id":37047379,"uuid":"437282244","full_name":"templatus/templatus-hotwire","owner":"templatus","description":"Opinionated template for starting new web applications with Ruby on Rails and Hotwire","archived":false,"fork":false,"pushed_at":"2025-04-11T03:41:52.000Z","size":17495,"stargazers_count":235,"open_issues_count":1,"forks_count":21,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-04-12T23:40:02.485Z","etag":null,"topics":["hotwire","rails","stimulusjs","template","vitejs"],"latest_commit_sha":null,"homepage":"https://templatus-hotwire.ledermann.dev","language":"Ruby","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/templatus.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"docs/security-headers.png","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2021-12-11T12:55:59.000Z","updated_at":"2025-04-11T03:41:55.000Z","dependencies_parsed_at":"2023-10-20T19:32:10.050Z","dependency_job_id":"69f46aea-0f69-43cc-9001-6b55a60ee1d7","html_url":"https://github.com/templatus/templatus-hotwire","commit_stats":{"total_commits":2637,"total_committers":4,"mean_commits":659.25,"dds":"0.15510049298445205","last_synced_commit":"ed1a6f8367f217b3c1e4c9dd80c72139006e8bfb"},"previous_names":[],"tags_count":2,"template":true,"template_full_name":"templatus/templatus-vue","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/templatus%2Ftemplatus-hotwire","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/templatus%2Ftemplatus-hotwire/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/templatus%2Ftemplatus-hotwire/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/templatus%2Ftemplatus-hotwire/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/templatus","download_url":"https://codeload.github.com/templatus/templatus-hotwire/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248647254,"owners_count":21139081,"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":["hotwire","rails","stimulusjs","template","vitejs"],"created_at":"2024-08-06T08:01:57.472Z","updated_at":"2025-04-12T23:40:47.473Z","avatar_url":"https://github.com/templatus.png","language":"Ruby","funding_links":[],"categories":["Ruby","Rails Templates 👷 (open source)"],"sub_categories":[],"readme":"[![Build Status](https://github.com/templatus/templatus-hotwire/workflows/CI/badge.svg)](https://github.com/templatus/templatus-hotwire/actions)\n[![Cypress](https://img.shields.io/endpoint?url=https://dashboard.cypress.io/badge/simple/5d6bqs\u0026style=flat-square\u0026logo=cypress)](https://dashboard.cypress.io/projects/5d6bqs/runs)\n\n# Templatus (Hotwire edition)\n\nTemplatus is an opinionated template to build web applications with Ruby on Rails and Hotwire. It simplifies the process of setting up a new application while following best practices.\n\nLive demo available at https://templatus-hotwire.ledermann.dev\n\n## Similar projects\n\nThere are two sister repositories:\n\n- For using Vue.js instead of Hotwire: https://github.com/templatus/templatus-vue/\n- For using Inertia and Svelte.js instead of Hotwire: https://github.com/templatus/templatus-inertia/\n\n## Features / Technology stack\n\n### Backend\n\n- [Ruby](https://www.ruby-lang.org/de/) 3.4\n- [Ruby on Rails](https://rubyonrails.org/) 8.0\n- [ActionCable](https://guides.rubyonrails.org/action_cable_overview.html) for WebSocket communication\n- [PostgreSQL](https://www.postgresql.org/) for using as SQL database\n- [Sidekiq](https://sidekiq.org/) for background processing\n- [Redis](https://redis.io/) for Caching, ActionCable, and Sidekiq\n\n### Frontend\n\n- [Hotwire](https://hotwire.io/) for building the frontend without using much JavaScript by sending HTML instead of JSON over the wire\n- [TypeScript](https://www.typescriptlang.org/) for static type checking in Stimulus controllers and other script code\n- [Phlex-Rails](https://www.phlex.fun) as an object-oriented alternative to ActionView for Ruby on Rails\n- [Tailwind CSS 4](https://tailwindcss.com/) to not have to write CSS at all\n- [Heroicons](https://heroicons.com/) for beautiful hand-crafted SVG icons\n- [Vite](https://vitejs.dev/) for bundling JavaScript and CSS with Hot Module Replacement (HMR) in development\n\n### Development\n\n- [Puma-dev](https://github.com/puma/puma-dev) for using .test-domain and HTTPS in development\n- [Overmind](https://github.com/DarthSim/overmind) for starting up the application locally (Procfile handling like Foreman)\n- [dotenv](https://github.com/bkeepers/dotenv) to load environment variables from .env into ENV\n- [Prettier](https://prettier.io/) for auto-formatting JavaScript code in Visual Studio Code\n- [SyntaxTree](https://github.com/ruby-syntax-tree/syntax_tree) for auto-formatting Ruby code in Visual Studio Code\n- [Lookbook](https://github.com/allmarkedup/lookbook) as development UI for ViewComponent\n- [annotaterb](https://github.com/drwl/annotaterb) for annotating models and routes\n- Live reloading\n\n### Linting and testing\n\n- [RuboCop](https://rubocop.org/) for Ruby static code analysis\n- [ESLint](https://eslint.org/) for JavaScript static code analysis\n- [RSpec](https://rspec.info/) for Ruby testing\n- [Factory Bot](https://github.com/thoughtbot/factory_bot) for setting up Ruby objects as test data\n- [Cypress](https://www.cypress.io/) for E2E testing\n\n### Deployment\n\n- [Docker](https://www.docker.com/) for production deployment, NOT for development\n- [DockerRailsBase](https://github.com/ledermann/docker-rails-base) for fast building an optimized Docker image based on Alpine Linux\n- [GitHub Actions](https://docs.github.com/en/actions) for testing, linting, and building Docker image\n- [Dependabot](https://docs.github.com/en/code-security/supply-chain-security/keeping-your-dependencies-updated-automatically/about-dependabot-version-updates) configuration for updating dependencies (with auto-merge)\n- Ready for serving assets via CDN like CloudFront\n- [Honeybadger](https://www.honeybadger.io/) for error tracking in Ruby and JavaScript\n- [RorVsWild](https://www.rorvswild.com/) for performance monitoring\n- [Plausible](https://plausible.io/) for privacy friendly analytics\n- [Lockup](https://lockup.interdiscipline.com/) to place a staging server behind a basic codeword\n\n### Production\n\n- [Lograge](https://github.com/roidrage/lograge) for single-line logging\n- Gzip and Brotli compression of dynamic responses (HTML, JSON) using [Rack::Deflater](https://github.com/rack/rack/blob/master/lib/rack/deflater.rb), [Rack::Brotli](https://github.com/marcotc/rack-brotli)\n- Fine-tuned Content Security Policy (CSP)\n- Ready for PWA (manifest, service-worker)\n\n## Metrics\n\nThis template is developed with optimized performance and security in mind. The following benchmarks are\nperformed against the demo installation on production. It uses an inexpensive virtual server on the [Hetzner Cloud](https://www.hetzner.com/de/cloud) behind a [Traefik](https://traefik.io/traefik/) setup.\n\n### Lighthouse site performance\n\n100% in all categories.\n\n![Lighthouse](docs/lighthouse.png)\n\n### Security headers\n\n[![Security headers](docs/security-headers.png)](https://securityheaders.com/?q=templatus-hotwire.ledermann.dev\u0026followRedirects=on)\n\nWhat's the red _Permissions-Policy_ badge? This seems to be fixed with one of the next Rails update:\nhttps://github.com/rails/rails/pull/41994\n\n### Mozilla Observatory\n\n[![Mozilla Observatory](docs/mozilla-observatory.png)](https://observatory.mozilla.org/analyze/templatus-hotwire.ledermann.dev)\n\n### WebPageTest\n\n[![WebPageTest](docs/web-page-test.png)](https://www.webpagetest.org/result/220530_BiDcQQ_83b754931114d99469b521e72731eb4d/)\n\n### GTmetrix\n\n[![GTmetrix](docs/GTmetrix.png)](https://gtmetrix.com/reports/templatus-hotwire.ledermann.dev/rSqolxsw/)\n\n### Check-your-website\n\n[![Check-your-website](docs/check-your-website.png)](https://check-your-website.server-daten.de/?q=templatus-hotwire.ledermann.dev)\n\n### JavaScript size\n\n159 KB of compiled JavaScript (minified, uncompressed). The largest parts are:\n\n- Turbo with ActionCable (72 KB)\n- Stimulus (32 KB)\n- Honeybadger (25 KB)\n\n```\n$ RAILS_ENV=production bin/rails assets:precompile\n➤ YN0000: · Yarn 4.4.1\n➤ YN0000: ┌ Resolution step\n➤ YN0000: └ Completed\n➤ YN0000: ┌ Fetch step\n➤ YN0000: └ Completed\n➤ YN0000: ┌ Link step\n➤ YN0000: └ Completed\n➤ YN0000: · Done in 0s 312ms\nBuilding with Vite ⚡️\nvite v5.4.3 building for production...\ntransforming...\n✓ 47 modules transformed.\nrendering chunks...\ncomputing gzip size...\n../../public/vite/.vite/manifest-assets.json         0.10 kB │ gzip:  0.09 kB\n../../public/vite/assets/logo-DdqaqAN0.svg           0.50 kB │ gzip:  0.30 kB\n../../public/vite/.vite/manifest.json                0.57 kB │ gzip:  0.22 kB\n../../public/vite/assets/application-Buqxuzrp.css   23.64 kB │ gzip:  5.07 kB\n../../public/vite/assets/application-CFMovW7N.js     3.64 kB │ gzip:  1.44 kB │ map:   9.72 kB\n../../public/vite/assets/vendor-CjM9kOWQ.js        208.59 kB │ gzip: 57.68 kB │ map: 715.99 kB\n✓ built in 1.03s\nBuild with Vite complete: /Users/ledermann/Projects/templatus-hotwire/public/vite\n```\n\n### Network transfer\n\nSmall footprint: The demo application transfers only **62 KB** of (compressed) data on the first visit.\n\n![Network](docs/network.png)\n\n### Docker build time\n\nWith multi-stage building and using [DockerRailsBase](https://github.com/ledermann/docker-rails-base) the build of the Docker image takes very little time. Currently, the build job requires about 1,5 minutes on GitHub Actions (see https://github.com/templatus/templatus-hotwire/actions)\n\n### Docker image size\n\nThe Docker image is based on Alpine Linux and is optimized for minimal size (currently **117 MB** uncompressed disk size). It includes just the bare minimum - no build tools like Node.js, no JS sources (just the compiled assets), no tests.\n\n```\n$ container-diff analyze ghcr.io/templatus/templatus-hotwire -n\n\n-----Size-----\n\nAnalysis for ghcr.io/templatus/templatus-hotwire:\nIMAGE                                      DIGEST       SIZE\nghcr.io/templatus/templatus-hotwire        sha256:... 116.7M\n```\n\n## Getting started\n\n### Install for development\n\n1. Clone the repo locally:\n\n```bash\ngit clone git@github.com:templatus/templatus-hotwire.git\ncd templatus-hotwire\n```\n\n2. Install PostgreSQL, Redis, and puma-dev (if not already present). On a Mac with HomeBrew, run this to install from the `Brewfile`:\n\n```bash\nbrew bundle\n```\n\n3. Install and set up [puma-dev](https://github.com/puma/puma-dev) to use HTTPS for development. Do this on macOS:\n\n```bash\nsudo puma-dev -setup\npuma-dev -install\npuma-dev link\n\n# Use Vite via puma-dev proxy\n# Adopted from https://github.com/puma/puma-dev#webpack-dev-server\necho 3036 \u003e ~/.puma-dev/vite.templatus-hotwire\n```\n\n4. Setup the application to install gems and NPM packages and create the database:\n\n```bash\nbin/setup\n```\n\n5. Start the application locally:\n\n```bash\nbin/dev\n```\n\nThen open https://templatus-hotwire.test in your browser.\n\n### Preview components in LookBook\n\n```bash\nbin/dev\n```\n\nThen open https://templatus-hotwire.test/lookbook/ in your browser.\n\n### Running linters\n\nRuboCop:\n\n```\nbin/rubocop\n```\n\nESLint:\n\n```\nbin/yarn lint\n```\n\n### Running tests locally\n\nRuby tests:\n\n```\nbin/rspec\nopen coverage/index.html\n```\n\nJavaScript unit tests:\n\n```\nbin/yarn test\n```\n\nE2E tests with Cypress:\n\n```\nbin/cypress open\n```\n\nThis opens Cypress and starts Rails in `development` environment, but with `CYPRESS=true`, so the `test` database is used. This allows code editing without class reloading and recompiling assets.\n\nTo run Cypress in headless mode:\n\n```\nbin/cypress run\n```\n\n### Test deployment locally\n\n```\ndocker network create public\ndocker compose up\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftemplatus%2Ftemplatus-hotwire","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftemplatus%2Ftemplatus-hotwire","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftemplatus%2Ftemplatus-hotwire/lists"}