tStack

tStack app

tStack is modular email template builder which I developed whilst working at Sky. The email development team routinely produce HTML emails using snippets of code which they combine together manually to produce the finished article. These include image blocks, footers, social icons and so on. The goal with tStack was to create a simple, graphical tool to allow them to easily create emails by combining these snippets.

tStack snippet preview modal.

The snippets are categorized according to type (Header, Footer, Keyline etc), making it easy to quickly find the snippet you require. To see what your selection would look like in the email, you can click the preview button and the app will display it for you. Simply then click the Add button to include it in your email.

tStack code copy confirmation message.

You can also optionally use the app as a code library of sorts. When you have located the snippet you require, simply click the code button and the code for that snippet will be copied to the clipboard, ready for you to paste into your code editor.

tStack live preview pane.

The app contains a live preview pane, which will constantly display exactly what your current snippet selection will look like once it is created. You can view how the email would look in both desktop and mobile widths.

tStack html file download. tStack downloads folder.

Once you are happy with how your email looks, you can either type in a filename of your choice then click the Download button to save the .html file, or click the Copy Email button to copy the entire email code to the clipboard ready for you to paste into your favourite code editor.

tStack was built with an agile approach using the latest web technologies - React for the front-end, Firebase for the database and authentication and hosted on Google Cloud Platform.