aljaz/hacker-laws
1
1
Fork 0
mirror of https://github.com/dwmkerr/hacker-laws.git synced 2025-12-17 12:45:20 +01:00
Code Issues Packages Projects Releases Wiki Activity

chore: interim

Browse Source
This commit is contained in:
Dave Kerr
2025-03-09 07:41:31 +00:00
parent 5e1cfb7608
commit 8142ce0a9f
11 changed files with 1735 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

0
.github/website/backup/ideas.md vendored Normal file
View File

189
.github/website/backup/index2.html vendored Normal file
View File

@@ -0,0 +1,189 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Hacker Laws</title>
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" />
<!-- Bootstrap Icons -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" rel="stylesheet" />
<style>
/* Soft pastel parchment background */
body {
background-color: #fdf6e3;
color: #333;
padding-top: 70px; /* to account for sticky navbar */
}
/* Navbar customization */
.navbar-custom {
background-color: #ffffff;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
/* Header styling */
header h1 {
font-size: 2.5rem;
font-weight: bold;
}
header p.lead {
font-size: 1.25rem;
color: #555;
}
/* Law section container */
.law-section {
margin-bottom: 2rem;
padding: 1.5rem;
background-color: #fff;
border-radius: 5px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
/* Social sharing icons */
.social-sharing a {
margin-right: 0.75rem;
font-size: 1.2rem;
color: #555;
text-decoration: none;
}
.social-sharing a:hover {
color: #000;
}
/* Back to top link styling */
.back-to-top a {
font-size: 0.9rem;
text-decoration: none;
color: #007bff;
}
.back-to-top a:hover {
text-decoration: underline;
}
</style>
</head>
<body id="top">
<!-- Sticky Navbar -->
<nav class="navbar navbar-expand-lg navbar-custom fixed-top">
<div class="container">
<a class="navbar-brand fw-bold" href="#top">Hacker Laws</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navMenu" aria-controls="navMenu" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navMenu">
<ul class="navbar-nav me-auto">
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-book"></i> Effective Shell</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-cup"></i> Sponsor</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-brain"></i> Terminal AI</a>
</li>
</ul>
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-github"></i> GitHub</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Header -->
<header class="container my-4">
<h1>Hacker Laws</h1>
<p class="lead">Laws, Theories, Principles and Patterns that developers will find useful.</p>
</header>
<!-- Main Content -->
<main class="container">
<!-- Introduction Section -->
<section id="introduction" class="law-section">
<h2>Introduction</h2>
<p>There are lots of laws which people discuss when talking about development. This repository is a reference and overview of some of the most common ones. Please share and submit PRs!</p>
<p><strong>Note:</strong> This repo contains an explanation of some laws, principles and patterns, but does not <em>advocate</em> for any of them. Whether they should be applied will always be a matter of debate, and greatly dependent on what you are working on.</p>
<!-- Social Sharing Icons -->
<div class="social-sharing">
<a href="#" title="Share on Twitter"><i class="bi bi-twitter"></i></a>
<a href="#" title="Share on Facebook"><i class="bi bi-facebook"></i></a>
<a href="#" title="Share on LinkedIn"><i class="bi bi-linkedin"></i></a>
</div>
<!-- Back to Top Options (choose one) -->
<div class="back-to-top mt-2">
<a href="#top">↑ Top</a>
<!-- Alternative options:
<a href="#top">Back to Top</a>
<a href="#top">Return to Top</a>
<a href="#top">Go Up</a>
<a href="#top">Scroll Up</a>
-->
</div>
</section>
<!-- 90–9–1 Principle (1% Rule) Section -->
<section id="9091-principle" class="law-section">
<h2>90–9–1 Principle (1% Rule)</h2>
<p>The 90-9-1 principle suggests that within an internet community such as a wiki, 90% of participants only consume content, 9% edit or modify content and 1% of participants add content.</p>
<p>Real-world examples:</p>
<ul>
<li>A 2014 study of four digital health social networks found the top 1% created 73% of posts, the next 9% accounted for an average of ~25% and the remaining 90% accounted for an average of 2%.</li>
</ul>
<p>See Also: <a href="#the-pareto-principle-the-8020-rule">Pareto Principle</a></p>
<!-- Social Sharing Icons -->
<div class="social-sharing">
<a href="#" title="Share on Twitter"><i class="bi bi-twitter"></i></a>
<a href="#" title="Share on Facebook"><i class="bi bi-facebook"></i></a>
<a href="#" title="Share on LinkedIn"><i class="bi bi-linkedin"></i></a>
</div>
<!-- Back to Top Options -->
<div class="back-to-top mt-2">
<a href="#top">↑ Top</a>
</div>
</section>
<!-- 90–90 Rule Section -->
<section id="9090-rule" class="law-section">
<h2>90–90 Rule</h2>
<p>The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time.</p>
<p>This is a wry reinterpretation of the <a href="#the-pareto-principle-the-8020-rule">Pareto Principle</a> (or 80-20 rule) that highlights the real-world challenges of completing engineering work. This sentiment is also echoed in <a href="#hofstadters-law">Hofstadter's Law</a>.</p>
<!-- Social Sharing Icons -->
<div class="social-sharing">
<a href="#" title="Share on Twitter"><i class="bi bi-twitter"></i></a>
<a href="#" title="Share on Facebook"><i class="bi bi-facebook"></i></a>
<a href="#" title="Share on LinkedIn"><i class="bi bi-linkedin"></i></a>
</div>
<!-- Back to Top Options -->
<div class="back-to-top mt-2">
<a href="#top">↑ Top</a>
</div>
</section>
<!-- Additional law sections would follow the same structure -->
</main>
<!-- Footer -->
<footer class="container text-center my-4">
<p>&copy; 2025 Hacker Laws</p>
</footer>
<!-- Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
// Optional: Smooth scrolling for in-page links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function(e) {
e.preventDefault();
const targetElem = document.querySelector(this.getAttribute('href'));
if (targetElem) {
targetElem.scrollIntoView({ behavior: 'smooth' });
}
});
});
</script>
</body>
</html>

194
.github/website/backup/index3.html vendored Normal file
View File

@@ -0,0 +1,194 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Hacker Laws</title>
<!-- Google Font for elegant serif fonts -->
<link href="https://fonts.googleapis.com/css2?family=Libre+Baskerville:wght@400;700&display=swap" rel="stylesheet">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" />
<!-- Bootstrap Icons -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" rel="stylesheet" />
<style>
/* Use an elegant serif font and a clean, minimal palette */
body {
font-family: 'Libre Baskerville', Georgia, serif;
background-color: #fff;
color: #333;
padding-top: 70px; /* account for sticky navbar */
}
.container {
max-width: 800px;
}
/* Simplified Navbar */
.navbar-custom {
background-color: #fff;
border-bottom: 1px solid #e5e5e5;
}
.navbar-brand,
.nav-link {
font-weight: 700;
}
/* Centered, minimal header */
header {
text-align: center;
margin-bottom: 2rem;
}
header h1 {
font-size: 2.5rem;
margin-bottom: 0.5rem;
}
header p.lead {
font-size: 1.25rem;
color: #555;
}
/* Law section styling: simple borders instead of shadows */
.law-section {
margin-bottom: 2rem;
padding: 1.5rem;
background-color: #fff;
border-bottom: 1px solid #e5e5e5;
}
/* Social sharing icons remain the same */
.social-sharing a {
margin-right: 0.75rem;
font-size: 1.2rem;
color: #555;
text-decoration: none;
}
.social-sharing a:hover {
color: #000;
}
/* Back to top link styling */
.back-to-top a {
font-size: 0.9rem;
text-decoration: none;
color: #007bff;
}
.back-to-top a:hover {
text-decoration: underline;
}
</style>
</head>
<body id="top">
<!-- Sticky Navbar -->
<nav class="navbar navbar-expand-lg navbar-custom fixed-top">
<div class="container">
<a class="navbar-brand" href="#top">Hacker Laws</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navMenu" aria-controls="navMenu" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navMenu">
<ul class="navbar-nav me-auto">
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-book"></i> Effective Shell</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-cup"></i> Sponsor</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-brain"></i> Terminal AI</a>
</li>
</ul>
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link" href="#"><i class="bi bi-github"></i> GitHub</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Page Header -->
<header class="container my-4">
<h1>Hacker Laws</h1>
<p class="lead">Laws, Theories, Principles and Patterns that developers will find useful.</p>
</header>
<!-- Main Content -->
<main class="container">
<!-- Introduction Section -->
<section id="introduction" class="law-section">
<h2>Introduction</h2>
<p>There are lots of laws which people discuss when talking about development. This repository is a reference and overview of some of the most common ones. Please share and submit PRs!</p>
<p><strong>Note:</strong> This repo contains an explanation of some laws, principles and patterns, but does not <em>advocate</em> for any of them. Whether they should be applied will always be a matter of debate, and greatly dependent on what you are working on.</p>
<!-- Social Sharing Icons -->
<div class="social-sharing">
<a href="#" title="Share on Twitter"><i class="bi bi-twitter"></i></a>
<a href="#" title="Share on Facebook"><i class="bi bi-facebook"></i></a>
<a href="#" title="Share on LinkedIn"><i class="bi bi-linkedin"></i></a>
</div>
<!-- Back to Top -->
<div class="back-to-top mt-2">
<a href="#top">↑ Top</a>
</div>
</section>
<!-- 90–9–1 Principle (1% Rule) Section -->
<section id="9091-principle" class="law-section">
<h2>90–9–1 Principle (1% Rule)</h2>
<p>The 90-9-1 principle suggests that within an internet community such as a wiki, 90% of participants only consume content, 9% edit or modify content and 1% of participants add content.</p>
<p>Real-world examples:</p>
<ul>
<li>A 2014 study of four digital health social networks found the top 1% created 73% of posts, the next 9% accounted for an average of ~25% and the remaining 90% accounted for an average of 2%.</li>
</ul>
<p>See Also: <a href="#the-pareto-principle-the-8020-rule">Pareto Principle</a></p>
<!-- Social Sharing Icons -->
<div class="social-sharing">
<a href="#" title="Share on Twitter"><i class="bi bi-twitter"></i></a>
<a href="#" title="Share on Facebook"><i class="bi bi-facebook"></i></a>
<a href="#" title="Share on LinkedIn"><i class="bi bi-linkedin"></i></a>
</div>
<!-- Back to Top -->
<div class="back-to-top mt-2">
<a href="#top">↑ Top</a>
</div>
</section>
<!-- 90–90 Rule Section -->
<section id="9090-rule" class="law-section">
<h2>90–90 Rule</h2>
<p>The first 90 percent of the code accounts for the first 90 percent of the development time. The remaining 10 percent of the code accounts for the other 90 percent of the development time.</p>
<p>This is a wry reinterpretation of the <a href="#the-pareto-principle-the-8020-rule">Pareto Principle</a> (or 80-20 rule) that highlights the real-world challenges of completing engineering work. This sentiment is also echoed in <a href="#hofstadters-law">Hofstadter's Law</a>.</p>
<!-- Social Sharing Icons -->
<div class="social-sharing">
<a href="#" title="Share on Twitter"><i class="bi bi-twitter"></i></a>
<a href="#" title="Share on Facebook"><i class="bi bi-facebook"></i></a>
<a href="#" title="Share on LinkedIn"><i class="bi bi-linkedin"></i></a>
</div>
<!-- Back to Top -->
<div class="back-to-top mt-2">
<a href="#top">↑ Top</a>
</div>
</section>
</main>
<!-- Footer -->
<footer class="container text-center my-4">
<p>&copy; 2025 Hacker Laws</p>
</footer>
<!-- Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
// Smooth scrolling for in-page links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function(e) {
e.preventDefault();
const targetElem = document.querySelector(this.getAttribute('href'));
if (targetElem) {
targetElem.scrollIntoView({ behavior: 'smooth' });
}
});
});
</script>
</body>
</html>

0
.github/website/backup/index4.html vendored Normal file
View File

0
.github/website/build/.gitignore vendored Normal file
View File

1095
.github/website/build/index.html vendored Normal file
View File

File diff suppressed because it is too large Load Diff

62
.github/website/generate.py vendored Normal file
View File

@@ -0,0 +1,62 @@
import argparse
import markdown
import os
from jinja2 import Environment, FileSystemLoader
# Read environment variables with defaults
TEMPLATE_FILE = os.getenv("TEMPLATE_FILE", "template.html")
MARKDOWN_FILE = os.getenv("MARKDOWN_FILE", "laws.md")
OUTPUT_FILE = os.getenv("OUTPUT_FILE", "output.html")
TEMPLATE_DIR = os.getenv("TEMPLATE_DIR", ".")
def load_template():
"""Load Jinja2 template from the specified directory."""
env = Environment(loader=FileSystemLoader(TEMPLATE_DIR))
return env.get_template(TEMPLATE_FILE)
def parse_markdown(md_file):
"""Parse a Markdown file and return structured law sections."""
with open(md_file, "r", encoding="utf-8") as f:
md_content = f.read()
sections = md_content.split("\n## ") # Split by Markdown headings
laws = []
for section in sections:
if section.strip():
lines = section.split("\n", 1)
title = lines[0].strip("# ").strip()
# Skip sections which do not need to be processed.
# print(f"found title: {title}")
# if "hacker-laws" in title:
# continue
content = markdown.markdown(lines[1] if len(lines) > 1 else "")
law_id = title.lower().replace(" ", "-")
laws.append({"title": title, "content": content, "id": law_id})
return laws
def generate_site():
"""Generate the static HTML file from Markdown and Jinja2 template."""
print(f"📝 Loading template from: {TEMPLATE_DIR}/{TEMPLATE_FILE}")
print(f"📖 Loading markdown from: {MARKDOWN_FILE}")
print(f"💾 Outputting HTML to: {OUTPUT_FILE}")
template = load_template()
laws = parse_markdown(MARKDOWN_FILE)
with open(OUTPUT_FILE, "w", encoding="utf-8") as f:
f.write(template.render(laws=laws))
print(f"✅ Static site generated: {OUTPUT_FILE}")
if __name__ == "__main__":
parser = argparse.ArgumentParser(description="Generate a static site from Markdown.")
parser.add_argument("--build", action="store_true", help="Build the static site.")
args = parser.parse_args()
if args.build:
generate_site()

37
.github/website/makefile vendored Normal file
View File

@@ -0,0 +1,37 @@
SHELL := /bin/bash
TEMPLATE_DIR=src
TEMPLATE_FILE=index.html.jinja
MARKDOWN_FILE=../../README.md
OUTPUT_FILE=build/index.html
default: help
.PHONY: help
help: # Show help for each of the Makefile recipes.
@grep -E '^[a-zA-Z0-9 -]+:.*#' Makefile | sort | while read -r l; do printf "\033[1;32m$$(echo $$l | cut -f 1 -d':')\033[00m:$$(echo $$l | cut -f 2- -d'#')\n"; done
.PHONY: install
install: # 📦 install dependencies
@echo "📦 Installing dependencies..."
pip install -r requirements.txt
.PHONY: build
build: #🔨 building static site
@echo "🔨 Building static site..."
TEMPLATE_FILE=$(TEMPLATE_FILE) MARKDOWN_FILE=$(MARKDOWN_FILE) OUTPUT_FILE=$(OUTPUT_FILE) TEMPLATE_DIR=$(TEMPLATE_DIR) \
python generate.py --build
.PHONY: serve
serve: # 🚀 start local server
@echo "🚀 Starting local server at http://localhost:8000..."
python3 -m http.server 8000
.PHONY: watch
watch: # 👀 Watch for changes...
@echo "👀 Watching for changes..."
watchmedo shell-command --patterns="$(MARKDOWN_FILE);*.py" --command="make build" .
.PHONY: clean
clean: #🧹 Clean up generated files
@echo "🧹 Cleaning up generated files..."
rm -f $(OUTPUT)

3
.github/website/requirements.txt vendored Normal file
View File

@@ -0,0 +1,3 @@
markdown
jinja2
watchdog

88
.github/website/src/index.html.jinja vendored Normal file
View File

@@ -0,0 +1,88 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Hacker Laws</title>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-RGJ5TDHWY9"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-RGJ5TDHWY9');
</script>
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Libre+Baskerville:wght@400;700&family=Inter:wght@400;600&display=swap" rel="stylesheet">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet" />
<!-- Bootstrap Icons -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" rel="stylesheet" />
<link rel="stylesheet" href="styles.css">
</head>
<body id="top">
<nav class="navbar navbar-expand-lg navbar-custom fixed-top">
<div class="container">
<a class="navbar-brand" href="#top">Hacker Laws</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navMenu">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navMenu">
<ul class="navbar-nav me-auto">
<li class="nav-item"><a class="nav-link" href="#">Effective Shell</a></li>
<li class="nav-item"><a class="nav-link" href="#">Sponsor</a></li>
<li class="nav-item"><a class="nav-link" href="#">Terminal AI</a></li>
</ul>
</div>
</div>
</nav>
<header class="container">
<h1>Hacker Laws</h1>
<p class="lead">Laws, Theories, Principles and Patterns that developers will find useful.</p>
</header>
<main class="container">
<section id="introduction" class="law-section">
<h2>
Introduction
<a href="#introduction" class="anchor"><i class="bi bi-link-45deg"></i></a>
</h2>
<p>There are lots of laws which people discuss when talking about development...</p>
<blockquote>“Any code of your own that you haven’t looked at for six or more months might as well have been written by someone else.” – Eagleson's Law</blockquote>
<ul>
<li><a href="#">Law of Demeter</a></li>
<li><a href="#">Pareto Principle</a></li>
<li><a href="#">Hofstadter's Law</a></li>
</ul>
<div class="social-sharing">
<a href="#" title="Share on Twitter"><i class="bi bi-twitter"></i></a>
<a href="#" title="Share on Facebook"><i class="bi bi-facebook"></i></a>
<a href="#" title="Copy Link"><i class="bi bi-clipboard"></i></a>
</div>
<div class="back-to-top"><a href="#top">↑ Back to Top</a></div>
</section>
{% for law in laws %}
<section id="{{ law.id }}" class="law-section">
<h2>
{{ law.title }}
<a href="#{{ law.id }}" class="anchor"><i class="bi bi-link-45deg"></i></a>
</h2>
{{ law.content | safe }}
<div class="social-sharing">
<a href="https://twitter.com/share?url=#{{ law.id }}" title="Share on Twitter"><i class="bi bi-twitter"></i></a>
<a href="https://facebook.com/share?url=#{{ law.id }}" title="Share on Facebook"><i class="bi bi-facebook"></i></a>
<a href="#" onclick="navigator.clipboard.writeText(window.location.href + '#{{ law.id }}'); alert('Copied!');" title="Copy Link"><i class="bi bi-clipboard"></i></a>
</div>
<div class="back-to-top"><a href="#top">↑ Back to Top</a></div>
</section>
{% endfor %}
</main>
<footer class="container text-center my-4">
<p>&copy; 2025 Hacker Laws</p>
</footer>
</body>
</html>

67
.github/website/src/styles.css vendored Normal file
View File

@@ -0,0 +1,67 @@
body {
font-family: 'Inter', sans-serif;
background-color: #fff;
color: #333;
padding-top: 70px;
}
.container {
max-width: 800px;
}
.navbar-custom {
background-color: #fff;
border-bottom: 1px solid #e5e5e5;
}
.navbar-brand, .nav-link {
font-weight: 700;
}
header {
text-align: center;
margin-bottom: 2rem;
padding: 2rem 0;
border-bottom: 1px solid #e5e5e5;
}
h1, h2 {
font-family: 'Libre Baskerville', serif;
}
.law-section {
margin-bottom: 2rem;
padding: 1.5rem;
background-color: #fff;
border-bottom: 1px solid #e5e5e5;
position: relative;
}
.law-section h2 {
position: relative;
display: flex;
align-items: center;
}
.law-section h2 a.anchor {
text-decoration: none;
color: #999;
margin-left: 0.5rem;
visibility: hidden;
}
.law-section:hover h2 a.anchor {
visibility: visible;
}
a {
color: #0056b3;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
.social-sharing a {
margin-right: 0.75rem;
font-size: 1.2rem;
color: #555;
text-decoration: none;
}
.social-sharing a:hover {
color: #000;
}
.back-to-top {
margin-top: 1rem;
}