Ahmed's portfolio

Hi, I'm Ahmed Abuelgasim

a senior software engineer with frontend expertise and strong backend knowledge, who’s been creating digital experiences for over %years years.

My story

I'm a senior software engineer who builds accessible, performant and quality digital products. My expertise lies in front-end development, mainly using React and Angular, but I also have ample back-end experience, using Python, Django & PHP. Throughout my career I've worked on numerous cross-functional teams to tackle challenging problems on a wide variety of projects, mainly for Google.

I have a high attention to detail and am a naturally creative person who always brings a unique perspective to any project I work on. I also enjoy teaching what I learned and have led numerous workshops, tutorials and presentations, and written numerous magazine articles and blog posts.

I previously worked as a Nanofabrication Process Engineer after completing a PhD in Electronic Engineering. Feeling unfulfilled in that career path, I decided to pursue my passion and taught myself to code, embarking on a new journey as a software engineer.

My skills

Libraries and Frameworks

  • React
  • Angular
  • AngularDart
  • Vue
  • RxJS
  • Django
  • Sass

Languages

  • JavaScript
  • TypeScript
  • Dart
  • Python
  • CSS
  • HTML
  • Bash
  • PHP

Testing

  • Cypress
  • Jest
  • RTL
  • Jasmine
  • Vitest
  • GitHub Actions
  • GitLab CI/CD

Other

  • Node.js
  • Google Cloud
  • Firebase
  • JSON Schema
  • Figma

My work

Working at Potato, I created countless digital products, almost exclusively for Google. This was great for learning but not for showcasing my skills, since they are all covered by non-disclosure agreements. Instead here are some things I worked on in my spare time.

Keywords

Watchy

  • angular
  • typescript
  • rxjs
  • dexie
  • jest

Watchy is an Angular app that allows users to create lists of movies and TV shows. It uses TMDB's API to get movie and TV show details and saves the lists locally to indexedDB using Dexie.js so there's no need for user accounts or a back-end server.

Although the app is written in Angular, I configured it to run Jest unit tests instead of Jasmine as a personal preference.

Accessible Custom Elements (ACE)

  • accessibility
  • node.js
  • cypress
  • typescript

ACE is an open-source library of UI components accessible to users who rely on assistive technologies or keyboard navigation. The components have minimal, easily overridden CSS styling, making them compatible with any design system, and conform to W3's WAI-ARIA Authoring Practices. The goal of ACE is to help developers create beautiful and fully inclusive websites.

I led the project from concept to publication on npm and use in Potato's website and various Google web apps, and I'm the library maintainer.

The components were created using TypeScript and tested extensively using Cypress. I also wrote detailed documentation and use Node.js and CI/CD to automatically update the documentation web pages, enabling users to interact with latest version of components and view source code simultaneously.

6 Degrees

  • react
  • typescript
  • vite

A game I created a long time ago when I was first learning React. It's based on the '6 degrees of Kevin Bacon' game, where you have to link an actor to Kevin Bacon using a chain of movies and other actors.

My publications

A Website Accessibility Audit Checklist

  • blog post
  • accessibility

Accessibility audit checklist to help ensure websites are inclusive for all users.

A Screen Reader Quickstart Guide

  • blog post
  • accessibility

Tutorial and cheatsheet for how to use the most basic features of the most popular screen readers to encourage developers to use screen readers during development and create a better, more inclusive web.

CSS Methodologies

  • article
  • CSS

Analysis of CSS methodologies, describing the most popular ones and explaining how they may be combined together.

A Comprehensive Guide to Using CSS Grid

  • article
  • CSS

In-depth guide into using CSS grid for creating responsive layouts.

Build a Dynamic Webpage Using CSS Grid

  • CSS
  • article

Tutorial on using CSS Grid to create shape-shifting layouts with a fallback for unsupportive browsers.

Develop and Deploy Sites with Gulp 4.0

  • article
  • gulp

Tutorial explaining how to set up a development environment with task-runner Gulp.

Quantity-specific CSS Styles and Layouts

  • article
  • CSS

Tutorial covering how to change styles and adapt layouts based on the quantity of elements using just pure CSS.

Custom WordPress Theme for Gutenberg Editor

  • article
  • wordpress

A guide for how to create a custom theme for the WordPress Gutenberg editor.

My journey

  • Oct 2023 - Present

    Senior Software Engineer

    Workiva

    At Workiva, I recently converted user dashboard components from Dart to a React and TypeScript microfrontend architecture. I focused on improving performance, scalability and maintainability, while applying a new design system and significantly expanding test coverage using Jest and React Testing Library.

    Previously, I played a key role in building and maintaining a React component library aligned with Workiva's UI standards. The library empowers internal and external builders to customise Workiva platform solutions using JSON configuration and create complex, tailored UI experiences with minimal coding required. As part of this work, I developed a Node.js templating system to automate schema and boilerplate code generation for new components. I also implemented extensive test coverage, localisation support and accessibility best practices.

  • Mar 2021 - Sep 2022

    Senior Frontend Engineer

    Google

    While working at Potato, I joined a team at Google for an 18-month long engagement, leading key front-end development efforts on an Angular app that enables content creators to build customisable web storefronts to sell digital products to their fans. The app also provides tools for community management, content promotion and engagement monitoring, as well as integrations built in collaboration with YouTube and Google Web3 teams.

    One of my primary contributions was building a multifaceted admin dashboard, with analytics tools that provide deep insights into sales metrics, content performance and user engagement, delivered through a variety of dynamic and interactive data visualisations.

  • Oct 2017 - Mar 2023

    Senior Frontend Engineer

    Potato

    At Potato, I was a core contributor on cross-functional teams working on multiple projects, almost exclusively for Google. I collaborated closely with UX and backend engineers to build accessible and performant user experiences through scalable, reusable and maintainable front-end architectures.

    I also identified a recurring need to build accessibility features into new components, which led to me creating ACE, an open-source library of customisable UI components fully accessible to assistive technology users. To facilitate easy adoption, I automated documentation updates using Node.js and CI/CD, enabling users to interact with latest version of components while viewing the source code simultaneously. I led the project from concept to completion and supported adoption across multiple Google digital products and Potato’s website.

    Another key achievement was architecting and leading the front-end development of an Angular app for Google Ads enabling clients to assess digital marketing maturity and receive tailored service recommendations. After a successful launch, it was expanded to support Google's News, Retail and Cloud teams. Over a two-year period, the project complexity grew significantly due to varying branding, design, assessment criteria, recommendations and other requirements across stakeholders.

    As a member of the Accessibility Guild, I regularly conducted accessibility audits and implemented improvements that consistently achieved perfect Lighthouse scores. As part of the Quality Guild, I developed GitLab CI/CD templates to automate deployment to Google Cloud or Firebase, and to integrate Lighthouse testing directly into pipelines, helping minimise regressions.

    I also investigated replacing AngularJS on two major Google projects ahead of its deprecation. I authored technical specification documents comparing alternatives and led the refactoring efforts, resulting in improved performance, security and long-term maintainability.

  • Apr 2016 - Oct 2017

    Freelance Software Engineer

    I created websites from layouts I designed using sketches, wire-framing and Photoshop. I developed the sites using HTML, CSS, SASS, Javascript & AngularJS, and created custom WordPress themes using PHP to allow for content management.

    Although my freelance work was primarily for me to learn to code, I also learned a lot about how to collaborate with clients and guide them towards focusing on what they needed over what they wanted.

  • PhD, Electronic Engineering

    University of Southampton

    For my PhD I increased the resistivity of silicon through deep level doping compensation, acquiring excellent research and analytical skills in the process.

  • Master's degree, Electronic Engineering (First Class Honours)

    University of Southampton

    As part of my degree I studied software engineering, computer systems engineering & C programming, and used many low-level programming languages like VHDL, Verilog and Assembly.

  • A-Levels

    Bilborough College

    Computing: A
    Further Math: A
    Math: A
    Electronics: A

  • International GCSEs

    Unity High School

    Physics: A*
    Chemistry: A*
    Biology: A*
    English: A*
    Computing: A
    Additional Math: A
    Math: A

My gratitude

Thanks for the visit and feel free to contact me on LinkedIn or by email if you'd like to work with me, collaborate or contribute to ACE, or you'd like me to write a blog post or article for you.