This is a highly condensed summary of Richard Hamming's talk titled 'You and your research' in 1986. It's an amazing essay on how to do great work by a scientist who's career spanned decades working alongside some of the most innovative minds of the 20th century.

You can read the full essay by following this link:

http://www.cs.virginia.edu/~robins/YouAndYourResearch.html

1. Decide you're going to do something significant

'Say to yourself, Yes, I would like to do first-class work. Our society frowns on people who set out to do really good work. You're not supposed to; luck is supposed to descend on you and you do great things by chance. Well, that's a kind of dumb thing to say. I say, why shouldn't you set out to do something significant.'

2. Being proactive and prepared creates luck

'The prepared mind sooner or later finds something important and does it.' 

If others would think as hard as I did, then they would get similar results - Isaac Newton

The specific thing that comes up for you do is luck, but the fact that you do something great is not.

'It helps to have lots of brains but great work is something else than mere brains'

'One of the characteristics of successful scientists is having courage. Once you get your courage up and believe that you can do important problems, then you can. If you think you can't, almost surely you are not going to... That is the characteristic of great scientists; they have courage. They will go forward under incredible circumstances; they think and continue to think.'

5. It helps to start young but it is not sufficient

'Age has some effect. In some fields, people do their best work while relatively young, in others when they are old... But let me say why age seems to have the effect it does. In the first place if you do some good work you will find yourself on all kinds of committees and unable to do any more work.' 

In addition, it is hard to work on small problems when you are famous, you can no longer follow your curiosity along small interesting paths, which is usually where the best ideas come from.

6. Working conditions don't matter, culture does

'What most people think are the best working conditions, are not. Very clearly they are not because people are often most productive when working conditions are bad. One of the better times of the Cambridge Physical Laboratories was when they had practically shacks - they did some of the best physics ever.'

Constraints combined with the right attitude provide opportunities for breakthroughs. Constraints can force you to think of unconventional solutions and attempt solutions that others won't.

'First-class work requires deep commitment, those who work during the day and go home and do other things.. don't have the deep commitment that is apparently necessary for really first-class work.'

'Knowledge and productivity are like compound interest. Given two people of approximately the same ability and one person who works ten percent more than the other, the latter will more than twice outproduce the former. The more you know, the more you learn; the more you learn, the more you can do; the more you can do, the more the opportunity - it is very much like compound interest. Given two people with exactly the same ability, the one person who manages day in and day out to get in one more hour of thinking will be tremendously more productive over a lifetime'

'Edison said Genius is 99% perspiration and 1% inspiration.'' He may have been exaggerating, but the idea is that solid work, steadily applied, gets you surprisingly far.'

'Most people like to believe something is or is not true. Great scientists tolerate ambiguity very well. They believe the theory enough to go ahead; they doubt it enough to notice the errors and faults so they can step forward and create the new replacement theory. If you believe too much you'll never notice the flaws; if you doubt too much you won't get started. It requires a lovely balance.'

'Darwin writes in his autobiography that he found it necessary to write down every piece of evidence which appeared to contradict his beliefs because otherwise, they would disappear from his mind. When you find apparent flaws you've got to be sensitive and keep track of those things and keep an eye out for how they can be explained or how the theory can be changed to fit them. Those are often great contributions. Great contributions are rarely done by adding another decimal place. It comes down to an emotional commitment.'

'If you are deeply immersed and committed to a topic, day after day after day, your subconscious has nothing to do but work on your problem. And so you wake up one morning, or on some afternoon, and there's the answer. For those who don't get committed to their current problem, the subconscious goofs off on other things and doesn't produce the big result. So the way to manage yourself is that when you have a real important problem you don't let anything else get the centre of your attention - you keep your thoughts on the problem. Keep your subconscious starved so it has to work on your problem, so you can sleep peacefully and get the answer in the morning, free.'

11. Identify important problems and look for an angle of attack

If you do not work on an important problem, it's unlikely you'll do important work. It's perfectly obvious. Great scientists have thought through, in a careful way, a number of important problems in their field, and they keep an eye on wondering how to attack them.

It's not the consequence that makes a problem important, it is that you have a reasonable attack. That is what makes a problem important.

Most great scientists know many important problems. They have something between 10 and 20 important problems for which they are looking for an attack. And when they see a new idea come up, one hears them say ''Well that bears on this problem.'' They drop all the other things and get after it.

12. Create time to think about the long term big picture

I thought hard about where was my field going, where the opportunities were, and what the important things to do were. Let me go there so there is a chance I can do important things. 

Put time aside to look at macro trends and convergences. Think about what your field is going to look like in 10, 20, 30 years

13. When you sense a big opportunity, drop everything to pursue it

'The great scientists, when an opportunity opens up, get after it and they pursue it. They drop all other things. They get rid of other things and they get after an idea because they had already thought the thing through. Their minds are prepared; they see the opportunity and they go after it. Now, of course, lots of times it doesn't work out, but you don't have to hit many of them to do some great science.'

'I notice that if you have the door to your office closed, you get more work done today and tomorrow, and you are more productive than most. But 10 years later somehow you don't know quite know what problems are worth working on; all the hard work you do is sort of tangential in importance. He who works with the door open gets all kinds of interruptions, but he also occasionally gets clues as to what the world is and what might be important'

15. Solve isolated problems but look for a way to systemise the solution

Solve a problem by hand initially so that you have a good understanding of it and then look at how you can mass produce it

16. Build on top of previous work and make your work able to be built upon.

It is a poor workman who blames his tools - the good man gets on with the job, given what he's got, and gets the best answer he can. And I suggest that by altering the problem, by looking at the thing differently, you can make a great deal of difference in your final productivity because you can either do it in such a fashion that people can indeed build on what you've done, or you can do it in such a fashion that the next person has to essentially duplicate again what you've done. It isn't just a matter of the job, it's the way you write the report, the way you write the paper, the whole attitude. It's just as easy to do a broad, general job as one very special case. And it's much more satisfying and rewarding!

There are three things you have to do in selling. You have to learn to write clearly and well so that people will read it, you must learn to give reasonably formal talks, and you also must learn to give informal talks.

Most of the time the audience wants a broad general talk and wants much more survey and background than the speaker is willing to give. As a result, many talks are ineffective. The tendency is to give a highly restricted, safe talk; this is usually ineffective. Furthermore, many talks are filled with far too much information. So I say this idea of selling is obvious.

18. Use the system, don't fight it or blindly follow it.

If you do what you can do single-handedly, you can go just that far and no farther than you can do single-handedly. If you will learn to work with the system, you can go as far as the system will support you. Wanting total control is a personality defect. If you want to go far, you need the support of the system.

Make an effort to 'appear' to conform properly. 'I know enough not to let my clothes, my appearance, my manners get in the way of what I care about. An enormous number of scientists feel they must assert their ego and do their thing their way. They have got to be able to do this, that, or the other thing, and they pay a steady price.'

20. Know your faults and learn how to convert them into assets

For example, If you fault is egotism, make bold promises that you will have to keep to maintain your reputation, and in doing so push yourself to achieve more.

How To Do Great Work  - Extracts of You and Your Research by Richard Hamming

Sometimes an application needs to be reset after a certain period of inactivity, for example, public apps on 'kiosk' tablets, or banking and finance applications. To keep user data private and secure we need to be able to safely reset these if a user accidentally leaves before properly exiting.

Here's a guide on how to make a simple react component that auto resets an application after one minute of inactivity. I am using Next.js but the same principles would work with Create React App and React Router Dom.

Create a list of all pages where you don't want to trigger an auto-reset. Or, if you only need a few pages to auto-reset, make a blacklist that only includes these pages.

const whitelist = [
  '/',
  '/admin',
  '/results',
  '/profile'
];

Build the component, place it early in your app's component tree for the best results, ideally inside your top level App component or just inside your Redux Provider Component (if using one).

import React from 'react'

const whitelist = [
  '/',
  '/admin',
  '/results',
  '/profile'
];

const IdleTimer = () => {
  return <div />; // must show something on the screem
};

3. Call a function every time the page changes

We will set up a 'useEffect' hook that watches for changes to the current page's pathname and executes the code inside it every time the page changes.

import React from 'react'
import { useRouter } from 'next/router';

const IdleTimer = () => {
  const router = useRouter();
  
  useEffect(() => {
    // code here will run everytime the page changes
  }, [router.pathname]); 
  
  return <div />;
};


4. Stop the pages in your whitelist from executing

Inside the useEffect hook, set up a check to make sure the reset will only occur on the pages you want.

  ...
  useEffect(() => {
    let preventReset = false;
    for (const path of whitelist) {
      if (path === router.pathname) {
        preventReset = true;
      }
    }
    if (preventReset) {
      return;
    }
    /* 
      code here will run everytime the page changes & the 
      current page is NOT in the whitelist 
    */
  }, [router.pathname]);
  ...


Or if you want to be fancy, you can do this with reduce

  ...
  useEffect(() => {
    const preventReset = whitelist
      .map(path => path === router.pathname ? 1 : 0)
      .reduce((prev, curr) => prev + curr, 0)
    if (preventReset) {
      return;
    }
    /* 
      code here will run everytime the page changes & the 
      current page is NOT in the whitelist 
    */
  }, [router.pathname]);
  ...

We need to create a timer that will reset the app after a period of time.

So, at the top of the `IdleTimer` component, initiate a variable 'timeout' to which you will assign a Javascript timeout.

Note: we must assign the timeout to a variable in order to clear it and restart it each time user activity is detected.

const IdleTimer = (props: Props) => {
  const router = useRouter();
  let timeout = null; // <- Javascript
  // Typescript -> let timeout: NodeJS.Timeout | null = null 
...


Then create a function inside the component to handle the reset timer. This will be called any time user activity is detected and resets 

...
  const restartAutoReset = () => {
    if (timeout) {
      clearTimeout(timeout);
    }
    timeout = setTimeout(() => {
      // Insert your code to reset you app here
    }, 1000 * 60); // 60 Seconds
  };
...


Make sure the timeout starts up at the beginning of each page load by putting it inside the usEffect hook under the whitelist code.

  ...
  useEffect(() => {
    ...
    if (preventReset) {
      return;
    }
    
    // initiate timeout
    restartAutoReset();
    
  }, [router.pathname]);
  ...


The `IdleTimer` component will now trigger your reset code exactly one minute after it mounts. The next step is to cancel and restart this timeout every time we detect user activity.

Now the last thing we need to do is listen for user activity and reset the timer if the user is still active.

We will achieve this by listening to the global 'onmousemove' event.

Create the function that will fire every time the mouse moves and call the timer resetting function we created in the previous step.

  const onMouseMove = () => {
    restartAutoReset();
  };


Now we must make sure that we start listening for mouse movement when the page loads and the `IdleTimer` component mounts.

Inside the useEffect hook, underneath the whitelist code and timeout initiation code, add an event listener that will fire every time mouse movement is detected.

  ...
  useEffect(() => {
    ...
    if (preventReset) {
      return;
    }
    
    // initiate timeout
    restartAutoReset();
    
    // listen for mouse events
    window.addEventListener('mousemove', _onMouseMove);
    
  }, [router.pathname]);
  ...


The `IdleTimer` component will now trigger your reset code exactly one minute after the last detected mouse movement.

The last thing we need to do is make sure we cancel the timeout and stop listening for mouse activity when the page changes and the component unmounts. 

If we do not explicitly stop Javascript timeouts and event listeners they will just carry on running on the next pages and we'll end up initiating more and more of them and it will cause mayhem.

The fix is to include a cleanup function inside the useEffect hook that runs whenever the component is about to be unmounted from the screen. Here we will clear out the timer and mouse movement event listener.

    ...
    // inside useEffect hook
    
    // initiate timeout
    restartAutoReset();

    // listen for mouse events
    window.addEventListener('mousemove', onMouseMove);

    // cleanup
    return () => {
      if (timeout) {
        clearTimeout(timeout);
        window.removeEventListener('mousemove', onMouseMove);
      }
    };
  }, [router.pathname]);
  ...


The `IdleTimer` component will now trigger your reset code exactly one minute after the last detected mouse movement. It will clear itself and restart every time the user changes pages.

import { useEffect } from 'react';
import { useRouter } from 'next/router';
import { connect } from 'react-redux';

const whitelist = [
  '/',
  '/admin',
  '/results',
  '/profile'
];

export const IdleTimer = () => {
  const router = useRouter();
  let timeout: NodeJS.Timeout | null = null;

  const goBackToHome = () => {
     // code to reset the application
  };

  const restartAutoReset = () => {
    if (timeout) {
      clearTimeout(timeout);
    }
    timeout = setTimeout(() => {
      goBackToHome();
    }, 1000 * 60);
  };

  const onMouseMove = () => {
    restartAutoReset();
  };

  useEffect(() => {
    // Whitelist certain pages
    let preventResett = false;
    for (const path of whitelist) {
      if (path === router.pathname) {
        preventReset = true;
      }
    }
    if (preventReset) {
      return;
    }

    // initiate timeout
    restartAutoReset();

    // listen for mouse events
    window.addEventListener('mousemove', _onMouseMove);

    // cleanup
    return () => {
      if (timeout) {
        clearTimeout(timeout);
        window.removeEventListener('mousemove', _onMouseMove);
      }
    };
  }, [router.pathname]);
  return <div />;
};



There you have it! Hope you found this useful!

How to Detect Inactivity and Auto Reset a React Web App

My main goal in 2020 was to become a master at custom full-stack web and mobile applications. Picking up these skills below had the biggest impact on my performance:

Typescript is just Javascript with super helpful additions that help you catch a plethora of common bugs and typos that are easy to make when writing code. It cuts down development time and adds an extra layer of structure, and reliability to any code.

GraphQL is a very opinionated API specification that emphasises a highly structured and consistent way of dealing with data and algorithms. It takes a fair bit to wrap your head around and there is a lot of up-front effort before you start to get rewards. But once it's set up, it does so much heavy lifting for you that it saves enormous amounts of time in the long run.

By far the best way to style a website that I have ever come across.

My long term goal is just to keep getting better and better at building digital-first products and services. To pursue that goal in 2021, I want to learn the following:

To build really big apps with high performance, I need to get good at splitting them up and hosting them in separate little bits called containers. Not terribly excited about this but it's necessary!

🤖 Physical Computing & Simple Electronics

At the moment I build custom web and mobile applications. In 2021 I really want to add the ability to build custom IoT (Internet of things) devices too. There are so many cool products that can be made using small computers and simple robotics.

⛓ Building Etherium & Blockchain-Based Applications

I firmly believe that cryptocurrencies are here to stay and will eventually surpass the ease of use and popularity of traditional fiat currencies. I'm very excited about the potential of Etherium (the second most popular one), especially for everyday transactions and I want to learn more!

Rust is apparently the best thing to happen to high-performance computing environments in decades. If I get somewhere on my quest to learn physical computing, I'll definitely be giving it a go!

I want to get a basic 3D printer and start making cool things. By 2022 - 2023 I want to start being able to develop genuinely useful hardware-first products.

I probably won't get to cover all five of these goals! There is always a tradeoff between what I want to learn and what's going to have a real financial impact. But I'll try my best!  

My To-Learn List for 2021

I’ve been thinking a lot about who I need to become to reach the next step of my professional evolution. Here's my little theory on the skills leaders need and how they relate to company growth. 

The Law of Growth (if it exists), is that it only happens at the speed of the most limiting factor. Knowing what factor is currently your limiting factor can help identify how to get unstuck. This factor can be many things, but most often, it is the team leader's skills.

I think it’s also interesting and important to view growth is the layering of support around and steady improvement of front-line work. Companies grow when excellent technical execution results in more demand that is met without a fall in quality. The whole purpose of building operations, management and leadership layers are to keep quality high at a larger and larger scale.

I feel this visualisation works because it explains some common mistakes we see happening all around us.

Starting a business without front-line technical expertise or the funds to acquire that expertise results in failing to gain traction. If you can’t fix a real customer’s problem you will not gain traction. (I’ve done this one!)

Growing a small business around a genuine passion or craft and losing interest after ever-increasing operation duties pull you away from the work itself. I think the best solution here is to stay small and try to increase prices via reputation and exclusivity.

Small business burnout from the struggle to teach expertise and build up the capability of others to cover the front-line work. I’ve got to watch out for this one as it’s common in fields like engineering or software development.

Companies struggling to make the leap from small business to medium-sized enterprise because it requires such an all-round leader skill-set to navigate the transition.

SMEs that fail to retain staff and maintain output quality because they resist bringing in professional management practices.

Larger corporations that have dead culture because they are led by highly effective management types rather than charismatic, human-focused leaders.

In conclusion, I’m looking forward to the journey of transitioning from freelancer to small business in the next wee while and I’ll surely find out if my theory is true or not!

Leader skills vs team size

Typeform.com is a fantastic surveying tool. It lets you create powerful user-friendly forms that you can share via links or embed in web pages. I've personally used Typeforms in the past to conduct user feedback surveys and market research.

One of the most powerful ways to use Typeform is as a lead generation tool. For example, asking website visitors to fill out a custom survey on your website in return for a customised evaluation, free ebook or guide. This allows you to generate and qualify leads while helping people understand their problem better and teaching how you can help.

Currently, a client is using Typeforms to provide an easy way to trial and participate in one of their self-development programs. The tricky part for them, however, is sending the customised responses based on the survey results. They have a fantastic set of templates but it's starting to take up way too much manual time to send each survey participant their customised response.

To fix the problem, we've decided to set up a script that runs every 5 minutes and requests form submissions that were completed in the preceding 5 minutes. It then takes each submitted set of answers, combines them back with the original questions, prints them out into a templated email and sends it to the survey participant along with any attachments (if appropriate). It also sends a copy of the email to an admin email address to keep track of results.

💻 Typescript 
A type-safe "upgrade" of the Javascript programming language. Developed by Microsoft as an open-source project and has nothing to do with Typeform.com.

(However, for simplicity, I've converted all code displayed here to plain old Javascript for easier reading)

⚙️ Node.js
An open-source, server-side javascript runtime

🧰 Cron
An open-source library dedicated to scheduling recurring tasks.

✉️ Twilio Sendgrid
An email automation service built to enable easy programmatic emailing.

⛩ Heroku by Salesforce
A "serverless" app hosting platform that enables programmers to build and launch applications faster by focusing on code rather than web hosting infrastructure.

📝 Typeform.com
As you know by now, an online service for making to people-friendly forms and surveys.

For more information on how to do this check out the links below.

https://medium.com/@adnanrahic/hello-world-app-with-node-js-and-express-c1eb7cfa8a30

https://nodejs.org/en/docs/guides/getting-started-guide/

First, I made a list with every form I wanted to automate answers from, with ids, custom content and attachments if applicable. 

Find a form's id by looking at the ID code in its URL, for example, with admin1234.typeform.com/to/j7w2a6ZV, the form's id is j7w2a6ZV

Note the use of <br/> to create line breaks in the final HTML email.

export const forms = [
  {
    id: 'DCjBRRsI',
    firstLine: 'Hey!',
    paragraph: `Great effort filling out survey 1!<br/><br/>`,
    lastLine: `Cheers, <br/>Company Name<br/><br/>`,
    attachment: '/files/InfoEbook.pdf',
  },
   {
    id: 'YDjBGIsW',
    firstLine: 'Hey!',
    paragraph: `Great effort filling out survey 2!<br/><br/>`,
    lastLine: `Cheers, <br/>Company Name<br/><br/>`,
    attachment: '/files/InfoEbook.pdf',
  },
];

Set up an automatically recurring function. 

Cron is incredibly powerful, learn more about it by checking out the links below.

import { CronJob } from 'cron';

const job = new CronJob('*/5 * * * *', async () => {
  // Everything in this block will be run every 5 min
  
  // This is where we will put our email automation script.
});

// Don't forget to run it!
job.run();

Inside the Cron Job I have a loop that goes through the list of forms and performs three functions for each form.

Function #1 Handles the fetching of Typeform answers.

Function #2 Handles attachments

Function #3 Sends the emails 

Step 4: Set up the Typeform Fetching Function

I used the following function to fetch and convert Typeform responses into a list representing emails to send.

#1 Get form submissions
#2 Get form fields
#3 Loop through submissions
#4 Loop through fields and insert them into an array.
#5 If a field has an answer, find and insert it along with the field.

Notes:
- I'm using Axios, a great Javascript library for performing API requests.

- Typeform requires an auth token with each API request that you can find under "Personal tokens" in your Typeform account settings.

- Yes I am making a 5 level deep, for-loop of death ☠️

import Axios from 'axios';
import { typeform_token } from './config';

export const fetchTypeformResponses = async ({ formId }) => {
  const err = { success: false, output: null };
  try {
    // empty array to return processed email responses
    const emailResponses = [];
    
    // Get timestamp of 5 min ago
    const t = new Date();
    t.setMinutes(t.getMinutes() - 5);

    // #1 Get this form's submissions from up to 5 min ago
    const answersRes = await Axios({
      url: `https://api.typeform.com/forms/${formId}/responses`,
      method: 'get',
      headers: {
        authorization: `bearer ${typeform_token}`,
      },
      params: {
        page_size: 100,
        since: t.toISOString()
        completed: true,
      },
    });

    // #2 Get this form's fields (questions and instructions)
    const formRes = await Axios({
      url: `https://api.typeform.com/forms/${formId}`,
      method: 'get',
      headers: {
        authorization: `bearer ${typeform_token}`,
      },
    });

    if (!formRes.data.id) {
      throw new Error('Failed to find form');
    }

    // #3 loop through each form submission
    for await (const submission of answersRes.data.items) {
      // template to push into emailResponses array
      const emailResponse = {
        recipient: '',
        sections: [],
      };

      // add title
      emailResponse.sections.push({
        type: 'title',
        text: formRes.data.title,
      });

      // loop though form's fields insert into email
      for await (const field of formRes.data.fields) {
        // if statement
        if (field.type === 'statement') {
          emailResponse.sections.push({
            type: 'header',
            text: field.title.replace('*', '').replace('_', ''),
          });
        }

        // if email field
        if (field.type === 'email') {
          // find and insert answer
          for await (const answer of submission.answers) {
            if (answer.type === 'email') {
              emailResponse.recipient = answer?.email || '';
            }
          }
        }

        // if short text
        if (field.type === 'short_text') {
          // insert question title
          emailResponse.sections.push({
            type: 'header',
            text: field.title,
          });
          // find and insert answer
          for await (const answer of submission.answers) {
            if (answer.field.id === field.id) {
              emailResponse.sections.push({
                type: 'text',
                text: answer.text || '',
              });
            }
          }
        }

        // if multi choice
        if (field.type === 'multiple_choice') {
          // insert question title
          emailResponse.sections.push({
            type: 'header',
            text: field.title
          });
          // find and insert answers
          for await (const answer of submission.answers) {
            if (answer.field.id === field.id) {
              // single select
              if (answer.choice) {
                emailResponse.sections.push({
                  type: 'text',
                  text: `${answer.choice.label}`,
                });
              }
              // multi select
              if (answer.choices) {
                let labels = '';
                for (const label of answer.choices.labels) {
                  labels += `${label}, `;
                }
                emailResponse.sections.push({
                  type: 'text',
                  text: `${labels}`,
                });
              }
            }
          }
        }

        // if phone number
        if (field.type === 'phone_number') {
          // insert question title
          emailResponse.sections.push({
            type: 'header',
            text: field.title
          });
          // find and insert answer
          for await (const answer of submission.answers) {
            if (answer.field.id === field.id) {
              if (answer.phone_number) {
                emailResponse.sections.push({
                  type: 'text',
                  text: `${answer.phone_number}`,
                });
              }
            }
          }
        }
      }

      // push formatted email response to list
      emailResponses.push(emailResponse);
    }

    return {
      success: true,
      output: emailResponses,
    };
  } catch (e) {
    console.log(e);
    return { ...err };
  }
};

My "sendEmail" function is just a lazy wrapper of SendGrid's Node Library, although I used a custom function called "makeHTMLTemplate" to form the actual HTML email.

import sgMail from '@sendgrid/mail';
import { sendGridAPIKey } from '../config';
import { makeHTMLTemplate } from './email-templates';
sgMail.setApiKey(sendGridAPIKey);

export const sendEmail = async ({
  recipientEmail,
  senderName,
  senderEmail,
  subject,
  firstLine,
  paragraph,
  contentArray,
  lastLine,
  attachments,
}) => {
  try {
    // send le email
    await sgMail.send({
      to: recipientEmail,
      from: `${senderName} <${senderEmail}>`,
      subject,
      attachments,
      html: makeHTMLTemplate({
        title: subject,
        subject,
        firstLine,
        paragraph,
        contentArray,
        lastLine,
      }),
    });
    return { success: true, message: null };
  } catch (e) {
    console.log(e);
    return { success: false, message: e.message };
  }
};

The last step is to create the email. 

Someone has yet to build the best templating engine for formatting HTML emails* so I just do it with giant ugly strings;

*Or I haven't bothered looking hard enough

- I have removed all styling or this would look absolutely disgusting.
- You can find great HTML email templates by searching on GitHub.

export const makeHTMLTemplate = ({
  title,
  subject,
  firstLine,
  paragraph,
  contentArray,
  lastLine,
}) => {

  // function to loop through and insert the 
  // processed Typeform answers
  const createBody = (contentArray) => {
    let html = '';
    for (const content of contentArray) {
      if (content.type === 'title') {
        html += `
      <tr>
        <td>
          <table>${content.text}</table>
        </td>
      </tr>`;
      }
      if (content.type === 'header') {
        html += `
      <tr>
        <td>
          <table>${content.text}</table>
        </td>
      </tr>`;
      }
      if (content.type === 'email') {
        html += `
      <tr>
        <td>
          <table>${content.text}</table>
        </td>
      </tr>`;
      }
      if (content.type === 'text') {
        html += `
      <tr>
        <td>
          <table>${content.text}</table>
        </td>
      </tr>`;
      }
    }
    return html;
  };

  // return the email with fields inserted as a giant string;
  return `<!doctype html>
<html>
  <head>
    <meta name="viewport" content="width=device-width">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>${title}</title>
  </head>
  <body>
    <table>
      <tr>
        <td>&nbsp;</td>
        <td>
          <div>
            
            <span>${subject}</span>
            <table>
              
              <tr>
                <td>
                  <table>
                    <tr>
                      <td>
                        <img src="https://company.co.nz/images/logo.png"></img>
                      </td>
                    </tr>
                    <tr>
                      <td>
                        <p>${firstLine}</p>
                        <p>${paragraph}</p>
                        <table>
                          <tbody>
                            ${createBody(breakdownArray)}
                          </tbody>
                        </table>
                        <p>${lastLine}</p>
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>

            
            </table>
            
            <div>
              <table>
              </table>
            </div>
            
          
          </div>
        </td>
        <td>&nbsp;</td>
      </tr>
    </table>
    
    <span style="opacity: 0"> ${Date.now().toString()} </span>
  </body>
</html>`;
};

The resulting auto-responding emails look like this, with the Typeform answers nicely formatted, custom messages and attachments (not shown in pic).


That's it! Hope you found this interesting and or useful!!

How to Automate Email Responses to Typeforms with NodeJS

I initially built a simple ordering app for Go Eco's bicycle delivery project. They were happy with the result and asked me to come in for a chat to discuss ways of streamlining the data requirements of their food rescue service. 

The food rescue service takes edible food that is about to be discarded from supermarkets and bakeries and distributes it for free to community groups that give it to the needy. We decided to go ahead with an app that would streamline the tracking of their food pickups and deliveries - this would free up their time and help them report their impact when applying for funding.

We discovered 3 areas of focus
1. Recording the types and quantities of food at each pickup
2. Recording the types and quantities of food at each delivery
3. Reporting the overall impact of the operation in a visual way

I initially went along with Simon from Go Eco on a couple of food rescue trips to understand the nature of the operation first hand.

Afterwards I sketched out a rough UX and UI design for the application on Adobe Illustrator. Some examples from the document are shown below.

I was able to reuse a lot of code written previously for other projects, so the total development time was only a few days 🎉

The software stack I used was:

Socket.io
Node.js and the Express Library
Prisma ORM

I was very pleased with the final product and I'm also super happy that the team from Go Eco received it quite well!

Case Study: Kaivolution Food Rescue Service

According to the legendary fighter pilot and strategist John Boyd, there are two types of people; those who want to BE and those who want to DO. In other words, there are those that above all, seek praise and there are those who seek purpose.

We typically start off as doers but the pressures of life eventually push most of us into be-ers. The desires to rise up the social order, prove someone wrong, compete with our peers and achieve success lead to compromise. We give up on saving the world, to save ourselves instead and protect the system that we've climbed our way up in.

To be fair, both types of people are needed. Be-ers are good at doing what they are told. Without be-ers, society might fall apart. However, without doers, the world would never have made any progress at all. 

Most organisations and cultures start off as doers but eventually, as fewer and fewer things need to be figured out, the doers get replaced by be-ers. Most organisations go from being managed by leaders to being led by managers. The bigger the organisation, the likelier it is that the people doing the work have been completely sidelined by project managers, consultants and ladder climbers. It's a common business saying that you should design a company to be run by idiots because eventually, it will be.

For example, the governments of developed countries. By the 1960s most of what needed to be figured out had been done and all the doers left. Since then, we've just seen governments achieve less and less for higher relative costs. Developed countries today simply can not pull off the big infrastructure projects that they could in the 20s-50s.

Be-ers will flock to whatever careers and roles have the most importance and prestige. Today, big-name tech firms are being flooded with people that have zero technical background. These Management Consultants and Product Managers are mostly attracted by prestige, money and power and they will eventually drive out all the doers. I guarantee that in 10 years working at Google, Facebook, Apple, Microsoft etc will be the same as working in Big Oil, Big Auto, Power Utilities or Big Banking today.

In contrast, doers flock to whatever they consider to be the hardest and most important challenges facing humanity. They are the rebels, weirdos, and geeks, the true believers in human progress. Today's doers are clustered around sustainability, biotech, blockchain, nuclear power, space, robotics and any other areas where important problems need to be solved. Sometimes, doers strike it rich by riding the wave of an enabling technology with far-reaching consequences but that's not why they do it. They do it because they want to change the world.

In meetings do you focus on actions, results and lessons or opinions and details that prove how smart you are?

Do you play your own game and live life your way, or do you try to compete and compare your status to others?

Do you work in an environment that rewards bold creative ideas or one that rewards being correct?

Do you stand up for your beliefs when they are unpopular or do you say what gets you promoted?

Do you judge people by what they do or by what they say?

Do you worry about looking good or about achieving meaningful goals?

John Boyd, one of my personal heroes, was a heavily overlooked American fighter pilot and military strategist. Nevertheless, his theories like the OODA Loop, Energy Manoeuvrability theory and Destruction and Creation, have revolutionized military, business, sport and legal fields. (Seriously look him up!)

Boyd had a well known "to be or to do" speech. He said eventually, we reach a fork in the road. The easy path is to compromise, follow the rules, save ourselves and get comfortable. The hard path is to give up having a normal career and dedicate yourself to doing what is right.

We can choose to be part of the system or shake up the system.

As Ben Horowitz of Andreessen Horowitz puts it, "There are two kinds of cultures in this world: cultures where what you do matters and cultures where all that matters is who you are. You can be the former or you can suck." 

When I look back at my career one day, I won't care how much money I made. I will care about how much I contributed to things that made a positive difference. The best way I've seen it put by someone who was a genuine doer:

Don't worry about being recognised, worry about being worthy of recognition - Abraham Lincoln

To BE or to DO

According to Peter Theil in his book Zero to One, there are four ways that businesses can create long-term competitive advantages. Here's my view on how to take advantage of them.

AKA proprietary technology. If you can solve a hard problem better than anyone else, you can turn it into an advantage. Obviously, this isn't easy and will require a lot of hard work. The way to maximise your advantage is to master a small circle of expertise that is highly difficult, economically important, and under-served. The amazing thing is that nobody or no lack of resources can really stop you from achieving this. It comes down to your ability to develop a useful set of knowledge and skills.

AKA branding. Companies with great reputations sustain prices waaay higher than normal (just ask Apple or Nike). Products from these companies have lower perceived risk, increased perceived quality, and enhance customers' social status and sense of self-esteem. Amazingly, no one can really stop you from achieving this either. Reputation is just a lagging indicator of culture and quality of output.

AKA economies of scale. Doing something many times results in lower costs. The cost of R&D is divided between more purchases, production gets incrementally more efficient, and resource costs per unit decrease as orders get bigger. As the saying goes, learn by iteration, earn by replication.

AKA network effects. When people have spent time and energy learning to do something one way, they resist having to change. For example, it's hard to change social networks if all your friends aren't switching, most of us stick to Google for our preferred search engine and buy online at the same websites again and again. Theres a powerful momentum in human behaviour that gets multiplied if it involves more people.

If we add them all together, the way to build a company with long-term competitive advantages is to master a specific discipline that is highly difficult,  economically important and under-hyped. Then use this superior expertise to delight your customers and build a strong reputation. Once you've iterated and perfected your products or services, lower your costs by replicating them ever more efficiently across a particular type of customer. Eventually, you will establish worn-in behaviours that will help retain your existing customers and encourage new ones.

How to Harness The 4 Long Term Competitive Advantages

I couple of months ago I heard about an app-based laundry service in a big American city and thought it was a really cool idea. I particularly liked it because the value proposition was so simple; get your laundry picked up, washed, dried and dropped off. I really like businesses based on simple propositions where one can succeed by executing the technical side of things extremely well. It seemed like a possible opportunity so I had to figure out if there was anything in it!

I spent an hour researching the problem but I decided to stop there as it can sometimes be discouraging and distracting to see what's already out there. I'd rather start from a fairly blank canvas and explore the problem for myself. I also talked to some friends to see what the general receptivity to the idea is.

I just started building it in my spare time...

Awesome! I now have a fully functional web app and iOS and Android apps. However it usually takes a week or so of bureaucracy and setting up various things to get the apps humming along as well as setting up things like push notifications.

I now have a simple starter platform consisting of one website and two mobile apps ready for testing...

Test One will consist of me using the app for myself as a customer, and doing the laundry pretending to be the service.

My job this week is to find 5-10 people who are willing to be a test user group. 

I need to use a test user group in order to actually figure out what the hell I'm doing before I try to actually sell this to someone.

Case Study: Laundrysaurus

A project that I've really enjoyed being a part of is helping the WaterBoy Charity with automating and digitising their Personal development program.

The app is only finished stage one of the planned four stages. It will eventually be a fun, compelling game and community platform that provides and incentivises positive opportunities for marginalised youth.

I'm super proud of the baseline features already made and looking forward to making an amazing app.

Case Study: Personal Development Program Community App

I was recently approached with an interesting problem. A client had an enormous JSON dataset but was unable to analyse it due to its format and nesting.

JSON stands for Javascript Object Notation, it's just a convenient way of storing information with simple rules. 

- Objects are in brackets,
- Lists are in square brackets,
- Every value has an associated key,
- Keys and text values are kept inside double-quotes.
- All entries are separated by commas, EXCEPT the very last one

Here is the most basic example I could think of:


Here is a more realistic example. For convenience we are going to stick with this car example.

If you were to put the above car example into an excel table, the value for owners and safety don't translate to a value you can put in a cell. 


The way I chose to solve this was to write a custom script to process each instance of "safety" and "owners" and convert them to excel friendly formats.

Alternative solutions might be to use something like Microsoft PowerBI but you would still need to have some way of handling the nested "Owners" and "Safety" columns.

Computers aren't designed to hold entire huge files in memory, instead, databases were designed for that specific purpose. To fix this, I had to write a script that would stream the values in the JSON file line by line for conversion.

I used Node.js to execute the following function:

// Node.js built in file system library
import fs from 'fs';
// just a typescript definition (not important)
import { Car } from '../type-defs/Car'; 
// 3rd party libraries
const { chain } = require('stream-chain');
const { parser } = require('stream-json');
const { pick } = require('stream-json/filters/Pick');
const { streamArray } = require('stream-json/streamers/StreamArray');

// File we're reading from
const readFile = `./data/input.json`;
// File we're writing to
const writeFile = `./data/output.csv`;
// Status counter to be logged for every 100 lines
let counter = 0;

// add heading to output file
fs.appendFileSync(
  writeFile,
  `Type, Model, Year, IsRunning, Kms, Oners, Safety \n`
);

// read input file
chain([
  fs.createReadStream(readFile),
  parser(),
  pick({ filter: 'cars' }),
  streamArray(),
  // the code below executes for each item in JSON file
  ({ value }: { value: Car }) => {
  
    // counter logging (not important)
    counter += 1;
    if (counter % 100 === 0) {
      console.log(counter);
    }
    
    // Process Nested Entries for "Safety" and "Owners"
    let owners = ''
    for (const owner of value.owners) {
      owners += `${owner} `
    }
    let safety = ''
    for (const safety of value.safety) {
      if (safety.airbags) {
        safety += `${airbags}`;
      }
      if (safety.seat_belts) {
        safety += `${seatbelts}`;
      }
      if (safety.abb) {
        safety += `${abb}`;
      }
    }

    // function that removes commas and quotes (to be safe)
    const cleanse = (str: string) => {
      if (!str) { return '' }
      return str
      .split(',')
      .join(' ')
      .split(`'`)
      .join('')
      .split(`"`)
      .join('');
    };
    
    // write new line into to output csv file
    fs.appendFileSync(
      writeFile,
   `${cleanse(value.type)}, ${cleanse(value.model)}, ${value.year}, ${value.isRunning}, ${value.kms}, ${cleanse(owners)}, ${cleanse(safety)} \n`
    );
  },
]);

The script above will process a file of around 1.5 GB into a csv file of around 150 MB in under 5 minutes.

The resulting table would look like this


Hope you found this interesting or useful!

Case Study: How to Convert a Huge JSON File to CSV for Analysis

Choosing the hard way leads to an easy life, taking the easy way leads to a hard life. Also, risks are proportional to reward so they are the only way for my path to be compounding instead of linear. The more I had at stake, the harder I had to work and the more I was forced to grow.

If I give in to feeling sorry for myself, I will find more and more reasons to feel sorry for myself. If I commit to feeling gratitude, I will find more and more reasons to feel grateful for my life. If I focus on what I love, I will attract more of what I love, If I focus on what I fear, I attract more of what I fear. Cultivating positive emotions are the key to building self-confidence and momentum.

In other words, the strength to keep getting rejected without losing confidence. The human quality with the highest ROI is courage. In my opinion, I still suck at these but I'm trying to get better. 

This is why it's so important to do something that I really care about. If I want to win, I have to be able to hold on through the tough times.

Go as direct as possible. If I want to do something, start doing it as soon as possible. Whether it's Sales, Engineering, Marketing, etc. Just try to do it, fail miserably, and try to do it a little bit better. The faster I start doing it, the faster I'll learn and find the most relevant information - which is usually free.

The worst way ever is to waste 3-4 years doing a degree that only teaches self-inflating theories and how to bullshit my way through fake simulated assessments. Do the real thing, don't get permission and don't let anyone tell me I'm not ready.

I'll suck at something for a long time before I can start doing it really well. Don't let expectations and disappointment kill my motivation, learning is supposed to feel like play.

The easiest way to do something is to make yourself have to do it. Knowing what to do is easy but actually doing it is really hard because willpower is weak and fickle. For example, I know exercise is really beneficial but it's hard. "Put a gun to my head" means creating commitments that force me to do the things that are good for me.

⌛️ Never wait for the perfect opportunity

As a natural prospector rather than judgment maker I'm HORRIFIC at this. Life is a very long race. If I fully embrace the opportunities I get, I will attract better and better ones. I will go much further making the most of small opportunities than trying to get the perfect opportunity from the beginning.

If I finish the things I start, they will catapult me forward into more opportunities. If I don't carry things through to completion, fewer and fewer opportunities will come my way. Try to resist the boredom for a bit longer and see things through.

🤝 Relationships are even more important than ability 

Reputation is the thing that brings opportunity and leverage in a negotiation, and it's just a lagging indicator of current ability and output. Companies with great reputations sustain prices way higher than their competitors. 

Relationships are so important because they have a distributive effect on my reputation. They will always be the best pathway for opportunities that make a difference for myself and others. Loads of talented people fail because they didn't create relationships with people that could give them opportunities. In contrast, loads of people with little ability do well thanks to friends and family in high places.

I did quite well in school and uni because I was extremely good at finding shortcuts and hacks for bullshitting my way through assessments. Formal education taught me that it's more important to look like I was "doing the work" than actually doing the work. 

The real world is the complete opposite. Anything worth doing is hard and only worthwhile if done properly. In fact, the harder something is, the more satisfying its pursuit becomes, and the less competition I'll have.

Normal people get normal outcomes, abnormal people get abnormal outcomes. It's just supply and demand, the universe disproportionately rewards rare abilities and discounts common ones. The more unique my perspective, the more I'll see solutions and generate ideas that others won't. I try to combine hobbies and interests that don't compliment each other. I must seek social circles with very little overlap. It pays to cultivate skills and talents that are rare. 

💵 Earning is a lot less fun than learning

Learning happens through trial and error, testing and reflection, iterating until I get something right. Learning is incredibly satisfying and fun. Earning, on the other hand, is about replication, repetition and refinement of things that already work. Earning is extremely boring. I still don't quite know the solution to this yet!

Find a high growth industry that's aligned with the future. I can easily do 5-10x better by getting in the right team and being around the right people. Pick a fast-growing industry, pick a company growing faster than the industry, in a role that is growing within the company.

13 Most Important Lessons of My Career So Far

I met Felix at a LinkedIn Local Event and instantly loved the bike delivery service he was starting at Go Eco. I couldn't resist building him a simple web app for handling orders, sending receipts and alerts via email and SMS.

Below are some screenshots of the web app in action.

Ordering page with autosuggested addresses, and persistent sender fields for faster re-use.

Easy data-table style page where all the orders can be viewed.

Simple popup with an orders details and automatic links to addresses in Google Maps and Phone number links for easy contacting of customers.

Depending on the status chosen, receipts and alerts are automatically sent to the sender and recipient. Receipts are sent via email. Only the final delivery confirmation is sent to the recipient via SMS message.

After some trials we have decided to evolve the app to include payments via Stripe, watch this space!

Case Study: Go Eco E-Bike Delivery Service

Successful businesses tend to focus on relationships with one type of customer and solving their problems. At some point, they have to decide what value-adding activities should be in-house and what value-adding activities should be contracted out.

A rule of thumb I have often heard is "Never outsource core competency". In other words, only do the most important things in-house and grow expertise in that. The rest should be outsourced to other companies who are experts in that space.

A tech partner is a company that works with you to develop custom products or services that directly help you exceed your customers' expectations.

Only get a tech partner if you're an expert in the problem being solved, have strong customer relationships and you only need technical expertise to help take your execution to the next level.

Tech consultancies are people with powerful solutions in search of problems. We know a lot of tools that can improve products and services but these tools are next to useless if we don't have access to someone who truly understands the problem they are trying to solve. 

🚫 Dealing with your customers

🚫 Understanding your customers or market

🚫 Knowing which problem is the most important to solve

🚫 Running your operations

🚫 Building you something that does what a product from a Tech Giant already does.

✅ Automating your amazing hand-crafted but time-consuming processes

✅ Making your product or service easier to use

✅ Making your product or service have more powerful capabilities

Tips for getting the best out of your tech partner

Remember that technical work is a messy process of trialling solutions and failing until you get it right.

✅ Keep build cycles as small and short as possible.

✅ Have clear objectives.

✅ Focus on solving only one or two problems.

✅ Don't ask for more features, make them keep improving the existing ones.

✅ Keep building to a maximum and planning to a minimum.

✅ Keep planning sessions to discussions about trials and results not fluffy opinions about possibilities and risks. (Look up bikeshedding)

How to Get The Best Results From A Tech Partner

I'm doing more freelance work and slowly starting my own agency. I figured a good place to start would be to scour the internet's forums and communities for all the things people hate most about working with software agencies. This way I'll always have a nice list to remind me of what NOT to do.

Most of this came from Quora, Reddit, Slack Groups, Facebook groups etc.

The easiest way to wow customers is to reply immediately. But there are two problems, context switching kills productivity and customer service people cause more harm when the subject is technical or requires background knowledge. The best alternative is to set multiple specific times each day for asynchronous communication (like email).

⌛️ Long Turn Around Times for Deliverables

Some agencies will let favoured projects skip the queue or handoff lesser projects to cheaper juniors who are clueless about your business. The result is that some projects inevitably take forever.

In the worst-case scenario, they will outsource your project without your knowledge. Another cause of long turnaround times is bureaucracy - See Playing Grapevine below.

Some agencies can't resist using people's lack of industry knowledge against them. Larger, older agencies are notorious for this. I won't name names but I have heard of agencies purposely targeting people with low tech skills and charging them high fees for bullshit services like "Website Maintenance" or making a crappy website and charging for "Online Presence".

All agencies develop processes that involve the management of devs/designers. This management results in additional overhead costs that are passed on to the client. For example, your request may go through your account manager, who then passes it to a project manager, who then passes it to a developer. These processes may result in longer turn around times and poor understanding of objectives. 

Personally I believe in divisional vs functional structures as it creates a better understanding of the purpose of the work being done. Instead of project managers, have small multidisciplinary teams responsible for the end-to-end delivery of a project. With appropriate incentives, they will beat a horizontal bureaucracy all day long.

Another common infringement is over-selling to customers and not delivering the pitched results. I know of several agencies with slick-talking sociopathic leaders who promise the world to customers and then bully their teams in an attempt to get it. These leaders often lack technical skills and deliver poor results by trying to make the tech do things it shouldn't.

How to tell, 
- Their website is a 10-year-old piece of junk made in WordPress. 
- Their sales pitch is amazing. 
- The company is built on one person's reputation
- Big upfront payments - their results won't speak for themselves

They know web technology but not your industry or business. Agencies that don't do their research become "order takers" instead of "idea makers". They produce what the client is asking for but don't add technical or creative expertise.

Agencies, powered by one or two narrow services but clueless on everything else. If they are absolutely amazing at those one or two things then they should just specialise.

Agencies that pitch themselves as tech experts but use tools and technologies from 10 years ago. They're typically a bit arrogant and have a snobby demeanour towards newer agencies.

If there was one problem I could fix in the tech industry it would be this. Too often, a good solution gets bloated and "junkified" by people making it do all kinds of things in addition to the original intended purpose.

Clients rarely understand the dangers of poor design discipline so it is our ethical duty to save them from it - Just as an engineer would tell a client that their design is unsafe.

- Avoid design by committee
- Help clients focus on solving one problem at a time.
- Don't go on to the next problem until you have actually solved the first.
- Don't talk about all kinds of additional features to slap on.

🚧 Not Differentiating / Knowing their Market

Beware of agencies that say they are good at everything. Their core commodity is expertise and no one is an expert at everything. It's vital they have a vision, picked one thing to be best at and built their reputation around excellence in that area. Have one particular concern in mind above all else, and choose the agency that specialises in that thing.

10 Worst Things That Web Agencies Do

Here is everything I wish I knew 4 years ago when I started on my journey to becoming a full-stack developer. I really hope it helps someone in a similar situation to where I was.

A full-stack developer is just a developer who can use tools across the software spectrum. In other words, someone who can build a complete application with a "front-end" like a website, a "backend" like a server that handles logins, and a database that can store and fetch information.

Unlike most other professions, you don't need to know a bunch of theory to become qualified. It's not operations or administration focused where you do repetitive tasks or follow procedures. It mostly consists of creative and logical problem solving and you only get better by doing it. To get hired, you just need to be good enough - it's as simple as that.

I work with rebels and dreamers to build radical digital-first products and services

About

Origin story

Values

Services

Skills & Technologies

Latest posts

⛏️How To Do Great Work - Extracts of You and Your Research by Richard Hamming

⏳How to Detect Inactivity and Auto Reset a React Web App

⛳My To-Learn List for 2021

📊Leader skills vs team size

Get future posts via email

Most popular posts

📬How to Automate Email Responses to Typeforms with NodeJS

🛠️How To Become A Full-Stack Developer in 2020

❤️The Company Culture I Aspire to Build

🧭13 Most Important Lessons of My Career So Far

🍞Case Study: Kaivolution Food Rescue Service

📈How to Harness The 4 Long Term Competitive Advantages

Quick links