Skip to content

Commit 7dbbd2c

Browse files
cevhericevheri
committed
feat(site): say why LibreDB Studio exists, and stop underselling it by three engines
The site described what Studio does and never why it exists. The hero stated a category any competitor could claim word for word, and there was no page carrying the story at all. A new manifesto table under the studio schema now holds it: two scenes, the belief, the five things the belief forces, and the licence as a consequence rather than a gesture. engines.ts existed to stop engine counts drifting across surfaces, but the array itself had stopped at seven. Couchbase, ClickHouse and Apache Druid were missing everywhere it feeds, and three strings bypassed it to hardcode 7+ into SEO copy. A test now fails on any section copy that spells out a count. Both new headings needed an explicit {' '} after their line break: Astro drops a newline between prose and an adjacent element, so the words joined once the responsive break was hidden. Verified against the built HTML rather than the source.
1 parent 6f6c3e7 commit 7dbbd2c

6 files changed

Lines changed: 215 additions & 11 deletions

File tree

‎src/components/sections/HomeSection.astro‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -28,12 +28,14 @@ const flagship = [
2828

2929
<!-- Headline -->
3030
<h1 class="mt-6 text-4xl leading-[1.05] font-extrabold tracking-tight text-bright sm:text-5xl lg:text-6xl">
31-
The Modern, <span class="text-primary">AI-Powered</span><br class="hidden sm:block" /> SQL IDE
31+
The editor that deploys<br class="hidden sm:block" />{' '}
32+
<span class="text-primary">next to your data</span>
3233
</h1>
3334

34-
<!-- Subtitle: the seven engines read as SQL string literals — one hue, in-fiction.
35-
Each hero element states one fact once: badge = license, H1 = AI/IDE,
36-
subtitle = engines + SSO, CTAs = demo/deploy. -->
35+
<!-- Subtitle: the engines read as SQL string literals — one hue, in-fiction.
36+
The list is derived from ENGINES so the count cannot drift.
37+
Each hero element states one fact once: badge = license, H1 = the claim,
38+
subtitle = engines + where it runs, CTAs = demo/deploy. -->
3739
<p class="mt-6 max-w-2xl text-[15px] leading-relaxed text-muted sm:text-base">
3840
One editor for{' '}
3941
{
@@ -44,7 +46,7 @@ const flagship = [
4446
</>
4547
))
4648
}
47-
— in your browser, with SSO built in.
49+
— in your browser, in your cluster, or inside your own product.
4850
</p>
4951

5052
<!-- CTAs -->

‎src/components/sections/ManifestoSection.astro‎

Lines changed: 149 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,149 @@
1+
---
2+
import SectionHeader from './SectionHeader.astro';
3+
4+
// The five consequences of the belief. Each is a row of the `manifesto` table
5+
// in sections.ts (rows: 5) — keep the two in step if either changes.
6+
const consequences = [
7+
{
8+
belief: 'It runs in a browser',
9+
consequence:
10+
'Because the data is not on your machine, and neither are your teammates. A tool that has to be installed is a tool that half the team never opens.',
11+
},
12+
{
13+
belief: 'It reaches a phone',
14+
consequence:
15+
'Because the incident that needs a query does not wait for you to open a laptop. The same editor, the same connections, on the screen you already have with you.',
16+
},
17+
{
18+
belief: 'It deploys like infrastructure',
19+
consequence:
20+
'A container, a Helm chart, an OpenShift operator, a one-click template on your platform. The way everything else that sits next to a database gets installed.',
21+
},
22+
{
23+
belief: 'It embeds',
24+
consequence:
25+
'One npm package, inside your own product. The most useful place for a database editor is the thing that created the database in the first place.',
26+
},
27+
{
28+
belief: 'It holds nothing back',
29+
consequence:
30+
'Single sign-on, ER diagrams, the AI assistant and the NoSQL engines all ship in the MIT build. There is no edition where the useful parts live.',
31+
},
32+
];
33+
---
34+
35+
<div class="mx-auto max-w-5xl">
36+
<!-- Licence badge: the same fact the home hero states, restated as the premise
37+
this page argues from rather than as a feature. -->
38+
<span
39+
class="inline-flex items-center gap-2 rounded-full border border-ok/30 bg-ok-tint px-3 py-1 text-[12px] text-ok"
40+
>
41+
<span class="h-1.5 w-1.5 rounded-full bg-ok" aria-hidden="true"></span>
42+
Open source · MIT · nothing held back
43+
</span>
44+
45+
<!-- Hero -->
46+
<h1 class="mt-6 text-3xl leading-[1.1] font-extrabold tracking-tight text-bright sm:text-4xl lg:text-5xl">
47+
Databases moved to the cloud.<br class="hidden sm:block" />{' '}
48+
Their editors <span class="text-primary">stayed on the laptop.</span>
49+
</h1>
50+
<p class="mt-5 max-w-2xl text-[15px] leading-relaxed text-muted">
51+
<strong class="font-semibold text-fg">The tool goes to the data. Not the data to the tool.</strong>{' '}
52+
Everything else about LibreDB Studio follows from that one line — including the licence.
53+
</p>
54+
55+
<!-- The two scenes. This is the part of the story that is not derivable from
56+
the feature list, so it leads. -->
57+
<div class="mt-10">
58+
<SectionHeader
59+
title="How we got here"
60+
subtitle="Two moments, roughly a hundred times each, until the pattern was impossible to miss."
61+
/>
62+
<div class="grid grid-cols-1 gap-px overflow-hidden border border-edge bg-edge sm:grid-cols-2">
63+
<article class="flex flex-col bg-panel p-5">
64+
<h3 class="text-[15px] font-bold text-primary">Forty seconds, then an afternoon</h3>
65+
<p class="mt-2 text-[13px] leading-relaxed text-dim">
66+
You create a Postgres on a managed platform. It is ready in forty seconds. Then you want to look inside it —
67+
so you open a port to the internet, dig an SSH tunnel, or install a desktop client on every machine that needs
68+
one. The database took forty seconds. The window into it takes the rest of the day.
69+
</p>
70+
</article>
71+
<article class="flex flex-col bg-panel p-5">
72+
<h3 class="text-[15px] font-bold text-primary">Now multiply it</h3>
73+
<p class="mt-2 text-[13px] leading-relaxed text-dim">
74+
The team runs Postgres for the application, Mongo for documents, Redis for the cache, ClickHouse for the
75+
events. An engineer joins on Monday and spends their first days working out which data lives where, hunting
76+
connection strings, waiting on access, and installing a different tool per engine.
77+
</p>
78+
</article>
79+
</div>
80+
</div>
81+
82+
<!-- What moved and what did not -->
83+
<div class="mt-10 border-l-2 border-edge-strong bg-panel p-5">
84+
<p class="text-[14px] leading-relaxed text-dim">
85+
Databases moved. They live in Kubernetes now, on managed platforms, in a customer's VPC reached through a jump
86+
host. The tools that read them did not move. They are still desktop applications: heavy, licensed per seat,
87+
install-first, built on the assumption of one database, one laptop, and one person who never changes machines.
88+
</p>
89+
</div>
90+
91+
<!-- The consequences -->
92+
<div class="mt-10">
93+
<SectionHeader
94+
title="What the belief forces"
95+
subtitle="Take it seriously and it stops being a preference. It becomes a specification."
96+
/>
97+
<div class="grid grid-cols-1 gap-px overflow-hidden border border-edge bg-edge sm:grid-cols-2">
98+
{
99+
consequences.map((c) => (
100+
<article class="flex flex-col bg-panel p-5">
101+
<h3 class="text-[15px] font-bold text-primary">{c.belief}</h3>
102+
<p class="mt-2 text-[13px] leading-relaxed text-dim">{c.consequence}</p>
103+
</article>
104+
))
105+
}
106+
</div>
107+
</div>
108+
109+
<!-- The payoff: the licence as an engineering consequence, not a gesture. -->
110+
<div class="mt-10 border-l-2 border-primary bg-panel p-5">
111+
<p class="text-[15px] font-semibold text-bright">MIT is not generosity. It is a requirement of the architecture.</p>
112+
<p class="mt-2 text-[13.5px] text-dim">
113+
You cannot place a per-seat licensed, feature-gated tool into every environment you own. The moment single sign-on
114+
costs extra, the tool stops being deployable by default.
115+
</p>
116+
</div>
117+
118+
<!-- Why the paid product does not contradict any of the above -->
119+
<div class="mt-10 border border-edge bg-panel p-6">
120+
<h3 class="text-[16px] font-bold text-bright">Then why is Platform paid?</h3>
121+
<p class="mt-2 max-w-2xl text-[13.5px] leading-relaxed text-dim">
122+
Because it is a service rather than an environment. LibreDB <strong class="text-fg">Studio</strong> is MIT because it
123+
has to go everywhere. LibreDB <strong class="text-fg">Platform</strong> is hosting, tenancy, billing and support for
124+
teams that would rather not run Studio themselves.
125+
</p>
126+
<p class="mt-3 max-w-2xl text-[13.5px] leading-relaxed text-dim">
127+
The line holds under pressure, which is the point. The editor you deploy is free and stays free. No capability is
128+
moved across that line to manufacture a reason to upgrade.
129+
</p>
130+
</div>
131+
132+
<!-- Bridge back to the product -->
133+
<div class="mt-10 flex flex-col gap-3 sm:flex-row">
134+
<a
135+
href="https://app.libredb.org"
136+
target="_blank"
137+
rel="noopener noreferrer"
138+
class="inline-flex items-center justify-center gap-2 rounded-md bg-primary px-6 py-3 text-[15px] font-semibold text-white transition-colors hover:bg-primary-bright"
139+
>
140+
See it running
141+
</a>
142+
<a
143+
href="/get-started"
144+
class="inline-flex items-center justify-center gap-2 rounded-md border border-edge-strong bg-panel px-6 py-3 text-[15px] font-semibold text-fg transition-colors hover:border-line hover:bg-raised"
145+
>
146+
Run it yourself <span aria-hidden="true">→</span>
147+
</a>
148+
</div>
149+
</div>

‎src/data/engines.ts‎

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,15 @@
11
// Single source of truth for the supported engine list. Every surface that
22
// names or counts the engines (hero subtitle, JSON-LD, SEO copy) must derive
33
// from this array — the 7/5/4 count drift across surfaces is what this fixes.
4-
export const ENGINES = ['PostgreSQL', 'MySQL', 'Oracle', 'SQL Server', 'SQLite', 'MongoDB', 'Redis'] as const;
4+
export const ENGINES = [
5+
'PostgreSQL',
6+
'MySQL',
7+
'Oracle',
8+
'SQL Server',
9+
'SQLite',
10+
'MongoDB',
11+
'Redis',
12+
'Couchbase',
13+
'ClickHouse',
14+
'Apache Druid',
15+
] as const;

‎src/data/sections.test.ts‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,26 @@ test('support section exists at /support and names the platform columns', () =>
2929
expect(s.columns.map((c) => c.name)).toEqual(['component', 'supported', 'validated']);
3030
});
3131

32+
test('studio manifesto section exists at /manifesto and names the story columns', () => {
33+
const m = sectionById['manifesto'];
34+
expect(m).toBeDefined();
35+
expect(m.slug).toBe('manifesto');
36+
expect(m.table).toBe('manifesto');
37+
expect(m.schema).toBe('studio');
38+
// The page renders one card per consequence of the belief; renaming a column
39+
// silently breaks the parity with docs/BRAND_MESSAGING.md in libredb-studio.
40+
expect(m.columns.map((c) => c.name)).toEqual(['belief', 'consequence']);
41+
});
42+
43+
test('no section copy hardcodes an engine count', () => {
44+
// engines.ts is the single source of truth precisely so counts cannot drift.
45+
// Copy that spells out "7+ engines" goes stale the moment a provider lands.
46+
for (const s of sections) {
47+
expect(s.explain).not.toMatch(/\d\s*\+?\s*(engines|databases)/i);
48+
expect(s.pageDescription).not.toMatch(/\d\s*\+?\s*(engines|databases)/i);
49+
}
50+
});
51+
3252
test('every section has page SEO fields', () => {
3353
for (const s of sections) {
3454
expect(typeof s.slug).toBe('string');

‎src/data/sections.ts‎

Lines changed: 25 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -40,10 +40,30 @@ export const sections: SectionMeta[] = [
4040
{ name: 'stats', type: 'JSONB' },
4141
],
4242
explain:
43-
'Returns the LibreDB Studio overview: a modern, AI-powered, browser-based SQL IDE with SSO across 7+ engines — free and open source under MIT.',
43+
'Returns the LibreDB Studio overview: the database editor that deploys next to your data instead of onto your laptop, with SSO and audit across ten engines — free and open source under MIT.',
4444
slug: '',
45-
pageTitle: 'LibreDB Studio - AI-Powered Open-Source SQL IDE',
46-
pageDescription: 'LibreDB Studio - The Modern, AI-Powered Open-Source SQL IDE for Cloud-Native Teams',
45+
pageTitle: 'LibreDB Studio - The Open-Source SQL IDE That Deploys Next to Your Data',
46+
pageDescription:
47+
'LibreDB Studio is the database editor that deploys next to your data instead of onto your laptop. Ten engines in one browser tab, with SSO and audit built in. Open source under MIT.',
48+
schema: 'studio',
49+
},
50+
{
51+
id: 'manifesto',
52+
table: 'manifesto',
53+
query: 'SELECT belief, consequence FROM manifesto;',
54+
rows: 5,
55+
cols: 2,
56+
execMs: 2,
57+
columns: [
58+
{ name: 'belief', type: 'TEXT' },
59+
{ name: 'consequence', type: 'TEXT' },
60+
],
61+
explain:
62+
'Why LibreDB Studio exists: databases moved to the cloud and their editors stayed on the laptop. The tool goes to the data — which forces it to be browser-based, deployable, embeddable and unrestricted.',
63+
slug: 'manifesto',
64+
pageTitle: 'Why LibreDB Studio exists - the tool goes to the data',
65+
pageDescription:
66+
'Databases moved to the cloud. The tools that read them stayed on the laptop. LibreDB Studio deploys next to the data instead — which is why it is browser-based, deployable, embeddable, and MIT licensed with nothing held back.',
4767
schema: 'studio',
4868
},
4969
{
@@ -63,7 +83,7 @@ export const sections: SectionMeta[] = [
6383
slug: 'features',
6484
pageTitle: 'Features — LibreDB Studio SQL IDE',
6585
pageDescription:
66-
'Everything you need to master your data: Monaco SQL editor, NL2SQL Copilot, AI query safety, 7+ databases, pro data grid, visual EXPLAIN, ER diagrams, data masking, SSO and more.',
86+
'Everything you need to master your data: Monaco SQL editor, NL2SQL Copilot, AI query safety, ten database engines, pro data grid, visual EXPLAIN, ER diagrams, data masking, SSO and more.',
6787
schema: 'studio',
6888
},
6989
{
@@ -79,7 +99,7 @@ export const sections: SectionMeta[] = [
7999
{ name: 'driver', type: 'VARCHAR' },
80100
],
81101
explain:
82-
'The database engines LibreDB Studio connects to — PostgreSQL, MySQL, Oracle, SQL Server, SQLite, MongoDB, Redis — behind one unified interface, plus LibreDB, our own embedded engine.',
102+
'The database engines LibreDB Studio connects to — PostgreSQL, MySQL, Oracle, SQL Server, SQLite, MongoDB, Redis, Couchbase, ClickHouse and Apache Druid — behind one unified interface, plus LibreDB, our own embedded engine.',
83103
slug: 'providers',
84104
pageTitle: 'Supported Providers — PostgreSQL, MySQL, Oracle, SQL Server, MongoDB, Redis & LibreDB',
85105
pageDescription:

‎src/pages/[section].astro‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import SectionShell from '../components/studio/SectionShell.astro';
66
import { sections, sectionById } from '../data/sections';
77
import { sectionSeo } from '../data/section-seo';
88
9+
import ManifestoSection from '../components/sections/ManifestoSection.astro';
910
import FeaturesSection from '../components/sections/FeaturesSection.astro';
1011
import ProvidersSection from '../components/sections/ProvidersSection.astro';
1112
import CompareSection from '../components/sections/CompareSection.astro';
@@ -29,6 +30,7 @@ export function getStaticPaths() {
2930
}
3031
3132
const COMPONENTS: Record<string, any> = {
33+
manifesto: ManifestoSection,
3234
features: FeaturesSection,
3335
providers: ProvidersSection,
3436
compare: CompareSection,

0 commit comments

Comments
 (0)