cuonggt

The Unofficial 37signals/DHH Rails Style Guide

About This Document

This style guide was generated by Claude Code through deep analysis of the Fizzy codebase - 37signals' open-source project management tool.

Why Fizzy matters: While 37signals has long advocated for "vanilla Rails" and opinionated software design, their production codebases (Basecamp, HEY, etc.) have historically been closed source. Fizzy changes that. For the first time, developers can study a real 37signals/DHH-style Rails application - not just blog posts and conference talks, but actual production code with all its patterns, trade-offs, and deliberate omissions.

How this was created: Claude Code analyzed the entire codebase - routes, controllers, models, concerns, views, JavaScript, CSS, tests, and configuration. The goal was to extract not just what patterns are used, but why - inferring philosophy from implementation choices.

cuonggt

<?php

use PhpCsFixer\Config;
use PhpCsFixer\Finder;

$rules = [
    'array_indentation' => true,
    'array_syntax' => ['syntax' => 'short'],
    'binary_operator_spaces' => [
        'default' => 'single_space',

cuonggt

.git
.gitignore

# Created by https://www.gitignore.io/api/git,ruby,rails,jetbrains+all
# Edit at https://www.gitignore.io/?templates=git,ruby,rails,jetbrains+all

### Git ###
# Created by git for backups. To disable backups in Git:
# $ git config --global mergetool.keepBackup false
*.orig

cuonggt

import React, { Component } from 'react';
import Paginator from './Paginator';

class App extends Component {
    state = {
        currentPage: 1,
        total: 686,
        perPage: 10,
    };

cuonggt

stages:
  - build
  - test

# Variables
variables:
  MYSQL_ROOT_PASSWORD: root
  MYSQL_USER: homestead
  MYSQL_PASSWORD: secret
  MYSQL_DATABASE: homestead

cuonggt

angular
    .module('directives.abDatepicker', [])
    .directive('abDatepicker', abDatepicker);

abDatepicker.$inject = [];

/* @ngInject */
function abDatepicker() {
    return {
        require: 'ngModel',

cuonggt

# stop script on error signal
set -e

# remove old deployment folders
if [ -d "/home/forge/weather-deploy" ]; then
 rm -R /home/forge/weather-deploy
fi
if [ -d "/home/forge/weather-backup" ]; then
 rm -R /home/forge/weather-backup
fi

cuonggt

angular.module('directives.fbComments', [])
       .directive('fbComments', fbComments);

fbComments.$injects = ['$timeout'];

function fbComments($timeout) {
    function createHTML(href, numposts) {
        return '<div class="fb-comments" ' +
               'data-href="' + href + '" ' +
               'data-numposts="' + numposts + '">' +

cuonggt

angular
    .module('app')
    .config(config);

function config($routeProvider, $locationProvider) {
    var universalResolves = {
        catalogIds: function ($http, $rootScope, $localStorage, $q) {
            if ($localStorage.catalogIds) {
                return $q.when($localStorage.catalogIds);
            }

cuonggt

import React, { Component } from 'react';
import axios from 'axios';
import FormErrors from './FormErrors';

export default class LoginForm extends Component {
    constructor(props) {
        super(props);

        this.state = {
            email: '',