Chris Burnell

Front-End Developer

Biography

I’m a self-taught developer driven by a passion for the front-end to create a faster and more open web for everyone. It’s always been important to me to keep abreast of trends on the web, and I enjoy experimenting with these technologies to discover use-cases for my work, and I use my website as a platform to guide my learning and share what I’ve learned. In recent years, I’ve also become interested in content ownership online and have gravitated towards movements like IndieWeb.

Work Experience

  1. London Web Standards & State of the Browser

    Organiser

    March 2018 – Present

    Being an avid attendee of London Web Standards, a bi-monthly meetup, and State of the Browser, an annual conference, since 2012, I was ecstatic to give my first lightning talk in 2016. Two years later, I joined the Organisers team, and it’s been nothing short of a rewarding experience for me. At their cores, both LWS and SotB serve as free and cheap platforms for designers and developers to learn from some of the best thought-leaders and speakers in our industry.

  2. Squiz

    Front-End Developer

    February 2018 – July 2020

    I was part of a small team of front-end developers tasked with supporting Squiz’s digital transformation projects primarily through delivering cut-ups, coordinating and building design systems with other teams, and building solutions in Squiz’s CMS, Matrix.

    • was part of an internal group in charge of building and maintaining the company’s front-end build tools
    • championed and helped to educate our developers on best practices and techniques to make our jobs easier and more enjoyable

  3. City, University of London

    Web Developer

    June 2014 – February 2018

    The Web Team at City was in charge of maintaining City’s five school websites and fielding incoming requests and web-related queries. My work was heavily focussed on the CSS-side of our codebase, and this allowed me to research, build, and test a robust library of SCSS that simplified how we developed, how quickly and easily design iterations could be made, and significantly cut down on mental overhead. These skills and knowledge I acquired were critical on some important projects which I helped lead:

    • Clearing Web Application (clearing.city.ac.uk) — Complex system of logic built around a Node.js app on top of a minimal design system
    • Cass Business School Website Refresh (cass.city.ac.uk) — Full implementation of a design system

  4. Squiz

    Front-End Web Developer / UI Developer

    April 2012 – April 2014

    This was my first job in the industry and was extremely invigourating to learn the ins-and-outs of professional web development. My main tasks were in delivering cut-ups and building solutions in Squiz Matrix; although, halfway into my time I switched roles and my focus became solely on cut-ups and advocating for best practices.

    • worked on establishing a standard by which front-end code was written by the London team and helped educate and mentor designers and developers on collaborating on standards
    • organised and ran “Implementor Scrum”, a weekly meeting for developers to have fun and build something unrelated to work and for fun, but using skills that we could hone and apply to our work

Notable Projects & Articles

  1. Pentatonic

    Turn any array of integers into a fun little melody.

    Pentatonic is a little JS library that turns any sequence of numbers on a page into generated music. Available on GitHub and on NPM.

  2. Bowhead

    Memorable and maintainable design tokens in SCSS.

    Bowhead is a small SCSS framework on which to implement your design tokens, spitting out CSS Variables with optional fallbacks. Available on GitHub and on NPM.

  3. National Federation of Women's Institutes

    NFWI was one of my favourite projects to work on while I was at Squiz—I worked on the HTML and CSS side of the front-end as well as doing some work for NFWI’s authors in the CMS.

  4. One Housing

    One Housing was a project while I was at Squiz where I really got to put my knowledge of CSS to the test, so I worked hard to produce a robust framework that was part of the foundation of further front-end development in the One Housing network of sites.

  5. My Website

    My website has been online in various forms since 2008, and it’s my favourite thing that I own—I think of it as part of who I am and gives others a rare lens into my life. Since discovering the IndieWeb in 2017, I’ve begun posting various types of content, from simple notes to likes and bookmarks. Everything is built by Eleventy and is available for perusal on GitHub.

  6. Sassy Lobotomoised Owl

    “Managing spacing between elements and components on your page can be a tiring task if undertaken manually. This is where the lobotomised owl comes in: a short, simple snippet of CSS that simplifies this whole process for you. In this article I’ll explain how I make use of it in a more dynamic way using a SCSS mixin.”

  7. Sparkline Sound-Off

    “I have been following in the footsteps of Jeremy Keith for a few months now. Dotted around my website, now, are sparklines, representing my activity over time. As an added bonus, a little tune based on the sparkline's values plays when you click on it. With a moderate amount of musical theory under my belt, here's how I accomplished that audio delight.”

Companies and brands I’ve worked with

References

Contact details available upon request.