React hooks for the EmailAlias.io API. Works in any React 17+ app (including Next.js).
API access is a Premium feature. Generate a key from Settings → API Keys in the web dashboard.
Never put a ea_live_... key in the browser bundle. Anyone can open devtools and copy it. EmailAlias.io keys are Premium-gated and can be used to run up email sends on your account.
This library deliberately does not accept an API key. Instead, you point it at a proxy endpoint on your own backend that attaches the key server-side. In Next.js, a Route Handler is perfect:
// app/api/ea/[...path]/route.tsimport{NextRequest,NextResponse}from"next/server";exportasyncfunctionGET(req: NextRequest,{ params }: {params: {path: string[]}}){returnproxy(req,params.path);}exportasyncfunctionPOST(req: NextRequest,{ params }: {params: {path: string[]}}){returnproxy(req,params.path);}exportasyncfunctionPATCH(req: NextRequest,{ params }: {params: {path: string[]}}){returnproxy(req,params.path);}exportasyncfunctionDELETE(req: NextRequest,{ params }: {params: {path: string[]}}){returnproxy(req,params.path);}constUPSTREAM=process.env.EMAILALIAS_BASE_URL??"https://emailalias.io";asyncfunctionproxy(req: NextRequest,path: string[]){consturl=`${UPSTREAM}/api/${path.join("/")}${req.nextUrl.search}`;constbody=req.body ? awaitreq.text() : undefined;constres=awaitfetch(url,{method: req.method,headers: {Authorization: `Bearer ${process.env.EMAILALIAS_API_KEY}`,"Content-Type": "application/json",},
body,});returnnewNextResponse(res.body,{status: res.status,headers: res.headers});}Then wrap your app and pass proxyBaseUrl="/api/ea".
npm install @emailalias/react// app/layout.tsx (or wherever your root is)import{EmailAliasProvider}from"@emailalias/react";exportdefaultfunctionRootLayout({ children }: {children: React.ReactNode}){return(<html><body><EmailAliasProviderproxyBaseUrl="/api/ea">{children}</EmailAliasProvider></body></html>);}// app/aliases/page.tsx"use client";import{useAliases,useCreateAlias,useDeleteAlias}from"@emailalias/react";exportdefaultfunctionAliasesPage(){const{data: aliases, loading, error, refetch }=useAliases();constcreate=useCreateAlias();constdel=useDeleteAlias();if(loading)return<p>Loading…</p>;if(error)return<p>Failed: {error.message}</p>;return(<><buttononClick={async()=>{awaitcreate.run({alias_type: "random",label: "Shopping"});refetch();}}disabled={create.loading}>
Create alias
</button><ul>{aliases?.map((a)=>(<likey={a.id}>{a.alias_email} → {a.destination_email}<buttononClick={async()=>{awaitdel.run(a.id);refetch();}}>
Delete
</button></li>))}</ul></>);}| Hook | Endpoint |
|---|---|
useAliases() | GET /api/aliases |
useDestinations() | GET /api/destinations |
useAvailableDomains() | GET /api/aliases/domains |
| Hook | Endpoint |
|---|---|
useCreateAlias() | POST /api/aliases |
useUpdateAlias() | PATCH /api/aliases/{id} |
useUpdateAliasDisplayName() | PATCH /api/aliases/{id}/display-name |
useDeleteAlias() | DELETE /api/aliases/{id} |
useAddDestination() | POST /api/destinations |
useDeleteDestination() | DELETE /api/destinations/{id} |
useSendEmail() | POST /api/send-email |
Full API reference: https://emailalias.io/documentation
MIT