HomeEducationAre you irritated by the additional area after your title ? |...

Are you irritated by the additional area after your title [name|]? | Swizec Teller Get hold of US

The additional area isn’t any extra! All fastened. Here is a bit backstory that I hope evokes you to construct extra instruments for your self.

Again in 2018, I constructed TechLetter.App as a part of a 24 hour problem to construct and launch an app. I wished a simple to option to flip markdown into shippable newsletters and thought others may too.

TechLetterApp in action

They didn’t. TechLetter.App was the proper instance of Robin Sloane’s An app can be a home-cooked meal. Will get about 30 visits monthly. Principally from me.

I am unable to think about dwelling with out this software and ConvertKit’s banner that they are sunsetting the previous editor with a Paste HTML possibility fills me with dread.

ConvertKit loves their new editor

ConvertKit loves their new editor

Could have to alter e-mail suppliers over this

TechLetter.App was one of many case research peppered into Serverless Handbook.

It takes markdown, makes use of the unist ecosystem to parse the enter, go it by means of a series of customized plugins, and spit out a bunch of React elements. The Export button then takes the uncooked HTML from the mum or dad node of the rendered doc.

Plugins do the onerous work. Some make calls to serverless features that take screenshots, others remodel textual content to different textual content.

The core business logic seems like this:



domains: [















.use(remark2react, {

A sequence of syntax tree transformations. Every .use() accepts a Comment plugin that transforms the syntax tree.

Sure many readers complained in regards to the further area since I added the characteristic in August 2020. About one per quarter. It by no means fairly made the precedence checklist

I exploit a customized little bit of markdown syntax – [name|something else] – to inject your title into the e-mail. If the system is aware of your title, it makes use of that, in any other case the one thing else half.

That occurs through liquid syntax that ConvertKit and most different emailing programs perceive. My customized Comment plugin finds the bizarre markdown syntax and turns it into liquid syntax.

Like this:

const nameOrFriend = /^s*names*|(.*)$/;

export operate remarkNameOrFriend() {

return (tree) => {

go to(tree, "linkReference", (node, index, mum or dad) =>

if (node.label.match(nameOrFriend))

node.kind = "textual content";

node.worth = node.label.substitute(


'% if subscriber.first_name != clean % capitalize % else % $1 % endif %'

); = null;




Can you see the bug?

It is proper right here:

'% if subscriber.first_name != clean % subscriber.first_name % else % $1 % endif %'

That has areas between the liquid tags

Must be:

'% if subscriber.first_name != clean % capitalize % else %$1% endif %'

And that is the bug that took me 919 days to repair.


PS: getting this deployed was an ordeal as a result of software program breaks whenever you change it. However that is a put up for one more day

Printed on March twenty first, 2023 in TechLetterApp, Serverless,

Senior Mindset Guide

Get promoted, earn a much bigger wage, work for high firms

Be taught extra

Have a burning query that you simply assume I can reply? Hit me up on twitter and I will do my finest.

Who am I and who do I assist? I am Swizec Teller and I flip coders into engineers with “Uncooked and trustworthy from the center!” writing. No bullshit. Actual insights into the profession and expertise of a contemporary software program engineer.

Need to develop into a true senior engineer? Take possession, have autonomy, and be a pressure multiplier in your staff. The Senior Engineer Mindset e-book can assist These are the shifts in mindset that unlocked my profession.

Interested in Serverless and the fashionable backend? Try Serverless Handbook, for frontend engineers

Need to Cease copy pasting D3 examples and create knowledge visualizations of your individual? Learn to construct scalable dataviz React elements your complete staff can perceive
with React for Data Visualization

Need to get my finest emails on JavaScript, React, Serverless, Fullstack Net, or Indie Hacking? Try

Did somebody wonderful share this letter with you? Fantastic! You possibly can join my weekly letters for software program engineers on their path to greatness, right here:

Need to brush up in your trendy JavaScript syntax? Try my interactive cheatsheet:

By the best way, simply in case nobody has instructed you it but immediately: I like and admire you for who you’re

#irritated #further #area #Swizec #Teller

Continue to the category


Please enter your comment!
Please enter your name here

- Advertisment -spot_img

Most Popular

Recent Comments