SOS

Shane O'Sullivan's technical blog… really ties the room together

Gitme.me brings joy to your code reviews

Posted by Shane O'Sullivan on September 11, 2019

I recently shipped a fun Chrome extension called Gitmeme.  It brings joy to your code reviews on Github by making is easy and fun to add Gifs and memes to your comments.

Get it from https://gitme.me today!

Advertisements

Posted in Technical | Leave a Comment »

Firebase strips all request cookies

Posted by Shane O'Sullivan on September 11, 2019

A painfully wasteful discovery today was that, when you are using Firebase Functions to serve your code, it strips all cookies from the request object.  The only hack around this is to use a specially named cookie, “__session” and fit any data you need into that.

For example, in the browser

document.cookie = “__session=some_value”;

and on the server

import {parse} from “cookie-parse”;

exports.myFunction = functions.https.onRequest((req, res) => {
const cookie = req.headers.cookie;
const sessionValue = parse(cookie)[“__session”];
console.log(“Should be some_value”, sessionValue);
});

Posted in Cloud, Firebase, Technical | Leave a Comment »

Blazing fast tests with Firebase

Posted by Shane O'Sullivan on May 1, 2019

At Promise, we’ve built some good infrastructure to let us move fast, and I’ve written a post about one of the most effective: getting a 15X speedup in our testing framework.

Read more at https://medium.com/promise-eng/blazing-fast-tests-with-firebase-15x-quicker-155467318d65?

Posted in Technical | Leave a Comment »

sms-splitter – Intelligently split SMS messages

Posted by Shane O'Sullivan on October 22, 2018

At Promise Engineering, we’ve open sourced our code that does intelligent SMS message splitting.  It can do useful things like ensuring messages are split on a space character, and that template tokens are never divided across messages (e.g. an address).

Get it on NPM at https://www.npmjs.com/package/sms-splitter

See the source code at https://github.com/PromiseNetwork/sms-splitter

Read more about it at https://medium.com/promise-eng/intelligently-split-sms-messages-with-sms-splitter-4f3c4d0cc4ec

 

Posted in Technical | Leave a Comment »

Lightweight authentication and upload to Google Cloud

Posted by Shane O'Sullivan on August 25, 2018

Authentication to the Google Cloud, as well as uploading to it, is quite simple when using Google’s Cloud services SDK.  A big downside of using these with NodeJS is that they bring 80MB of dependencies, which if you are packaging your application for distribution is a little bit crazy.

Authentication to Google Cloud’s HTTP JSON API (link) can be a bit tricky in Node, as you need to construct your own authentication token, cryptographically sign it, and make sure you’re using all the right data, serialized just so.  I’ve written a small tool, linked above, to do this authentication for you.

Uploading to Google Cloud’s Storage uses the authentication token, and takes a few other parameters that are easy to get wrong.  The tool also does the upload of a simple file to a Cloud Storage bucket that you have the private key for a service account.

Using the code is simple (see the README)

Screen Shot 2018-08-25 at 8.19.40 AM

Please let me know if you’d like any additions or find bugs in the issues tracker.

Posted in Technical | 2 Comments »

Useful git shortcuts

Posted by Shane O'Sullivan on June 6, 2018

Over the years I’ve found myself following a near identical workflow with Git, and I finally got around to making shortcuts for these common tasks.

You can find these all in a Github repo at https://github.com/shaneosullivan/git-shortcuts, where it makes it quick and easy to work your way through many modified files, `git diff` them, `git add` them, `git add` many files with similar names (like images) and more.

Pull requests welcome, what do you find useful and why?

Posted in Technical | Leave a Comment »

Using React types with Flow

Posted by Shane O'Sullivan on March 22, 2018

A little tip for using React types, such as React.Node or React.Element with Flow.  If you import React into a component like

import React from ‘react’;

then Flow will give you the error

Cannot get React.Node because property Node is missing in object type

The fix is to import React as follows

import * as React from ‘react’;

Posted in Technical | 2 Comments »

Building a browser extension for iOS with React Native

Posted by Shane O'Sullivan on January 17, 2018

For a side project I’m building an extension for Safari on iOS using React Native.  This actually involves writing more Objective-C than I’m used to (I suck at Objective-C), so I wrote a tutorial to remind myself, and you the lucky reader, about all the pitfalls and how to avoid them.

The instructions, along with sample code, are on Github at https://github.com/shaneosullivan/ReactNativeExampleBrowserExtension

Posted in Technical | Leave a Comment »

ReactDependentScript – Load 3rd party scripts first

Posted by Shane O'Sullivan on October 30, 2017

I’ve come up against a common problem when writing React components that depend on a 3rd party JS and CSS files.

Do I load these 3rd party files every time, and pay the performance cost, or manually hack a way to load them when my component is first used?

I decided to fix this properly, which has resulted in a simple React component I’ve open sourced called ReactDependentScript.  You simply wrap your components in <ReactDependentScript …. >, telling it what JS and CSS files to load, and it loads them first, and only when they successfully load does it render the child components.

It also supports taking a function prop to call to render the child components lazily.

For example, you can load jQuery, and then render jQuery plugins or simply use the $ function.

Screen Shot 2017-10-30 at 15.23.38

You can do more interesting things like load the Stripe JS code for their Checkout flow.

Screen Shot 2017-10-30 at 15.25.56

Have a play with it at https://github.com/shaneosullivan/ReactDependentScript, or install it from NPM (https://www.npmjs.com/package/react-dependent-script) with

yarn add react-dependent-script

It’s MIT licensed so use it as you wish.  Please feel free to provide feedback or changes through Github.

Posted in Technical | Leave a Comment »

Looking back at WebOS

Posted by Shane O'Sullivan on September 11, 2017

I recently found my old Palm Pre 3 (the unreleased on I received as a gift), and was amazed at how good it still felt. Here’s a quick video I made of some of it’s features, and one of my favourite apps that I built, Mazer

Posted in Technical | Leave a Comment »

 
%d bloggers like this: