My inspiration

I'm an email newsletter guy. I wake up with Poncho. I read Longform & Longreads on the weekend. Every Thursday, I publish Git@Me and two Devpost newsletters. And on my commute home, I like to enjoy Dave Pell's excellent NextDraft.

For the unitiated, every day, Dave Pell aggregates 10–20 great stories / articles, writes punchy wraparound blurbs, and emails them out to over 50K subscribers and 100k+ app subscribers. It's perfect subway reading.

But reading on the subway comes with a host of issues:

  • Wireless service is crap underground.
  • Dave's emails trigger different email filters / spam triggers all. the. time. I've got an entire week without receiving it before.
  • I'd rather not download and use yet another app just for newsletter content. Although I am hip to Pocket.

So, in a flash of inspiration today, I thought: "wouldn't it be cool if I could press a button and add every single article from NextDraft to my Pocket queue for subway reading?"

That'd be pretty dope, right? So I built it. Introducing NextPocket

How I did it

Short story: I modified somebody else's repo.

Eureka!

The first thing I did was check out the Pocket API. Turns out, there's an add method that lets you add articles to an authenticated user's queue. But of course, you have to use OAuth and get a token, which is super blah.

So, I hit up GitHub to find an API wrapper and I found Unqueue, which is a PHP app that archives unread articles from your queue, cleaning it up. That's basically the opposite of what I wanted to do, but the app contains all the code I needed to handle OAuth!!

I cloned the repo, added a config file with my API key & callback URL, and started hacking.

First up, I had to update the package.json with some missing dependencies so I could develop locally & process the scss into css. Once I had that workflow running, I restyled the app and changed some copy.

App Flow

The app flow goes like this:

index.php -> Click login to initiate OAuth flow

callback.php -> Once you're authenticated, the callback sets your access token as a session variable and sends you to the next part of the app

confirm.php -> This is where shit gets real! The app downloads the current issue of NextDraft and uses DOMDocument and DMXpath to run an xpath query ('//div[@class="blurb-content"]/p/a/@href') to extract all story links. There are a lot of non-story links, so this took a really long time to get right. After loading the links into a session variable, the app tells you how many articles are going to be added to your queue and asks you to confirm.

queue.php -> Finally, the app loops through all the links and add them to the queue via the Pocket API.

logout.php -> Do it all over again tomorrow!

Thas it

I suppose you could do it in fewer steps or as a shell script, but NextPocket a cute webapp and a fun evening project. I wrote the only thing in about 4 hours, much of which was spent struggling with xpath & html parsing. Fortunately, StackOverflow.

FYI: There's really no 'backend' to speak of, so your data is safe. NextPocket throws away your token / session data whenever you log out, so things are pretty secure.

Built With

Share this project:
×

Updates

Neal Shyam posted an update

combined index.php & confirm.php and redirected logout.php to index.php once session is destroyed. keeps everything tighter. also, added logout buttons to logged in state. -- still haven't added social tags tho.

Log in or sign up for Devpost to join the conversation.