diff --git a/README.md b/README.md index f4e9b33..caf5118 100644 --- a/README.md +++ b/README.md @@ -1,3 +1,7 @@ # `@reacherhq/webapp` This is the new Reacher webapp, currently deployed at https://app.reacher.email. + +## Color Palette + +- Reacher Purple: #6B63F6 diff --git a/_posts/smtp.md b/_posts/smtp.md new file mode 100644 index 0000000..4489cb5 --- /dev/null +++ b/_posts/smtp.md @@ -0,0 +1,57 @@ +--- +title: What's Reacher's Secret for Accuracy? +lastUpdated: 28.12.2024 +author: + name: Amaury +description: Reacher employs SMTP email verification to validate email addresses through commands like EHLO and RCPT TO. Positive responses confirm validity, while negative ones indicate issues. This method improves deliverability, reduces bounce rates, and supports efficient scaling of email verification. +ogImage: + url: /img/blog/smtp/cover.jpg +--- + +Reacher is [open-source](https://github.com/reacherhq/check-if-email-exists), so there's really no secret. But for those less familiar with the technical aspects, I'll explain a bit more here, hopefully in a beginner-friendly way. The secret is called **"SMTP email verification"**. + +### How SMTP Email Verification Works + +SMTP email verification involves a series of commands to interact with the recipient's mail provider (Outlook, Gmail, Yahoo...). + +Let's take a look at a typical conversation between a sender (Reacher) and the provider of the email you want to check. In our case, we want to verify `someone@gmail.com`, the provider being Gmail. Reacher initiates the protocol, called "SMTP", or "Simple Mail Transfer Protocol". + +> **Reacher:** Hi there, Gmail! I'm trying to send an email address. Can I connect to your SMTP server? + +> **Gmail:** Ah, hello! Please send an **EHLO** command to introduce yourself. + +> **Reacher:** Got it! Here it goes: `EHLO reacher.email`. + +> **Gmail** _(checks if reacher.email is a valid domain)_: Hello Reacher! Nice to meet you. I've received your EHLO command, your IP reputation seems good. You're now connected to my SMTP server. + +> **Reacher:** Great, thanks! Next, I'll send a **MAIL FROM** command to specify the my own email address as the sender. Here it is: `MAIL FROM: ` + +> **Gmail:** Received! I've got the sender's email address. Now, please go ahead and send the **RCPT TO** command with the recipient's email address. + +> **Reacher:** Here it is: `RCPT TO: `. + +> **Gmail:** Okay, I've received the RCPT TO command. Let me check if the recipient's email address is valid... _(pause)_ Ah, yes! The recipient's email address is valid and deliverable. + +> **Reacher:** Excellent, bye bye! + +> **Gmail:** _(puzzled)_ ...? + +It's important to note that Reacher doesn't actually send the email at the end of the conversation, but rather terminates it quickly. This is enough to check if the email is deliverable. If this process is repeated excessively, the email provider may flag Reacher as a spam user. This is where [Proxies](https://docs.reacher.email/self-hosting/proxies) play a crucial role. + +### Parsing Responses for Deliverability + +Reacher analyzes the responses from the **RCPT TO** command to determine deliverability. This analysis involves checking response codes and messages: + +- **Positive Responses**: Codes like `250 OK` indicate a valid address. +- **Negative Responses**: Codes like `550` or `553` indicate invalid or non-existent addresses. +- **Ambiguous Responses**: Temporary errors (e.g., `421` or `450`) suggest issues like rate limits or server unavailability. + +Some servers may use catch-all configurations or impose SMTP restrictions, such as requiring authentication or blocking address verification attempts. These behaviors can make the verification process more complicated, but Reacher provides solutions to handle these challenges effectively. + +### The Advantages of SMTP Email Verification + +1. **Enhanced Deliverability**: With real-time email verification, we can determine if the email is deliverable _right now_. This significantly improves accuracy. +2. **Reduced Bounce Rates**: Fewer bounces protects the sender's reputation and prevent blacklistings, a crucial feature of Reacher. +3. **Scaling Efficiency**: As long as we make sure the verifying party's IP is good (for example using proxies), then we can make a large number of parallel requests. + +SMTP email verification offers a methodical approach to ensuring email list hygiene and optimizing communication strategies. By utilizing commands like EHLO/HELO, MAIL FROM, and RCPT TO, **Reacher** facilitates precise and effective address validation. diff --git a/package.json b/package.json index 1035dca..067ae41 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,8 @@ "@geist-ui/react-icons": "^1.0.1", "@getbrevo/brevo": "^2.2.0", "@hcaptcha/react-hcaptcha": "^1.9.2", + "@mantine/core": "^7.15.2", + "@mantine/hooks": "^7.15.2", "@reacherhq/api": "^0.3.10", "@sentry/nextjs": "^8", "@stripe/stripe-js": "^1.52.0", @@ -47,9 +49,10 @@ "cors": "^2.8.5", "date-fns": "^2.30.0", "encoding": "^0.1.13", + "gray-matter": "^4.0.3", "mailgun-js": "^0.22.0", "markdown-pdf": "^11.0.0", - "marked-react": "^2.0.0", + "marked-react": "^3.0.0", "mustache": "^4.2.0", "negotiator": "^0.6.3", "next": "^14.0.4", diff --git a/public/img/blog/cover2.jpg b/public/img/blog/cover2.jpg new file mode 100644 index 0000000..ec378c0 Binary files /dev/null and b/public/img/blog/cover2.jpg differ diff --git a/public/img/blog/smtp/cover.jpg b/public/img/blog/smtp/cover.jpg new file mode 100644 index 0000000..0e1afa6 Binary files /dev/null and b/public/img/blog/smtp/cover.jpg differ diff --git a/src/app/[lang]/blog/[slug]/page.tsx b/src/app/[lang]/blog/[slug]/page.tsx new file mode 100644 index 0000000..c391b83 --- /dev/null +++ b/src/app/[lang]/blog/[slug]/page.tsx @@ -0,0 +1,99 @@ +import { dictionary } from "@/dictionaries"; +import { Button, Container, Text } from "@mantine/core"; +import Markdown from "marked-react"; +import { DLink } from "@/components/DLink"; +import Image from "next/image"; +import { getAllPosts, getPostBySlug } from "@/util/blog"; +import { Metadata } from "next"; +import { notFound } from "next/navigation"; +import { Footer } from "@/components/Footer"; +import { Nav } from "@/components/Nav/Nav"; + +// Cover ideas: +// - https://unsplash.com/s/photos/geometric-pattern +// - https://stephaniewalter.design/blog/how-to-make-your-blog-images-stand-out-reflect-your-identity/ + +type Params = { + params: Promise<{ + lang: string; + slug: string; + }>; +}; + +export async function generateMetadata(props: Params): Promise { + const params = await props.params; + const blogPost = getPostBySlug(params.slug); + if (!blogPost) { + return notFound(); + } + + return { + title: blogPost.title, + description: blogPost.description, + openGraph: { + title: blogPost.title, + images: [blogPost.ogImage.url], + }, + }; +} + +export default async function BlogPost(props: Params) { + const { lang, slug } = await props.params; + const d = await dictionary(lang); + const blogPost = getPostBySlug(slug); + if (!blogPost) { + return notFound(); + } + + return ( + <> +