-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
492 lines (463 loc) · 31.7 KB
/
index.html
File metadata and controls
492 lines (463 loc) · 31.7 KB
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
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Zikra — Shared Memory for Claude Code, Gemini & Codex</title>
<meta name="description" content="Secure shared memory for your whole team. Claude Code, Gemini CLI, and Codex share context, pass requirements, and approve decisions. Self-hosted. MIT free.">
<meta name="keywords" content="Claude Code memory, persistent memory AI agents, MCP memory server, cross-session context Claude, Claude Code persistent context, AI agent shared memory, MCP server Python, self-hosted MCP server, zikra, zikra.dev">
<link rel="canonical" href="https://zikra.dev" />
<link rel="llms-txt" href="/llms.txt" />
<link rel="llms-full-txt" href="/llms-full.txt" />
<!-- Open Graph -->
<meta property="og:title" content="Zikra — Persistent Memory for Claude Code and AI Agents" />
<meta property="og:description" content="Claude Code forgets everything between sessions. Zikra fixes that — one shared memory pool for all your AI tools. Free, self-hosted, MIT licensed." />
<meta property="og:url" content="https://zikra.dev" />
<meta property="og:type" content="website" />
<!-- Twitter Card -->
<meta name="twitter:card" content="summary" />
<meta name="twitter:title" content="Zikra — Persistent Memory for Claude Code" />
<meta name="twitter:description" content="Claude Code forgets everything between sessions. Zikra fixes that." />
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<link rel="stylesheet" href="style.css">
<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=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
</head>
<body>
<div class="blob blob-1"></div>
<div class="blob blob-2"></div>
<div class="blob blob-3"></div>
<nav class="navbar glass">
<a href="index.html" class="logo"><span class="z">Z</span><span class="ikra">ikra</span></a>
<div class="nav-links">
<a href="index.html">Zikra</a>
<a href="install.html">How to Install</a>
<a href="changelog.html">Changelog</a>
<a href="license.html">MIT</a>
</div>
<a href="changelog.html" class="version-badge" id="version-badge">v1.0.7</a>
</nav>
<!-- ── Hero ─────────────────────────────────────────────────────────────────── -->
<header class="hero reveal">
<div class="badge pulse">Built out of frustration — not a pitch deck</div>
<h1 class="hero-title">The first persistent memory layer <span class="gradient-text">built for AI agent teams</span></h1>
<p class="hero-sub">
Zikra gives every AI agent on your team — Claude, Codex, and Gemini — shared memory that survives across sessions, roles, and platforms.
</p>
<p class="hero-sub" style="font-size:1rem;margin-top:-0.5rem;margin-bottom:2rem;">
Stop losing context when you switch agents. Stop re-explaining your project to every new session. One memory layer. Every agent. Every team member.
</p>
<div class="hero-cta">
<a href="https://github.com/GetZikra/zikra" class="btn btn-primary btn-lg btn-glow" target="_blank" rel="noopener">Star on GitHub</a>
<a href="install.html" class="btn btn-ghost btn-lg">How to Install</a>
</div>
<div class="terminal glass float reveal">
<div class="terminal-header">
<div class="dot dot-r"></div>
<div class="dot dot-y"></div>
<div class="dot dot-g"></div>
<span class="terminal-label">zikra — live memory</span>
</div>
<div class="terminal-body">
<span><span class="prompt">$</span> curl -s -X POST http://localhost:8000/webhook/zikra \</span>
<span class="t-out t-anim"> -H "Authorization: Bearer $ZIKRA_TOKEN" \</span>
<span class="t-out t-anim"> -d '{"command":"search","project":"myapp","query":"how does auth work"}'</span>
<span class="t-dim t-anim">──────────────────────────────────────────────────</span>
<span class="t-success t-anim">✓ score 0.94 │ auth uses JWT tokens</span>
<span class="t-success t-anim">✓ score 0.87 │ session expiry set to 7 days in prod</span>
<span class="t-stat t-anim"> 2 results · 38 tokens · your agent remembers</span>
</div>
</div>
</header>
<!-- ── Features Table ──────────────────────────────────────────────────────────── -->
<section id="capabilities" class="section reveal">
<h2 class="section-title">What Zikra does</h2>
<p class="section-subtitle">One memory pool for your whole team. Claude, Gemini, and Codex share context,
pass requirements, and approve decisions — automatically, across every machine.</p>
<div style="margin-bottom: 4rem;">
<h3 style="font-size: 1.5rem; margin-bottom: 1.5rem; text-align: center;">Core capabilities</h3>
<div class="glass" style="border-radius:14px;overflow:hidden;">
<table class="cmd-table" style="width: 100%;">
<thead>
<tr><th>Feature</th><th>What it does</th></tr>
</thead>
<tbody>
<tr>
<td><span class="cmd-name">Shared persistent memory</span></td>
<td class="cmd-desc">One PostgreSQL pool. Every agent, every machine, every session reads and writes the same context. Decisions made in Claude Web are visible in Claude Code seconds later.</td>
</tr>
<tr>
<td><span class="cmd-name">Agent-agnostic</span></td>
<td class="cmd-desc">Claude Code (MCP native at <code style="font-family:'JetBrains Mono',monospace;font-size:0.85em;">/mcp</code>), OpenAI Codex (webhook at <code style="font-family:'JetBrains Mono',monospace;font-size:0.85em;">/webhook/zikra</code>), Gemini CLI (webhook at <code style="font-family:'JetBrains Mono',monospace;font-size:0.85em;">/webhook/zikra</code>), any MCP client (standard MCP protocol). Same token. Same memory pool.</td>
</tr>
<tr>
<td><span class="cmd-name">Role-based access</span></td>
<td class="cmd-desc">owner, admin, developer, viewer. Enforced at the router. Owners create tokens and promote requirements. Developers write and search. Viewers read only.</td>
</tr>
<tr>
<td><span class="cmd-name">Smart ranking</span></td>
<td class="cmd-desc">Search results are re-ranked by age, access frequency, and confidence — recent and well-used memories surface first.</td>
</tr>
<tr>
<td><span class="cmd-name">Requirements pipeline</span></td>
<td class="cmd-desc">A business user writes a requirement in Copilot or any AI. Owner promotes it. Developer pulls and executes it in Claude Code. Full traceability from spec to execution.</td>
</tr>
</tbody>
</table>
</div>
</div>
<div>
<h3 style="font-size: 1.5rem; margin-bottom: 1.5rem; text-align: center;">Full feature set</h3>
<div class="glass" style="border-radius:14px;overflow:hidden;">
<table class="cmd-table" style="width: 100%;">
<thead>
<tr><th>Feature</th><th>Purpose</th></tr>
</thead>
<tbody>
<tr><td><span class="cmd-name">Hybrid search</span></td><td class="cmd-desc">Vector search with keyword fallback — semantic embeddings when available, full-text keyword search when not.</td></tr>
<tr><td><span class="cmd-name">Token-budget results</span></td><td class="cmd-desc">Results are tiered and capped. Never floods your context window.</td></tr>
<tr><td><span class="cmd-name">Auto-save on session end</span></td><td class="cmd-desc">Claude Code Stop hook fires on close. No manual saving.</td></tr>
<tr><td><span class="cmd-name">PreCompact hook</span></td><td class="cmd-desc">Saves a summary before Claude's context resets. Nothing lost at compaction.</td></tr>
<tr><td><span class="cmd-name">Multi-user tokens</span></td><td class="cmd-desc">Each person gets a scoped bearer token. Identity tracked on every write.</td></tr>
<tr><td><span class="cmd-name">Promote to prompt</span></td><td class="cmd-desc">Owner approves a requirement — it becomes a live executable prompt.</td></tr>
<tr><td><span class="cmd-name">Schema storage</span></td><td class="cmd-desc">Store and retrieve DB schema per project and module. Any agent pulls current version before touching backend code.</td></tr>
<tr><td><span class="cmd-name">Error logging</span></td><td class="cmd-desc">Any agent logs a bug with full context. Vector-embedded, searchable, tracked to resolution.</td></tr>
<tr><td><span class="cmd-name">Debug protocol</span></td><td class="cmd-desc">Named prompt: read the error, search memory, check resolutions, fix, log. Any agent follows it.</td></tr>
<tr><td><span class="cmd-name">Session tracking</span></td><td class="cmd-desc">Every run logged — tokens, cost, files modified, status, linked to the prompt that triggered it.</td></tr>
<tr><td><span class="cmd-name">Active runs table</span></td><td class="cmd-desc">See which machine is running which prompt in real time across your team.</td></tr>
<tr><td><span class="cmd-name">Statusline bar</span></td><td class="cmd-desc">Live in your terminal. Run count, memory count, model, project, context usage. Skull at 600K tokens.</td></tr>
<tr><td><span class="cmd-name">n8n dashboard</span></td><td class="cmd-desc">Web interface for browsing, searching, and managing all memories via n8n + direct DB access.</td></tr>
<tr><td><span class="cmd-name">MCP native</span></td><td class="cmd-desc">Claude connects via MCP trigger. No custom integration.</td></tr>
<tr><td><span class="cmd-name">Alias normaliser</span></td><td class="cmd-desc">"find", "recall", "remember", "query" all route correctly. Agents don't need exact command names.</td></tr>
<tr><td><span class="cmd-name">Self-documenting API</span></td><td class="cmd-desc">Unknown command returns full reference with examples. No external docs needed at runtime.</td></tr>
</tbody>
</table>
</div>
</div>
</section>
<!-- ── The Journey ───────────────────────────────────────────────────────────── -->
<section id="story" class="section reveal">
<h2 class="section-title">How we got here</h2>
<p class="section-subtitle">No polished origin story. Just a real problem that kept getting worse.</p>
<div class="journey-timeline">
<div class="jt-step reveal">
<div class="jt-avatars">
<div class="agent-chip av-human av-lg">M</div>
</div>
<div class="jt-content card glass">
<span class="step-tag">The frustration</span>
<p>"I like doing my architecture and research on Claude Web. It can browse sites, do deep research, give real suggestions on system design. But when it came time to actually run the code — that's Claude Code's job. The problem? They don't talk to each other. Every new session, you're starting from scratch. Claude Code had no idea what Claude Web and I had just spent an hour designing."</p>
<cite>— Mukarram, founder</cite>
</div>
</div>
<div class="jt-step reveal">
<div class="jt-avatars">
<div class="agent-chip av-human av-lg">M</div>
</div>
<div class="jt-content card glass">
<span class="step-tag">The first build</span>
<p>Started with a simple webhook and SQLite. Then added vector search. Then wired it into Claude Code stop hooks so it ran automatically at the end of every session. You never had to type "save this" — it just happened. Months later it was saving hours a week. We called it Zikra — Arabic for memory.</p>
</div>
</div>
<div class="jt-step reveal">
<div class="jt-avatars">
<div class="agent-chip av-human av-sm">M</div>
<div class="agent-chip av-team av-sm">A</div>
<div class="agent-chip av-team av-sm">R</div>
</div>
<div class="jt-content card glass">
<span class="step-tag">The team joined</span>
<p>More people joined the project. Suddenly one person is on Claude Web doing research, another validating requirements and writing prompts, Claude Code just executing. Decisions made in one session were invisible to everyone else — two developers would build in opposite directions and not find out until a late-night code review argument. That's when we needed a shared memory layer with real concurrency. We moved to Postgres.</p>
</div>
</div>
<div class="jt-step reveal">
<div class="jt-avatars">
<div class="agent-chip av-cweb av-sm">CW</div>
<div class="agent-chip av-ccode av-sm">CC</div>
<div class="agent-chip av-gpt av-sm">GPT</div>
</div>
<div class="jt-content card glass">
<span class="step-tag">Agent agnostic</span>
<p>"We even use ChatGPT sometimes when Claude Web is being stubborn about writing a prompt. Doesn't matter. The same MCP server works for all of them. That's Zikra. Not built for a pitch deck. Built because we actually needed it."</p>
<cite>— Mukarram</cite>
</div>
</div>
</div>
</section>
<!-- ── The Problem ───────────────────────────────────────────────────────────── -->
<section id="problem" class="section reveal">
<h2 class="section-title">The problem, clearly</h2>
<p class="section-subtitle">Your agents are stateless. Your team isn't. Zikra bridges the gap.</p>
<div class="grid-3">
<div class="card glass">
<div class="card-icon">🧠</div>
<h3>Team memory</h3>
<p>
Your AI agents don't remember yesterday. Your team does — but they're spending hours re-explaining context to every new session. Zikra fixes this. One persistent memory layer shared by every agent on your team, across every platform you use.
</p>
</div>
<div class="card glass">
<div class="card-icon">🔗</div>
<h3>Cross-platform continuity</h3>
<p>
Your Claude, Codex, and Gemini subscriptions are running in silos. Memory written in one platform disappears the moment you switch. Zikra connects them. Run your tests in Claude Code. Validate the results in Gemini CLI. Review in Codex. The memory follows the work, not the platform.
</p>
</div>
<div class="card glass">
<div class="card-icon">🔑</div>
<h3>Role-based access</h3>
<p>
Not every agent needs to see everything. Zikra gives owners, admins, developers, and viewers scoped access to memories, prompts, requirements, and session logs — per project, per run.
</p>
</div>
</div>
</section>
<!-- ── What it actually does ─────────────────────────────────────────────────── -->
<section class="section reveal">
<div class="feature-row">
<div class="feature-text">
<span class="step-tag">The core idea</span>
<h3>One memory. Every agent reads from it.</h3>
<p>
Zikra is a small server that sits between your AI tools and a database.
Every agent — Claude, Cursor, Gemini, ChatGPT — can save and search
the same pool of context. Architecture decisions, error patterns,
requirements, runbook prompts.
</p>
<p>
One POST to save. One POST to search. It's not magic — it's just
memory that actually persists.
</p>
<ul class="check-list">
<li>Hybrid vector + keyword search — finds things by meaning, not just exact words</li>
<li>Hooks fire automatically at session end — no manual saving</li>
<li>Token budget on results — never floods your context window</li>
</ul>
</div>
<div class="feature-visual">
<div class="code-block">
<span class="c-comment"># Step 1 — Claude Code saves a test result to shared memory</span>
<span class="c-out">POST /webhook/zikra</span>
<span class="c-out">Authorization: Bearer <your-token></span>
<span class="c-key">{</span>
<span class="c-key">"command"</span>: <span class="c-val">"save_memory"</span>,
<span class="c-key">"project"</span>: <span class="c-val">"payments-api"</span>,
<span class="c-key">"title"</span>: <span class="c-val">"Auth flow test — passed"</span>,
<span class="c-key">"content"</span>: <span class="c-val">"OAuth2 PKCE flow validated on staging. Token refresh working correctly."</span>,
<span class="c-key">"memory_type"</span>: <span class="c-val">"test_result"</span>
<span class="c-key">}</span>
<span class="c-comment"># Step 2 — Gemini CLI reads it on a different machine, minutes later</span>
<span class="c-out">POST /webhook/zikra</span>
<span class="c-out">Authorization: Bearer <your-token></span>
<span class="c-key">{</span>
<span class="c-key">"command"</span>: <span class="c-val">"search"</span>,
<span class="c-key">"project"</span>: <span class="c-val">"payments-api"</span>,
<span class="c-key">"query"</span>: <span class="c-val">"auth flow test results"</span>
<span class="c-key">}</span>
<span class="c-success"># Returns the memory Claude wrote — same project, same context, different platform</span>
</div>
</div>
</div>
<div class="feature-row flip">
<div class="feature-text">
<span class="step-tag">The part we're proudest of</span>
<h3>Automatic. You don't think about it.</h3>
<p>
The hardest part of any memory system is using it consistently.
Claude Code hooks solve that. A Stop hook fires the moment a session ends
and logs everything automatically. You never type "save this" — it just happens.
</p>
<p>
The statusline shows your memory count and session stats right in your terminal.
After a while you stop noticing it's there — you just notice Claude
always seems to know your codebase.
</p>
<ul class="check-list">
<li>Stop hook logs every Claude Code session on close</li>
<li>PreCompact hook saves context before the window resets</li>
<li>Neovim and Claude Code statusline — live memory stats</li>
</ul>
</div>
<div class="feature-visual">
<div class="code-block">
<span class="c-comment"># What Claude sees at session start</span>
<span class="c-comment"># (injected from CLAUDE.md automatically)</span>
<span class="c-out">## Recent memory — myapp</span>
<span class="c-out"></span>
<span class="c-success">▸ auth uses JWT tokens (0.94)</span>
<span class="c-out"> JWT with 7-day expiry. Refresh in httpOnly cookie.</span>
<span class="c-out"></span>
<span class="c-success">▸ payments use Stripe (0.88)</span>
<span class="c-out"> Stripe Checkout. No card data on our servers.</span>
<span class="c-out"></span>
<span class="c-out"> 17 runs · 847 memories · last sync 2m ago</span>
</div>
</div>
</div>
</section>
<!-- ── Share with your team ──────────────────────────────────────────────────── -->
<section class="section reveal">
<h2 class="section-title">Share with your team</h2>
<p class="section-subtitle">
Zikra runs on your machine or your server. Getting teammates connected
takes one of three approaches depending on where they are.
</p>
<div class="grid-3">
<div class="card glass">
<div class="card-icon">🏠</div>
<h3>Same network</h3>
<p>
Start Zikra with <code style="font-family:'JetBrains Mono',monospace;font-size:0.85rem;color:#FFB77A;">--host 0.0.0.0</code>
and share your local IP. Anyone on the same wifi or office
network connects to <code style="font-family:'JetBrains Mono',monospace;font-size:0.85rem;color:#FFB77A;">http://YOUR-IP:8000</code>
and they're in. Nothing else to install.
</p>
</div>
<div class="card glass">
<div class="card-icon">🌐</div>
<h3>Remote teammates — Cloudflare Tunnel</h3>
<p>
One-time setup, five minutes, free forever. Cloudflare gives your
local Zikra a permanent public URL like
<code style="font-family:'JetBrains Mono',monospace;font-size:0.85rem;color:#FFB77A;">zikra.yourteam.com</code>
— no ports to open, no router config, no commands to run each time.
See the <a href="https://github.com/GetZikra/zikra" style="color:var(--primary);" target="_blank" rel="noopener">setup steps in the README</a>.
</p>
</div>
<div class="card glass">
<div class="card-icon">🖥️</div>
<h3>Real server — PostgreSQL backend</h3>
<p>
When your team needs something that runs permanently with shared
concurrent writes, set <code style="font-family:'JetBrains Mono',monospace;font-size:0.85rem;color:#FFB77A;">DB_BACKEND=postgres</code>
in your <code style="font-family:'JetBrains Mono',monospace;font-size:0.85rem;color:#FFB77A;">.env</code>.
Same API, same commands, same Claude Code config — backed by PostgreSQL + pgvector.
</p>
</div>
</div>
</section>
<!-- ── Get started in 3 steps ─────────────────────────────────────────────────── -->
<section id="onboarding" class="section reveal">
<h2 class="section-title">Get started in 3 steps</h2>
<p class="section-subtitle">From zero to persistent memory across every session. Takes about 5 minutes.</p>
<div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;max-width:1000px;margin:0 auto;">
<div class="card glass">
<div class="card-icon">1</div>
<h3>Install the server</h3>
<p style="font-size:0.9rem;">
Clone and run the interactive installer. One Python process. No Docker required.
</p>
<div class="code-block" style="font-size:0.8rem;padding:1rem;margin-top:1rem;">
<span style="color:#FFB77A;">git clone https://github.com/GetZikra/zikra</span>
<span style="color:var(--muted);display:block;margin-top:0.5rem;">cd zikra && pip install -e .</span>
<span style="color:var(--muted);display:block;margin-top:0.25rem;">python3 installer.py</span>
<span style="color:var(--muted);display:block;margin-top:0.25rem;">python3 -m zikra</span>
</div>
<p style="font-size:0.8rem;color:var(--muted);margin-top:0.75rem;">
To expose it publicly: <code style="color:#FFB77A;font-size:0.78rem;">cloudflared tunnel --url http://localhost:8000</code>
</p>
</div>
<div class="card glass">
<div class="card-icon">2</div>
<h3>Enable MCP in Claude Code</h3>
<p style="font-size:0.9rem;">
Open <strong>Claude Code → Settings → MCP → Add Server</strong> and paste your server URL:
</p>
<div class="code-block" style="font-size:0.75rem;padding:1rem;margin-top:1rem;">
<span style="color:#FFB77A;">"mcpServers": {</span>
<span style="color:#FFB77A;display:block;"> "zikra": {</span>
<span style="color:var(--muted);display:block;"> "url": "http://your-server:8000/mcp",</span>
<span style="color:var(--muted);display:block;"> "headers": {"Authorization": "Bearer YOUR_TOKEN"}</span>
<span style="color:#FFB77A;display:block;"> }}</span>
</div>
<p style="font-size:0.8rem;color:var(--muted);margin-top:0.75rem;">
The installer does this automatically for local installs.
</p>
</div>
<div class="card glass">
<div class="card-icon">3</div>
<h3>Run the onboarding prompt</h3>
<p style="font-size:0.9rem;">
Paste this into any Claude Code session. It installs the Stop hook, PreCompact hook, and live statusline bar automatically.
</p>
<div class="code-block" style="font-size:0.75rem;padding:1rem;margin-top:1rem;">
<span style="color:#FFB77A;">Fetch https://raw.githubusercontent.com/</span>
<span style="color:#FFB77A;display:block;">GetZikra/zikra/main/prompts/zikra-claude-code-setup.md</span>
<span style="color:#FFB77A;display:block;">and follow every instruction in it.</span>
</div>
<p style="font-size:0.8rem;color:var(--muted);margin-top:0.75rem;">
Claude Code will ask for your server URL and token, then configure everything.
Gemini CLI and Codex setup prompts coming soon.
</p>
</div>
</div>
</section>
<!-- ── How to update ──────────────────────────────────────────────────────────── -->
<section class="section reveal">
<h2 class="section-title">Keeping Zikra updated</h2>
<p class="section-subtitle">Server and Claude Code hooks update independently. Both are one command.</p>
<div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;max-width:760px;margin:0 auto;">
<div class="card glass">
<div class="card-icon">🖥️</div>
<h3>Update the server</h3>
<p style="font-size:0.9rem;color:var(--muted);">Pull latest and restart. No config changes needed.</p>
<div class="code-block" style="font-size:0.8rem;padding:1rem;margin-top:1rem;">
<span style="color:#FFB77A;">git pull origin main</span>
<span style="color:var(--muted);display:block;margin-top:0.5rem;">pip install -e .</span>
<span style="color:var(--muted);display:block;margin-top:0.25rem;">python3 -m zikra</span>
</div>
</div>
<div class="card glass">
<div class="card-icon">⚡</div>
<h3>Update Claude Code hooks</h3>
<p style="font-size:0.9rem;color:var(--muted);">Re-run the same onboarding prompt. It detects your existing install and only refreshes what changed. Token and config preserved.</p>
<div class="code-block" style="font-size:0.75rem;padding:1rem;margin-top:1rem;">
<span style="color:#FFB77A;">Fetch https://raw.githubusercontent.com/</span>
<span style="color:#FFB77A;display:block;">GetZikra/zikra/main/prompts/zikra-claude-code-setup.md</span>
<span style="color:#FFB77A;display:block;">and follow every instruction in it.</span>
</div>
<p style="font-size:0.8rem;color:var(--muted);margin-top:0.75rem;">MCP server settings never need manual updates.</p>
</div>
</div>
</section>
<!-- ── From Mukarram ─────────────────────────────────────────────────────────── -->
<section class="section reveal">
<div style="max-width:720px;margin:0 auto;">
<div class="card glass" style="padding:2.5rem 3rem;text-align:center;">
<div class="agent-chip av-human av-xl" style="margin:0 auto 1.5rem;">M</div>
<h3 style="font-size:1.6rem;margin-bottom:1rem;">This isn't a product pitch. It's a tool we use every day.</h3>
<p style="color:var(--muted);font-size:1.05rem;line-height:1.8;margin-bottom:1rem;">
Zikra started as an internal tool. We weren't trying to build a product —
we were just trying to stop wasting time. It's free, self-hosted, and takes
about two minutes to set up. If it helps, great. If something's broken, open an issue.
</p>
<p style="color:var(--muted);font-size:1rem;line-height:1.8;margin-bottom:2rem;">
We're actively using it ourselves, so issues get fixed fast.
</p>
<p style="color:#FFB77A;font-size:0.95rem;margin-bottom:2rem;">— Mukarram</p>
<div style="display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;">
<a href="install.html" class="btn btn-primary btn-lg btn-glow">How to Install</a>
<a href="https://github.com/GetZikra/zikra" class="btn btn-github btn-lg" target="_blank" rel="noopener">
<svg width="16" height="16" fill="currentColor" viewBox="0 0 24 24"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.3 3.44 9.8 8.21 11.39.6.11.82-.26.82-.58v-2.03c-3.34.73-4.04-1.6-4.04-1.6-.55-1.38-1.33-1.75-1.33-1.75-1.09-.74.08-.73.08-.73 1.2.08 1.84 1.24 1.84 1.24 1.07 1.83 2.81 1.3 3.5.99.1-.78.42-1.3.76-1.6-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.12-.3-.54-1.52.12-3.18 0 0 1.01-.32 3.3 1.23a11.5 11.5 0 0 1 3-.4c1.02 0 2.04.13 3 .4 2.28-1.55 3.29-1.23 3.29-1.23.66 1.66.24 2.88.12 3.18.77.84 1.23 1.91 1.23 3.22 0 4.61-2.81 5.63-5.48 5.92.43.37.81 1.1.81 2.22v3.29c0 .32.22.7.83.58C20.57 21.79 24 17.3 24 12c0-6.63-5.37-12-12-12z"/></svg>
Star on GitHub
</a>
</div>
</div>
</div>
</section>
<footer class="glass">
<div class="footer-inner">
<a href="index.html" class="logo"><span class="z">Z</span><span class="ikra">ikra</span></a>
<span class="footer-copy">© 2026 Zikra Contributors — MIT Licensed</span>
<div class="footer-links">
<a href="install.html">How to Install</a>
<a href="changelog.html">Changelog</a>
<a href="license.html">MIT</a>
<a href="https://github.com/GetZikra/zikra" target="_blank" rel="noopener">GitHub</a>
</div>
</div>
</footer>
<script src="script.js"></script>
</body>
</html>