development
tsx 361 lines 15.7 KB
Raw
1 import type { Metadata } from "next";
2 import Link from "next/link";
3 import { StructuredData } from "@/components/structured-data";
4 import { absoluteUrl, genPageMetadata } from "../seo";
5
6 const comparisonRows = [
7 {
8 label: "What it is",
9 smbcloud:
10 "A data layer service managed inside your smbCloud project alongside Deploy, Auth, and Mail.",
11 neon: "A serverless PostgreSQL platform with instant branching, autoscaling, and a generous free tier.",
12 },
13 {
14 label: "Best fit",
15 smbcloud:
16 "Teams that want always-on database management without cold starts or serverless compute trade-offs.",
17 neon: "Teams building on serverless or edge infrastructure that want Postgres to scale down to zero.",
18 },
19 {
20 label: "Cold starts",
21 smbcloud:
22 "No serverless compute model. Database connections behave like a standard managed database.",
23 neon: "Serverless by design. Databases can pause and wake on first connection, which may add latency.",
24 },
25 {
26 label: "Branching",
27 smbcloud:
28 "Standard database management. Use your framework migration tooling the same way you always have.",
29 neon: "Instant Postgres branching, a core feature for preview environments and development workflows.",
30 },
31 {
32 label: "Why teams pick it",
33 smbcloud:
34 "Because they want a predictable always-on data layer inside one coherent platform.",
35 neon: "Because they want Postgres that scales to zero on the free tier and integrates with serverless workflows.",
36 },
37 ];
38
39 const smbcloudFits = [
40 "You want an always-on database without cold start concerns.",
41 "You are already using smbCloud Deploy or Auth and want the data layer in the same place.",
42 "You do not need Postgres branching for preview environments or CI workflows.",
43 "You prefer a predictable operational model over serverless autoscaling.",
44 ];
45
46 const neonStillFits = [
47 "Your architecture is serverless or edge-first and you want Postgres that matches it.",
48 "You rely on Neon's branching for preview environments or per-PR databases.",
49 "The free tier's scale-to-zero behavior saves you real money.",
50 "You are deeply integrated with Neon's serverless driver or platform integrations.",
51 ];
52
53 const faqs = [
54 {
55 question: "Is smbCloud GresIQ a Neon replacement?",
56 answer:
57 "For teams running traditional server-side apps that want an always-on managed database, it can be. If you never leaned on Neon's serverless scaling or branching features, GresIQ is worth evaluating.",
58 },
59 {
60 question: "Does GresIQ support PostgreSQL?",
61 answer:
62 "GresIQ is built for relational database management and is designed to work alongside the smbCloud stack. It is not built around the serverless Postgres model the way Neon is.",
63 },
64 {
65 question: "Will I notice cold starts with GresIQ?",
66 answer:
67 "No. GresIQ does not use a serverless compute model. Your database stays on and connections behave the same way they would with any managed relational database.",
68 },
69 {
70 question: "Who should consider switching from Neon to GresIQ?",
71 answer:
72 "Teams using Neon as a hosted Postgres instance that do not rely on branching or scale-to-zero and would prefer to manage less tooling across fewer platforms.",
73 },
74 ];
75
76 export const metadata: Metadata = {
77 ...genPageMetadata({
78 title: "Neon alternative for teams that want always-on managed Postgres",
79 description:
80 "Looking for a Neon alternative? smbCloud GresIQ is an always-on data layer inside the same platform as your app, auth, and mail, with no cold starts or serverless trade-offs.",
81 path: "/neon-alternative",
82 keywords: [
83 "Neon alternative",
84 "Neon Postgres alternative",
85 "serverless Postgres alternative",
86 "always-on managed database",
87 "GresIQ database",
88 "smbCloud GresIQ",
89 "managed PostgreSQL",
90 ],
91 }),
92 };
93
94 const structuredData = {
95 "@context": "https://schema.org",
96 "@graph": [
97 {
98 "@type": "WebPage",
99 "@id": absoluteUrl("/neon-alternative#webpage"),
100 url: absoluteUrl("/neon-alternative"),
101 name: "Neon alternative for teams that want always-on managed Postgres",
102 description:
103 "Compare smbCloud GresIQ and Neon for teams that want a standard always-on database instead of serverless Postgres.",
104 isPartOf: {
105 "@id": absoluteUrl("/#website"),
106 },
107 },
108 {
109 "@type": "BreadcrumbList",
110 itemListElement: [
111 {
112 "@type": "ListItem",
113 position: 1,
114 name: "Home",
115 item: absoluteUrl("/"),
116 },
117 {
118 "@type": "ListItem",
119 position: 2,
120 name: "Neon alternative",
121 item: absoluteUrl("/neon-alternative"),
122 },
123 ],
124 },
125 {
126 "@type": "FAQPage",
127 mainEntity: faqs.map((faq) => ({
128 "@type": "Question",
129 name: faq.question,
130 acceptedAnswer: {
131 "@type": "Answer",
132 text: faq.answer,
133 },
134 })),
135 },
136 ],
137 };
138
139 export default function NeonAlternativePage() {
140 return (
141 <div>
142 <StructuredData data={structuredData} />
143
144 <section className="relative overflow-hidden px-6 pt-24 pb-16 sm:pt-32 sm:pb-20 lg:px-8">
145 <div className="pointer-events-none absolute inset-x-0 top-0 -z-10 h-[520px] bg-[radial-gradient(ellipse_75%_50%_at_50%_0%,rgba(99,102,241,0.18),transparent)] dark:bg-[radial-gradient(ellipse_75%_50%_at_50%_0%,rgba(99,102,241,0.12),transparent)]" />
146
147 <div className="mx-auto max-w-4xl">
148 <div className="mb-6 inline-flex items-center gap-2 rounded-full border border-indigo-200 bg-indigo-50 px-4 py-1.5 dark:border-indigo-500/30 dark:bg-indigo-500/10">
149 <span className="h-1.5 w-1.5 rounded-full bg-indigo-500" />
150 <span className="text-xs font-semibold uppercase tracking-widest text-indigo-700 dark:text-indigo-400">
151 GresIQ comparison
152 </span>
153 </div>
154
155 <h1 className="max-w-3xl text-4xl font-bold tracking-tight text-slate-900 dark:text-white sm:text-6xl leading-[1.05]">
156 Looking for a Neon alternative?
157 </h1>
158
159 <p className="mt-6 max-w-3xl text-lg leading-8 text-slate-600 dark:text-slate-400">
160 Neon built something clever with serverless Postgres. But
161 scale-to-zero and cold starts are the wrong trade-off for most
162 server-side apps. smbCloud GresIQ gives you an always-on data layer
163 inside the same platform as your app, auth, and mail, with no
164 serverless surprises.
165 </p>
166
167 <div className="mt-8 flex flex-col gap-4 sm:flex-row">
168 <Link
169 href="https://console.smbcloud.xyz"
170 target="_blank"
171 rel="noopener noreferrer"
172 className="inline-flex items-center justify-center rounded-lg bg-indigo-600 px-8 py-3.5 text-sm font-semibold text-white shadow-lg shadow-indigo-500/20 transition-all hover:bg-indigo-500 hover:shadow-indigo-500/30 active:scale-[0.98]"
173 >
174 Try smbCloud GresIQ
175 </Link>
176 <Link
177 href="/services"
178 className="inline-flex items-center justify-center rounded-lg border border-slate-300 px-8 py-3.5 text-sm font-semibold text-slate-700 transition-colors hover:bg-slate-50 dark:border-white/[0.12] dark:text-slate-200 dark:hover:bg-white/[0.04]"
179 >
180 See all services
181 </Link>
182 </div>
183 </div>
184 </section>
185
186 <section className="px-6 pb-24 lg:px-8">
187 <div className="mx-auto max-w-5xl grid gap-8 lg:grid-cols-[0.95fr_1.05fr]">
188 <div>
189 <p className="text-xs font-bold uppercase tracking-[0.2em] text-slate-400 dark:text-slate-600">
190 Why teams look beyond Neon
191 </p>
192 <h2 className="mt-4 text-3xl font-bold tracking-tight text-slate-900 dark:text-white">
193 Usually they wanted managed Postgres. The serverless model came
194 with it.
195 </h2>
196 <p className="mt-5 text-base leading-8 text-slate-600 dark:text-slate-400">
197 Neon is a genuine innovation in the Postgres space. But for Rails,
198 Node.js, and Vapor apps running on standard servers, an always-on
199 database is simpler to reason about and easier to operate. GresIQ
200 keeps the database predictable and keeps it close to the rest of
201 your stack.
202 </p>
203 </div>
204
205 <div className="rounded-2xl border border-slate-200 bg-slate-50 p-8 dark:border-white/[0.06] dark:bg-white/[0.02]">
206 <p className="text-sm font-semibold text-slate-900 dark:text-white">
207 What GresIQ does well
208 </p>
209 <ul className="mt-5 space-y-4 text-sm leading-7 text-slate-600 dark:text-slate-400">
210 <li className="flex gap-3">
211 <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-indigo-500" />
212 <span>Always-on relational database management, with no cold starts or wake-up latency.</span>
213 </li>
214 <li className="flex gap-3">
215 <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-indigo-500" />
216 <span>Lives inside the same platform as your app, auth, and mail.</span>
217 </li>
218 <li className="flex gap-3">
219 <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-indigo-500" />
220 <span>Standard connection model. Works with the ORM and migration tooling you already use.</span>
221 </li>
222 </ul>
223 </div>
224 </div>
225 </section>
226
227 <section className="border-t border-slate-200 px-6 py-24 dark:border-white/[0.06] lg:px-8">
228 <div className="mx-auto max-w-5xl">
229 <div className="mb-12 max-w-3xl">
230 <p className="text-xs font-bold uppercase tracking-[0.2em] text-slate-400 dark:text-slate-600">
231 smbCloud GresIQ vs Neon
232 </p>
233 <h2 className="mt-4 text-3xl font-bold tracking-tight text-slate-900 dark:text-white">
234 Here is the trade, without the usual sales fog.
235 </h2>
236 </div>
237
238 <div className="overflow-hidden rounded-2xl border border-slate-200 dark:border-white/[0.06]">
239 <div className="grid grid-cols-[0.8fr_1fr_1fr] bg-slate-50 text-sm font-semibold text-slate-900 dark:bg-white/[0.03] dark:text-white">
240 <div className="border-b border-slate-200 px-5 py-4 dark:border-white/[0.06]">
241 Area
242 </div>
243 <div className="border-b border-l border-slate-200 px-5 py-4 dark:border-white/[0.06]">
244 smbCloud GresIQ
245 </div>
246 <div className="border-b border-l border-slate-200 px-5 py-4 dark:border-white/[0.06]">
247 Neon
248 </div>
249 </div>
250 {comparisonRows.map((row) => (
251 <div
252 key={row.label}
253 className="grid grid-cols-[0.8fr_1fr_1fr] text-sm leading-7 text-slate-600 dark:text-slate-400"
254 >
255 <div className="border-b border-slate-200 bg-white px-5 py-5 font-semibold text-slate-900 dark:border-white/[0.06] dark:bg-white/[0.02] dark:text-white">
256 {row.label}
257 </div>
258 <div className="border-b border-l border-slate-200 bg-white px-5 py-5 dark:border-white/[0.06] dark:bg-white/[0.02]">
259 {row.smbcloud}
260 </div>
261 <div className="border-b border-l border-slate-200 bg-white px-5 py-5 dark:border-white/[0.06] dark:bg-white/[0.02]">
262 {row.neon}
263 </div>
264 </div>
265 ))}
266 </div>
267 </div>
268 </section>
269
270 <section className="px-6 py-24 lg:px-8">
271 <div className="mx-auto grid max-w-5xl gap-6 lg:grid-cols-2">
272 <div className="rounded-2xl border border-slate-200 bg-white p-8 dark:border-white/[0.06] dark:bg-white/[0.02]">
273 <p className="text-xs font-bold uppercase tracking-[0.2em] text-slate-400 dark:text-slate-600">
274 Pick smbCloud GresIQ if
275 </p>
276 <ul className="mt-6 space-y-4 text-sm leading-7 text-slate-600 dark:text-slate-400">
277 {smbcloudFits.map((item) => (
278 <li key={item} className="flex gap-3">
279 <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-indigo-500" />
280 <span>{item}</span>
281 </li>
282 ))}
283 </ul>
284 </div>
285
286 <div className="rounded-2xl border border-slate-200 bg-slate-50 p-8 dark:border-white/[0.06] dark:bg-white/[0.02]">
287 <p className="text-xs font-bold uppercase tracking-[0.2em] text-slate-400 dark:text-slate-600">
288 Stay on Neon if
289 </p>
290 <ul className="mt-6 space-y-4 text-sm leading-7 text-slate-600 dark:text-slate-400">
291 {neonStillFits.map((item) => (
292 <li key={item} className="flex gap-3">
293 <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-slate-400" />
294 <span>{item}</span>
295 </li>
296 ))}
297 </ul>
298 </div>
299 </div>
300 </section>
301
302 <section className="px-6 pb-24 lg:px-8">
303 <div className="mx-auto max-w-3xl">
304 <div className="mb-10">
305 <p className="text-xs font-bold uppercase tracking-[0.2em] text-slate-400 dark:text-slate-600">
306 FAQ
307 </p>
308 <h2 className="mt-4 text-3xl font-bold tracking-tight text-slate-900 dark:text-white">
309 Common questions
310 </h2>
311 </div>
312 <div className="space-y-4">
313 {faqs.map((faq) => (
314 <div
315 key={faq.question}
316 className="rounded-2xl border border-slate-200 bg-white p-6 dark:border-white/[0.06] dark:bg-white/[0.02]"
317 >
318 <h3 className="text-lg font-semibold text-slate-900 dark:text-white">
319 {faq.question}
320 </h3>
321 <p className="mt-3 text-sm leading-7 text-slate-600 dark:text-slate-400">
322 {faq.answer}
323 </p>
324 </div>
325 ))}
326 </div>
327 </div>
328 </section>
329
330 <section className="px-6 pb-20 lg:px-8">
331 <div className="mx-auto max-w-3xl">
332 <div className="relative overflow-hidden rounded-2xl bg-indigo-600 px-8 py-14 text-center shadow-2xl shadow-indigo-500/20">
333 <div className="pointer-events-none absolute inset-0 bg-[radial-gradient(ellipse_at_top,rgba(255,255,255,0.1),transparent)]" />
334 <h2 className="relative text-3xl font-bold tracking-tight text-white">
335 If Neon feels like the wrong model for your stack, try GresIQ.
336 </h2>
337 <p className="relative mt-4 text-indigo-200">
338 Run it on one project. That is usually enough to know.
339 </p>
340 <div className="relative mt-8 flex flex-col items-center justify-center gap-3 sm:flex-row">
341 <Link
342 href="https://console.smbcloud.xyz"
343 target="_blank"
344 rel="noopener noreferrer"
345 className="inline-flex rounded-lg bg-white px-8 py-3.5 text-sm font-semibold text-indigo-700 shadow-sm transition-colors hover:bg-indigo-50"
346 >
347 Start with smbCloud
348 </Link>
349 <Link
350 href="/supabase-alternative"
351 className="inline-flex rounded-lg border border-white/20 px-8 py-3.5 text-sm font-semibold text-white transition-colors hover:bg-white/10"
352 >
353 Compare Supabase alternative
354 </Link>
355 </div>
356 </div>
357 </div>
358 </section>
359 </div>
360 );
361 }