profile/index.html at gh-pages · coder058/profile · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="Jordi Lluis. Pattern Forge, Info Desk, Relay and a Python trading bot.">
  <link rel="canonical" href="https://coder058.github.io/profile/">
  <title>Jordi Lluis — Software Developer</title>
  <link rel="icon" href="assets/favicon.svg" type="image/svg+xml">
  <link rel="stylesheet" href="enhancements.css">
  <link rel="stylesheet" href="hero.css">
  <link rel="stylesheet" href="project-squares.css?v=bbe85b4">
  <link rel="stylesheet" href="header-polish.css">
  <link rel="stylesheet" href="hero-links-polish.css">
  <link rel="stylesheet" href="other-work.css">
  <link rel="stylesheet" href="application-ready.css">
  <link rel="stylesheet" href="presentation.css">
  <script src="motion.js" defer></script>
</head>
<body>
  <a class="skip-link" href="#work">Skip to work</a>
  <div class="page-progress" aria-hidden="true"><span></span></div>
  <header class="site-header">
    <nav aria-label="Primary navigation"><a href="#work">Projects</a><a href="resume.html?v=cv">Résumé</a><a href="blog/">Blog</a></nav>
  </header>
  <main id="top">
    <section class="hero hero-v2 palette-section" data-bg="#f6f1e0" data-ink="#292824">
      <div class="hero-layout">
        <div class="hero-main">
          <h1>JORDI<br>LLUIS<span>.</span></h1>
          <p class="hero-summary">I like tackling everyday problems that used to take too long, with the tools that are actually useful now. Then I check whether what I built works.</p>
          <div class="hero-links" aria-label="Primary links">
            <a href="https://github.com/coder058" target="_blank" rel="noreferrer"><strong>GitHub</strong><b>↗</b></a>
            <a href="resume.html?v=cv"><strong>Résumé</strong><b>↓</b></a>
            <a href="mailto:joord918@gmail.com"><strong>Email</strong><b>↗</b></a>
          </div>
        </div>
        <div class="hero-profile">
          <figure class="hero-portrait">
            <img src="assets/jordi-lluis.png" alt="Portrait of Jordi Lluis">
          </figure>
        </div>
      </div>
    </section>
    <section id="work" class="work palette-section" data-bg="#c7bdaf" data-ink="#292824" aria-labelledby="work-title">
      <header class="work-header">
        <h2 id="work-title">Selected projects</h2>
        <p class="work-note">Each walkthrough has a table of components and how the data was stored.</p>
        <p class="stack-label">Tools I build with</p>
        <ul class="stack-strip">
          <li>React</li>
          <li>TypeScript</li>
          <li>Next.js</li>
          <li>Python</li>
          <li>FastAPI</li>
          <li>Ruby on Rails</li>
          <li>PostgreSQL</li>
          <li>Docker</li>
          <li>AWS</li>
          <li>CI</li>
        </ul>
      </header>
      <div class="project-grid">
        <article class="project-card card-ash reveal">
          <a href="https://pattern-forge-five.vercel.app/" aria-label="Open the Pattern Forge demo on Bitcoin 5m">
            <div class="project-copy"><h3>Pattern Forge</h3><p>Replay without look-ahead: later candles never enter the indicators. Chart and candle API; CI runs tests, Docker and a PostgreSQL restart. The public demo does not serve that database.</p><p class="project-try">Open BTC 5m</p><p class="project-proof">No look-ahead · CI Docker / Postgres restart</p><footer>REACT · TYPESCRIPT · REST APIS</footer></div>
          </a>
          <a class="project-data" href="projects/pattern-forge.html#data">Walkthrough · how the data was organised</a>
        </article>
        <article class="project-card card-sand reveal">
          <a href="https://coder058.github.io/info-desk/" aria-label="Open the Info Desk oil comparison">
            <div class="project-copy"><h3>Info Desk</h3><p>OFAC licenses, the White House oil fact sheet, and AP quotes on one claims table. Demo and evals, not a newsroom in production.</p><p class="project-try">Open the oil desk</p><p class="project-proof">Claims table · SQLite write only on approve</p><footer>PYTHON · FASTAPI · SQLITE · TOOLS</footer></div>
          </a>
          <a class="project-data" href="projects/info-desk.html#data">Walkthrough · how the data was organised</a>
        </article>
        <article class="project-card card-sand reveal">
          <a href="https://relay-ten-zeta.vercel.app/" aria-label="Open the Relay demo and load the public board">
            <div class="project-copy"><h3>Relay</h3><p>Four MCP tools and a React UI share one matcher. Paste a listing or load a sample board page; each hit is a quote, not a hiring score.</p><p class="project-try">Load the board</p><p class="project-proof">pytest in CI · one review service behind HTTP and MCP</p><footer>MCP · PYTHON · TYPESCRIPT</footer></div>
          </a>
          <a class="project-data" href="projects/relay.html#data">Walkthrough · how the data was organised</a>
        </article>
        <article class="project-card card-stone reveal">
          <a href="https://polybow-archive.vercel.app/" aria-label="Open the Python trading bot case study and ledger">
            <div class="project-copy"><h3>Python trading bot</h3><p>A 2026 Polymarket experiment: leftover cheap asks, a Dublin VPS, then a public ledger after live trading stopped.</p><p class="project-try">Open the ledger</p><p class="project-proof">Lightsail · WebSockets · JSONL recordings · ledger and timing tests</p><footer>PYTHON · AWS · CLOB APIS</footer></div>
          </a>
          <a class="project-data" href="projects/polybow.html#data">Walkthrough · how the data was organised</a>
        </article>
      </div>
    </section>
    <section id="more-challenges" class="challenges palette-section" data-bg="#e4dcc9" data-ink="#292824" aria-labelledby="challenges-title">
      <div class="challenges-window" role="region" aria-label="More challenges">
        <h2 id="challenges-title">More challenges</h2>
        <ul class="challenge-chips">
          <li><a href="https://github.com/coder058/js-geocoder" target="_blank" rel="noreferrer">Geocoder</a></li>
          <li><a href="https://github.com/coder058/js-fork-restaurants" target="_blank" rel="noreferrer">Restaurant search</a></li>
          <li><a href="https://github.com/coder058/js-weather" target="_blank" rel="noreferrer">Weather</a></li>
          <li><a href="https://github.com/coder058/js-ask-an-ai" target="_blank" rel="noreferrer">Ask an AI</a></li>
          <li><a href="https://github.com/coder058/js-ajax-autocomplete" target="_blank" rel="noreferrer">Autocomplete</a></li>
          <li><a href="https://github.com/coder058/js-anonymous-chat" target="_blank" rel="noreferrer">Chat polling</a></li>
          <li><a href="https://github.com/coder058/js-ajax-search" target="_blank" rel="noreferrer">Movie search</a></li>
          <li><a href="https://github.com/coder058/rails-stupid-coaching" target="_blank" rel="noreferrer">Stupid Coaching</a></li>
          <li><a href="https://github.com/coder058/rails-longest-word-game" target="_blank" rel="noreferrer">Longest Word Game</a></li>
          <li><a href="https://github.com/coder058/rails-task-manager" target="_blank" rel="noreferrer">Task Manager</a></li>
          <li><a href="https://github.com/coder058/rails-yelp-mvp" target="_blank" rel="noreferrer">Yelp MVP</a></li>
          <li><a href="https://github.com/coder058/rails-simple-airbnb" target="_blank" rel="noreferrer">Simple Airbnb</a></li>
          <li><a href="https://github.com/coder058/rails-wikinimous" target="_blank" rel="noreferrer">Wikinimous</a></li>
        </ul>
      </div>
    </section>
  </main>
  <footer class="site-footer"><span>© 2026</span><a href="blog/">Blog</a><a href="https://www.linkedin.com/in/jordi-lluis-14228242a/" target="_blank" rel="noreferrer">LinkedIn ↗</a></footer>
</body>
</html>