Brandon Lucas
7e76acab18
Website rebuilt from scratch based on analysis of 11 beloved language websites (Elm, Zig, Gleam, Swift, Kotlin, Haskell, OCaml, Crystal, Roc, Rust, Go). New website structure: - Homepage with hero, playground, three pillars, install guide - Language Tour with interactive lessons (hello world, types, effects) - Examples cookbook with categorized sidebar - API documentation index - Installation guide (Nix and source) - Sleek/noble design (black/gold, serif typography) Also includes: - New stdlib/json.lux module for JSON serialization - Enhanced stdlib/http.lux with middleware and routing - New string functions (charAt, indexOf, lastIndexOf, repeat) - LSP improvements (rename, signature help, formatting) - Package manager transitive dependency resolution - Updated documentation for effects and stdlib - New showcase example (task_manager.lux) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
106 lines
5.2 KiB
HTML
106 lines
5.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Tour of Lux</title>
|
|
<meta name="description" content="Learn Lux step by step with interactive examples.">
|
|
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='.9em' font-size='90'>✨</text></svg>">
|
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;600&family=Playfair+Display:wght@400;600;700&family=Source+Serif+4:opsz,wght@8..60,400;8..60,500;8..60,600&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="../static/style.css">
|
|
<link rel="stylesheet" href="../static/tour.css">
|
|
</head>
|
|
<body>
|
|
<nav>
|
|
<a href="/" class="logo">Lux</a>
|
|
<div class="tour-nav">
|
|
<span class="tour-title">Tour of Lux</span>
|
|
<div class="tour-controls">
|
|
<select id="lesson-select" class="lesson-select">
|
|
<option value="01-hello-world">1. Hello World</option>
|
|
<option value="02-values-types">2. Values & Types</option>
|
|
<option value="03-functions">3. Functions</option>
|
|
<option value="04-custom-types">4. Custom Types</option>
|
|
<option value="05-pattern-matching">5. Pattern Matching</option>
|
|
<option value="06-effects-intro">6. Effects: The Basics</option>
|
|
<option value="07-using-effects">7. Using Multiple Effects</option>
|
|
<option value="08-custom-handlers">8. Custom Handlers</option>
|
|
<option value="09-testing-effects">9. Testing with Effects</option>
|
|
<option value="10-modules">10. Modules</option>
|
|
<option value="11-behavioral-types">11. Behavioral Types</option>
|
|
<option value="12-compilation">12. Compilation</option>
|
|
</select>
|
|
<span class="tour-progress">1 of 12</span>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<main class="tour-container">
|
|
<article class="tour-content">
|
|
<h1>Welcome to the Tour of Lux</h1>
|
|
|
|
<p>This tour will teach you the Lux programming language step by step. Each lesson includes editable code examples that you can run directly in your browser.</p>
|
|
|
|
<h2>What You'll Learn</h2>
|
|
|
|
<div class="tour-overview">
|
|
<div class="tour-section">
|
|
<h3>Basics (1-5)</h3>
|
|
<ul>
|
|
<li><a href="01-hello-world.html">Hello World</a> - Your first Lux program</li>
|
|
<li><a href="02-values-types.html">Values & Types</a> - Int, Float, String, Bool</li>
|
|
<li><a href="03-functions.html">Functions</a> - Defining and calling functions</li>
|
|
<li><a href="04-custom-types.html">Custom Types</a> - Records and variants</li>
|
|
<li><a href="05-pattern-matching.html">Pattern Matching</a> - Destructuring data</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="tour-section">
|
|
<h3>Effects (6-9)</h3>
|
|
<ul>
|
|
<li><a href="06-effects-intro.html">Effects: The Basics</a> - What makes Lux special</li>
|
|
<li><a href="07-using-effects.html">Using Multiple Effects</a> - Composition</li>
|
|
<li><a href="08-custom-handlers.html">Custom Handlers</a> - Control behavior</li>
|
|
<li><a href="09-testing-effects.html">Testing with Effects</a> - No mocks needed</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="tour-section">
|
|
<h3>Advanced (10-12)</h3>
|
|
<ul>
|
|
<li><a href="10-modules.html">Modules</a> - Organizing code</li>
|
|
<li><a href="11-behavioral-types.html">Behavioral Types</a> - Compiler guarantees</li>
|
|
<li><a href="12-compilation.html">Compilation</a> - Native performance</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<h2>Prerequisites</h2>
|
|
|
|
<p>This tour assumes basic programming experience. If you know any language (JavaScript, Python, Java, etc.), you're ready to learn Lux.</p>
|
|
|
|
<h2>How It Works</h2>
|
|
|
|
<ul>
|
|
<li>Each lesson has <strong>editable code</strong> - try changing it!</li>
|
|
<li>Click <strong>Run</strong> to execute the code</li>
|
|
<li>Use <strong>Ctrl+Enter</strong> as a keyboard shortcut</li>
|
|
<li>Navigate with the dropdown or prev/next buttons</li>
|
|
</ul>
|
|
|
|
<div class="tour-start">
|
|
<a href="01-hello-world.html" class="btn btn-primary">Start the Tour</a>
|
|
</div>
|
|
</article>
|
|
</main>
|
|
|
|
<script>
|
|
document.getElementById('lesson-select').addEventListener('change', function() {
|
|
window.location.href = this.value + '.html';
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|