# This is an <h1> tag
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.
| <?php | |
| use PhpCsFixer\Config; | |
| use PhpCsFixer\Finder; | |
| $rules = [ | |
| 'array_indentation' => true, | |
| 'array_syntax' => ['syntax' => 'short'], | |
| 'binary_operator_spaces' => [ | |
| 'default' => 'single_space', |
| .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 |
| import React, { Component } from 'react'; | |
| import Paginator from './Paginator'; | |
| class App extends Component { | |
| state = { | |
| currentPage: 1, | |
| total: 686, | |
| perPage: 10, | |
| }; |
| stages: | |
| - build | |
| - test | |
| # Variables | |
| variables: | |
| MYSQL_ROOT_PASSWORD: root | |
| MYSQL_USER: homestead | |
| MYSQL_PASSWORD: secret | |
| MYSQL_DATABASE: homestead |
| angular | |
| .module('directives.abDatepicker', []) | |
| .directive('abDatepicker', abDatepicker); | |
| abDatepicker.$inject = []; | |
| /* @ngInject */ | |
| function abDatepicker() { | |
| return { | |
| require: 'ngModel', |
| # 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 |
| 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 + '">' + |
| 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); | |
| } |
