The 2022 tech stack for an e-book: lessons learned

A fellow hacker @SuDa2103 recently asked:

…what would you guys recommend as an improvement on a PDF that you sell on gumroad/amazon? For example. Pieter Levels did a great job with readmake.com and I'd love to know the tech stack behind that.

I was wondering the same a year ago and here's what I've learned since then…

I don't know where you're writing your book but I wrote mine in Notion.
Notion's rich-text editor is best-in-class and writing over there feels effortless—after the coffee kicks in, of course ;)

Once I had the book ready in Notion, I had three options:

• export it as PDF and sell it on Gumroad
• export and somehow convert it to an EPUB to sell it on Amazon and elsewhere
• or keep it in Notion and sell view-only, guest access.

Now, there are multiple problems with PDFs and EPUBs:

• the content is practically offline — you don't get any SEO benefits from your (likely) high-quality content
• the content is static (yes, you can link pages & sections but you cannot embed videos and other interactive media)
• and, more importantly, the book can be stolen and shared freely across the whole wide web.

So I went with option #3 — granting guest access to Notion.

I built a landing page with Next.js and integrated Stripe Checkout quite easily. But I struggled with the key part. See, at the time, Notion didn't have an official API so granting guest access programmatically was quite hacky, but I eventually found a way and shared the approach here on IH.

Things went well and I made my first few hundred bucks. After a while, however, my sales began to stagnate. So did my (organic search) traffic.

Mind you, the technology I wrote about — Elasticsearch — is very niche. It's not your typical "React Hooks Handbook" or "SQL for beginners" — all very competitive, but thirsty markets. I knew I had to step my SEO up…

But how? I didn't want to open-source my book and only earn $3 coffee thank-yous, nor did I want to rewrite its contents in markdown and then render that… I really wanted to retain all the perks of Notion documents such as selective code highliting to get my chapter concepts across.

I needed something to mirror my Notion content 1-to-1 and put it all behind a partial paywall.

Luckily, I discovered a lifesaver package — React-Notion-X! I could easily plug it into my Next.js (React) landing-page repo and voilà — I immediately got 30+ new routes (and SEO access points!) to my book. My Lighthouse scores were through the roof and, after lots of trial & error, I figured out a way to only render the first ~30-40% of a chapter's content, so as to hide the rest behind a paywall.

To handle the access logic, I went with a simple MongoDB user + user session database. I chose MongoDB via Prisma to store the customers I received from Stripe. I already felt productive with NextAuth.js so that's what I chose to handle the user "email-signin attempt → passwordless email link → user session" flow with.
To render the sign-in emails (+ the purchase confirmation), I used mjml and sent them via Mailgun.
Finally, I connected the whole mini-backend to Slack where I receive a notification upon each successful purchase.

All in all, trying to tame Notion into something it wan't originally meant to be has been a massive learning curve! But my organic SEO is continuously improving and my sales are starting to pick up too!

A few days ago I got the idea to package my one-year "Notion Paywall" journey as a self-serve Next.js boilerplate. You can check it out at Notion-Paywall.com

You can also follow Notion Paywall on Twitter and upvote it on HackerNews or ProductHunt.

PS — I think I may be on to something here & I'm thinking to turn it into a no-code microsass. Would you be interested to publish through such a paywall-platform — from your Notion directly onto your own web domain? Let me know.