An opinionated, dark-first Rails 8 starter template. Stop configuring, start building.
| Layer | Choice |
|---|---|
| Framework | Rails 8 (Solid Cache, Solid Queue, Solid Cable) |
| Views | Phlex 2 — pure Ruby, no ERB |
| Components | RubyUI (37 shadcn-style components) |
| Styling | Tailwind CSS v4 — dark-first design system |
| JS | Hotwire (Turbo + Stimulus) via Import Maps |
| Charts | Chartkick + Chart.js |
| Icons | Lucide (via phlex-icons-lucide) |
| Database | PostgreSQL |
| Tests | RSpec + FactoryBot + Capybara + WebMock + VCR |
| Previews | Lookbook at /lookbook |
| Deploy | Kamal 2 + Thruster |
git clone https://github.com/YOUR_USER/rok.git myapp
cd myapp
# Install dependencies
bundle install
# Create database
bin/rails db:create db:migrate
# Start dev server
bin/devVisit http://localhost:3000 — you should see the dark-themed homepage with component showcase and demo charts.
app/
├── components/ # Phlex components (no namespace)
│ ├── base.rb # Base class — inherits Phlex::HTML, includes RubyUI
│ ├── navbar.rb # Responsive navbar with search + theme toggle
│ ├── footer.rb # Footer
│ ├── search_box.rb # Search input with keyboard shortcut
│ └── pages/ # Full page components
│ └── home.rb
├── ruby_ui/ # RubyUI generated components (RubyUI:: namespace)
│ ├── button/
│ ├── badge/
│ ├── card/
│ └── ... (37 components)
├── views/layouts/
│ └── application_layout.rb # Phlex layout (no ERB)
└── javascript/controllers/
├── theme_controller.js # Dark/light toggle with localStorage
├── keyboard_controller.js # "/" to focus search, Escape to blur
└── search_controller.js # Debounced search submission
Default = dark mode. Add .light on <html> to switch.
Design tokens are defined in app/assets/tailwind/application.css via @theme:
- Surface:
bg-surface,bg-surface-raised,bg-surface-overlay - Text:
text-text,text-text-muted,text-text-faint - Border:
border-border,border-border-strong - Accent:
bg-accent,text-accent,bg-accent-hover - Semantic:
text-success,text-warning,text-danger,text-info
RubyUI/shadcn tokens (primary, secondary, muted, destructive, etc.) are mapped to the design system so all RubyUI components render correctly in both themes.
See CLAUDE.md for the full list of conventions (Phlex, Tailwind, Stimulus, tests, git).
- Rename the module in
config/application.rb(currentlyRok) - Update database names in
config/database.yml - Update
config/deploy.ymlwith your server details - Replace the homepage in
app/components/pages/home.rb - Add your own components in
app/components/
MIT