vrbtm.co development stream | Week III

Rejections, email notifications, content rendering and refactoring.

Not sure what this is, start here with our README, or catch up on last week, vrbtm.co development stream | Week II.

Another week, another piece of Verbatim work to do. I read somewhere the power of threes for establishing a routine. First, try to do something three days straight. Then take a break (or not) and try to do something for three weeks straight. Then take a break (or not) and try to do something for three months straight. After that period, you’ve established a routine that’s difficult to break.

I’m hoping that this week is the week that establishes the routine of five days of 10–7 work(the 9–5 is dead. At least in my profession) and one day of side project work. I had a pretty long work week, so my place is where we’ll be working this week.

As per usual, I start off by skimming through my last stream of this project. Looks like my goals for today are implementing a reject button, a confirmation for the approval button and email notifications. I think I’m also going to be adding another component for actually rendering content with a fallback for when a preview isn’t available. I’ve only coded a way to render images and it seems like the logic behind content rendering will get complicated.

First up, the reject button. How does it work? Same as approvals, it’s just a boolean switch. That was pretty straightforward to implement. This is where I want to abstract the content rendering part into its own component instead of having it all within the Content Detail page component.

Okay, so now the ContentRenderer component is in charge of rendering content and the ContentDetail component is in charge of approval, rejection and displaying a ContentRenderer with the correct data. Much better. This means that if we ever want to add more functionality on the preview/render side, we’d add it to the ContentRenderer component. And if we want to add more functionality to the management of the content itself, we’d add it to the ContentDetail component.

Since I’m here, I’ll add support for video and a fallback for file formats we can’t render yet.

now_supports.mp4

not_yet.pdf

Lol jk, here’s PDF support. It was an easy implementation, just use an <embed> tag and hope that your user’s browsers have a plugin that can render PDFs. I think that’s a safe assumption to make in 2016.

watchoutadobe.jpeg

Email notifications. Before I can dive into that, I’m going to move database manipulation code from the front-end to the back-end. Meteor is great because it let’s you manipulate a database from the front-end via a package called insecure that’s installed by default. Obviously, this is insecure and all this email notification logic should be happening server side. So, it’s time to refactor all that from the front to the back.

Refactor complete, insecure package removed. Sendgrid’s docs are hard to find, but they’re alright. Made an API key with all the perms, because I don’t know what we need or don’t need yet. Saved the API key in settings.json and now it’s time to add email notification code.

All of the refactored database code mentioned earlier was added in /imports/api/content.js which makes complete sense, since it’s all related to Content. That’s where our Sendgrid related code will go.

After adding the Sendgrid npm package, Meteor complained about a missing package called bluebird, which is a Promises library. I assume it’s a dependency for sendgrid but wasn’t explicitly defined? Anyway, I added that package in too.

omgfirst.emailz

Sendgrid had some example code in their repo for their npm package. Basically consists of an object wrapper for HTTP requests for their endpoints that gets a API key passed in. They also have very helpful Helpers for constructing their deeply nested request params. Anyway, it works.

Wes is working on the email templates for:

• Approval notification
• Approval receipt
• Reject notification
• Reject receipt
• Request notification
• Request receipt

In the mean time I coded up a snazzy confirmation mechanism for approvals and rejections.

usure.questionmark

For next week:

• Substitute email subjects and bodies with templates made by Wes
• Passcode (six digit PIN) mechanism for secure approval/rejection
• Mailchimp integration
• Add expiration date to content
• Deployment

Wakatime is 3h 27m.

Read the other half of this week with Wes’ VRBTM Things Are Coming Together | WEEK III

vrbtm.co development stream | Week IV

We’d love to hear from you…
Get in touch at Founders@vrbtm.co, talk with us on twitter @vrbtm.co, and read our story on medium.

Wes Jones is on Twitter @WesJonesCo
Nick Dandakis is on Twitter @Dandakis

Join our email list for Beta access.