main
tsx 376 lines 15.6 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: "Primary job",
9 smbcloud:
10 "Route domain inboxes, forward mail, and keep the inbound messages.",
11 resend:
12 "Send transactional email and build developer email workflows.",
13 },
14 {
15 label: "Best fit",
16 smbcloud:
17 "Teams that care about where email lands after it is sent.",
18 resend:
19 "Teams whose first problem is sending product or transactional email.",
20 },
21 {
22 label: "Product shape",
23 smbcloud: "Mail service plus inbox workflows and MailX.",
24 resend: "Developer email API with sending-first tooling around it.",
25 },
26 {
27 label: "Why teams pick it",
28 smbcloud: "Because the inbox is part of the product.",
29 resend: "Because sending from code is the main job.",
30 },
31 ];
32
33 const smbcloudFits = [
34 "You want domain inbox routes, forwarding, and stored inbound mail.",
35 "You care more about the inbox than the send API.",
36 "You want email to arrive somewhere real, not just trigger a webhook.",
37 "You want a simpler mail workflow for a small team.",
38 ];
39
40 const resendStillFits = [
41 "Your main problem is sending transactional email from your app.",
42 "You want a developer email API first and everything else second.",
43 "Your team is already centered around outbound email workflows.",
44 ];
45
46 const bestFor = [
47 "Support inboxes",
48 "Contact addresses on product sites",
49 "Project mailboxes that need forwarding plus stored copies",
50 "Small teams that want inbound mail to stay simple",
51 "Founders who want to stop duct-taping inbox workflows",
52 ];
53
54 const faqs = [
55 {
56 question: "Is smbCloud Mail a Resend replacement?",
57 answer:
58 "For some teams, yes. If the inbox is the real problem and you need domain routes, forwarding, and stored inbound mail, smbCloud Mail may fit better. If outbound email from your app is the main job, Resend may fit better.",
59 },
60 {
61 question: "What is the biggest difference between smbCloud Mail and Resend?",
62 answer:
63 "Resend starts from sending. smbCloud Mail starts from the inbox.",
64 },
65 {
66 question: "Who should switch from Resend to smbCloud Mail?",
67 answer:
68 "Teams that keep running into inbox problems, forwarding rules, or the need to keep the actual messages that came in.",
69 },
70 ];
71
72 export const metadata: Metadata = {
73 ...genPageMetadata({
74 title: "Resend alternative for inbox-first mail workflows",
75 description:
76 "smbCloud Mail is a Resend alternative for teams that care about domain inboxes, inbound routing, forwarding, and keeping the messages that actually arrived.",
77 path: "/resend-alternative",
78 keywords: [
79 "Resend alternative",
80 "email API alternative",
81 "inbound email routing",
82 "domain inbox routing",
83 "email forwarding platform",
84 "hosted inbox workflow",
85 "smbCloud Mail",
86 ],
87 }),
88 };
89
90 const structuredData = {
91 "@context": "https://schema.org",
92 "@graph": [
93 {
94 "@type": "WebPage",
95 "@id": absoluteUrl("/resend-alternative#webpage"),
96 url: absoluteUrl("/resend-alternative"),
97 name: "Resend alternative for inbox-first mail workflows",
98 description:
99 "Compare smbCloud Mail and Resend for inbox-first mail workflows.",
100 isPartOf: {
101 "@id": absoluteUrl("/#website"),
102 },
103 },
104 {
105 "@type": "BreadcrumbList",
106 itemListElement: [
107 {
108 "@type": "ListItem",
109 position: 1,
110 name: "Home",
111 item: absoluteUrl("/"),
112 },
113 {
114 "@type": "ListItem",
115 position: 2,
116 name: "Resend alternative",
117 item: absoluteUrl("/resend-alternative"),
118 },
119 ],
120 },
121 {
122 "@type": "FAQPage",
123 mainEntity: faqs.map((faq) => ({
124 "@type": "Question",
125 name: faq.question,
126 acceptedAnswer: {
127 "@type": "Answer",
128 text: faq.answer,
129 },
130 })),
131 },
132 ],
133 };
134
135 export default function ResendAlternativePage() {
136 return (
137 <div>
138 <StructuredData data={structuredData} />
139
140 <section className="relative overflow-hidden px-6 pt-24 pb-16 sm:pt-32 sm:pb-20 lg:px-8">
141 <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)]" />
142
143 <div className="mx-auto max-w-4xl">
144 <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">
145 <span className="h-1.5 w-1.5 rounded-full bg-indigo-500" />
146 <span className="text-xs font-semibold uppercase tracking-widest text-indigo-700 dark:text-indigo-400">
147 smbCloud Mail
148 </span>
149 </div>
150
151 <h1 className="max-w-3xl text-4xl font-bold tracking-tight text-slate-900 dark:text-white sm:text-6xl leading-[1.05]">
152 Looking for a Resend alternative?
153 </h1>
154
155 <p className="mt-6 max-w-3xl text-lg leading-8 text-slate-600 dark:text-slate-400">
156 smbCloud Mail is a different kind of email product. Resend is great
157 when sending is the job. We built smbCloud Mail for teams that care
158 about where email lands after it gets sent.
159 </p>
160
161 <div className="mt-8 flex flex-col gap-4 sm:flex-row">
162 <Link
163 href="https://console.smbcloud.xyz/signup-mailx"
164 target="_blank"
165 rel="noopener noreferrer"
166 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]"
167 >
168 Get a free @smbcloud.xyz inbox
169 </Link>
170 <Link
171 href="/services"
172 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]"
173 >
174 Explore smbCloud Mail
175 </Link>
176 </div>
177 </div>
178 </section>
179
180 <section className="px-6 pb-24 lg:px-8">
181 <div className="mx-auto grid max-w-5xl gap-8 lg:grid-cols-[0.95fr_1.05fr]">
182 <div>
183 <p className="text-xs font-bold uppercase tracking-[0.2em] text-slate-400 dark:text-slate-600">
184 Why teams compare them
185 </p>
186 <h2 className="mt-4 text-3xl font-bold tracking-tight text-slate-900 dark:text-white">
187 The real split is sending-first versus inbox-first.
188 </h2>
189 <p className="mt-5 text-base leading-8 text-slate-600 dark:text-slate-400">
190 A lot of teams start by solving outbound email. Later they realize
191 the annoying part is inbound routing, forwarding, aliases, and
192 keeping a copy of what actually came in.
193 </p>
194 </div>
195
196 <div className="rounded-2xl border border-slate-200 bg-slate-50 p-8 dark:border-white/[0.06] dark:bg-white/[0.02]">
197 <p className="text-sm font-semibold text-slate-900 dark:text-white">
198 What smbCloud Mail does well
199 </p>
200 <ul className="mt-5 space-y-4 text-sm leading-7 text-slate-600 dark:text-slate-400">
201 <li className="flex gap-3">
202 <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-indigo-500" />
203 <span>Route inboxes under your domain.</span>
204 </li>
205 <li className="flex gap-3">
206 <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-indigo-500" />
207 <span>Forward mail and keep a stored copy.</span>
208 </li>
209 <li className="flex gap-3">
210 <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-indigo-500" />
211 <span>Give the team an actual inbox workflow, not just an email API.</span>
212 </li>
213 </ul>
214 </div>
215 </div>
216 </section>
217
218 <section className="border-t border-slate-200 px-6 py-24 dark:border-white/[0.06] lg:px-8">
219 <div className="mx-auto max-w-5xl">
220 <div className="mb-12 max-w-3xl">
221 <p className="text-xs font-bold uppercase tracking-[0.2em] text-slate-400 dark:text-slate-600">
222 smbCloud Mail vs Resend
223 </p>
224 <h2 className="mt-4 text-3xl font-bold tracking-tight text-slate-900 dark:text-white">
225 Here is the actual trade.
226 </h2>
227 </div>
228
229 <div className="overflow-hidden rounded-2xl border border-slate-200 dark:border-white/[0.06]">
230 <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">
231 <div className="border-b border-slate-200 px-5 py-4 dark:border-white/[0.06]">
232 Area
233 </div>
234 <div className="border-b border-l border-slate-200 px-5 py-4 dark:border-white/[0.06]">
235 smbCloud Mail
236 </div>
237 <div className="border-b border-l border-slate-200 px-5 py-4 dark:border-white/[0.06]">
238 Resend
239 </div>
240 </div>
241 {comparisonRows.map((row) => (
242 <div
243 key={row.label}
244 className="grid grid-cols-[0.8fr_1fr_1fr] text-sm leading-7 text-slate-600 dark:text-slate-400"
245 >
246 <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">
247 {row.label}
248 </div>
249 <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]">
250 {row.smbcloud}
251 </div>
252 <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]">
253 {row.resend}
254 </div>
255 </div>
256 ))}
257 </div>
258 </div>
259 </section>
260
261 <section className="px-6 py-24 lg:px-8">
262 <div className="mx-auto grid max-w-5xl gap-6 lg:grid-cols-2">
263 <div className="rounded-2xl border border-slate-200 bg-white p-8 dark:border-white/[0.06] dark:bg-white/[0.02]">
264 <p className="text-xs font-bold uppercase tracking-[0.2em] text-slate-400 dark:text-slate-600">
265 Pick smbCloud Mail if
266 </p>
267 <ul className="mt-6 space-y-4 text-sm leading-7 text-slate-600 dark:text-slate-400">
268 {smbcloudFits.map((item) => (
269 <li key={item} className="flex gap-3">
270 <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-indigo-500" />
271 <span>{item}</span>
272 </li>
273 ))}
274 </ul>
275 </div>
276
277 <div className="rounded-2xl border border-slate-200 bg-slate-50 p-8 dark:border-white/[0.06] dark:bg-white/[0.02]">
278 <p className="text-xs font-bold uppercase tracking-[0.2em] text-slate-400 dark:text-slate-600">
279 Stay with Resend if
280 </p>
281 <ul className="mt-6 space-y-4 text-sm leading-7 text-slate-600 dark:text-slate-400">
282 {resendStillFits.map((item) => (
283 <li key={item} className="flex gap-3">
284 <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-slate-400" />
285 <span>{item}</span>
286 </li>
287 ))}
288 </ul>
289 </div>
290 </div>
291 </section>
292
293 <section className="border-t border-slate-200 px-6 py-24 dark:border-white/[0.06] lg:px-8">
294 <div className="mx-auto max-w-5xl grid gap-8 lg:grid-cols-[0.95fr_1.05fr]">
295 <div>
296 <p className="text-xs font-bold uppercase tracking-[0.2em] text-slate-400 dark:text-slate-600">
297 Best fit
298 </p>
299 <h2 className="mt-4 text-3xl font-bold tracking-tight text-slate-900 dark:text-white">
300 A good fit if the inbox is part of the product, not an afterthought.
301 </h2>
302 </div>
303 <ul className="rounded-2xl border border-slate-200 bg-white p-8 text-sm leading-7 text-slate-600 dark:border-white/[0.06] dark:bg-white/[0.02] dark:text-slate-400">
304 {bestFor.map((item) => (
305 <li
306 key={item}
307 className="flex gap-3 border-b border-slate-200 py-3 last:border-0 last:pb-0 first:pt-0 dark:border-white/[0.06]"
308 >
309 <span className="mt-2 h-1.5 w-1.5 shrink-0 rounded-full bg-indigo-500" />
310 <span>{item}</span>
311 </li>
312 ))}
313 </ul>
314 </div>
315 </section>
316
317 <section className="px-6 pb-24 lg:px-8">
318 <div className="mx-auto max-w-3xl">
319 <div className="mb-10">
320 <p className="text-xs font-bold uppercase tracking-[0.2em] text-slate-400 dark:text-slate-600">
321 FAQ
322 </p>
323 <h2 className="mt-4 text-3xl font-bold tracking-tight text-slate-900 dark:text-white">
324 Common questions
325 </h2>
326 </div>
327 <div className="space-y-4">
328 {faqs.map((faq) => (
329 <div
330 key={faq.question}
331 className="rounded-2xl border border-slate-200 bg-white p-6 dark:border-white/[0.06] dark:bg-white/[0.02]"
332 >
333 <h3 className="text-lg font-semibold text-slate-900 dark:text-white">
334 {faq.question}
335 </h3>
336 <p className="mt-3 text-sm leading-7 text-slate-600 dark:text-slate-400">
337 {faq.answer}
338 </p>
339 </div>
340 ))}
341 </div>
342 </div>
343 </section>
344
345 <section className="px-6 pb-20 lg:px-8">
346 <div className="mx-auto max-w-3xl">
347 <div className="relative overflow-hidden rounded-2xl bg-indigo-600 px-8 py-14 text-center shadow-2xl shadow-indigo-500/20">
348 <div className="pointer-events-none absolute inset-0 bg-[radial-gradient(ellipse_at_top,rgba(255,255,255,0.1),transparent)]" />
349 <h2 className="relative text-3xl font-bold tracking-tight text-white">
350 If the inbox is the real problem, start there.
351 </h2>
352 <p className="relative mt-4 text-indigo-200">
353 Get a free @smbcloud.xyz inbox and see if smbCloud Mail solves the part the send APIs do not.
354 </p>
355 <div className="relative mt-8 flex flex-col items-center justify-center gap-3 sm:flex-row">
356 <Link
357 href="https://console.smbcloud.xyz/signup-mailx"
358 target="_blank"
359 rel="noopener noreferrer"
360 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"
361 >
362 Get a free inbox
363 </Link>
364 <Link
365 href="/sendgrid-alternative"
366 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"
367 >
368 Compare SendGrid alternative
369 </Link>
370 </div>
371 </div>
372 </div>
373 </section>
374 </div>
375 );
376 }