Hakimuddin is available for hire

Hakimuddin Haweliwala

Verified Expert in Engineering

Front-end Developer

Location

Hyderabad, Telangana, India

Toptal Member Since

September 1, 2022

A front-end technical architect working on front-end technologies for eight years, Hakimuddin's skill set includes React, Redux, TypeScript, React-Native, Node.js, VueJS, Jest, SCSS, CSS, JavaScript, NextJS, and HTML. He has vast experience developing and architecting startup products and enterprise-level complex applications widely used in the market and building products in SaaS, ITSM, and e-learning domains. Hakimuddin writes robust and high-quality code according to the technology standards.

UI Development User Interface (UI)Software Engineering Web Development Front-end Responsive UI User Experience (UX)Single-page Applications (SPA)Chrome Extensions Web Components Full-stack A/B Testing ServiceNow Web Frameworks JSX IndexedDB

Portfolio

ServiceNow

JavaScript, React, CSS, SCSS, Design Systems, Web Components...

Dekeo Inc

React, HTML, CSS, Front-end, TypeScript, Ruby on Rails (RoR), Ruby, JavaScript...

BrowserStack

HTML5, JavaScript, Jest, Enzyme, React, HTML, CSS, SCSS, Git, Front-end...

Experience

HTML - 7 years JavaScript - 6 years CSS - 6 years React - 5 years SCSS - 4 years Jest - 3 years TypeScript - 2 years Next.js - 2 years

Availability

Full-time

Preferred Environment

MacOS, HTML, Front-end, IndexedDB, Web Worker, Responsive Design, Web Accessibility, A11Y, Front-end Development, React Native

The most amazing...

...app I've developed using JavaScript and WebGL is a configurable 3D garage that creates, visualizes, and shares a 3D model with dimensions, color, pattern, etc.

Work Experience

Senior Front-end Engineer

2022 - PRESENT

ServiceNow

Intergrated AI/ML models into dropdown and HTML editor controls, suggesting relevant field options and content recommendations based on user context and past interactions.
Led the initiative to address manual audit results and ensure all control components comply with WCAG 2.1 AA accessibility guidelines by enforcing best practices like keyboard navigation, screen reader compatibility, and color contrast adjustments.
Developed and implemented custom plugins for advanced features like image compression, customizable style formats, and integrated custom font options for the TinyMCE library used in the HTML editor component across ServiceNow.

Technologies: JavaScript, React, CSS, SCSS, Design Systems, Web Components, Back-end Development, Full-stack, SaaS, ServiceNow, GitHub, TypeScript, Google Cloud, UI Development, Software Architecture, Solution Architecture, Architecture, Large Language Models (LLMs), User Interface (UI), Monorepos, GraphQL, Axios, Sass, Pixel Perfect, Test Case Development, Responsive Web Apps, Application State Management, Web Frameworks, JSX, Software Engineering, ServiceNow REST API, HTML DOM

Front-end React Engineer

2024 - 2024

Dekeo Inc

Enhanced an object dimension editing feature in a design editor, allowing users to modify the width and height of graphical elements and groups with real-time aspect ratio preservation and text integrity constraints.
Developed an alignment feature for seamless center alignment of individual elements with groups on the artboard, including intuitive snapping and ruler guidance for improved design efficiency.
Implemented horizontal and vertical object resizing functionality, enabling intuitive adjustments of object dimensions directly from the Elements panel or Layers panel.
Engineered a custom text input component for the text effects section, supporting numerical values with special characters and providing enhanced validation and flexibility for attribute specification.

Technologies: React, HTML, CSS, Front-end, TypeScript, Ruby on Rails (RoR), Ruby, JavaScript, Fabric.js, Test Case Development, Responsive Web Apps, Application State Management, Web Frameworks, JSX, Software Engineering, HTML5 Canvas, Web Design, HTML DOM

Senior Full-stack React Engineer

2021 - 2022

BrowserStack

Spearheaded the migration of the core app's live components from jQuery/ Ruby on Rails to React, Redux-toolkit, and TypeScript, improving code maintainability, scalability, and type safety.
Improved limited debugging capabilities within the existing Cypress test framework by Introducing states like "pending," "paused," "waiting," and "errored" to help users pinpoint issues more effectively using Node.js and React.
Transformed BrowserStack's documentation build process with Gulp, slashing build times by 50%. Leveraged automation, caching, and parallel execution to streamline workflows, boosting dev productivity.
Built a Node.js API from scratch to handle scheduling, execution, and reporting of automated test runs in Automate, enabling integration with CI/CD pipelines and third-party tools.
Designed and implemented a user-friendly modal popup via Node.js back-end APIs to handle location updates without leaving the testing screen.
Eliminated context-switching pain points for the app's live feature using React and Redux for state management, boosting testing flexibility and adoption by 7%.

Technologies: HTML5, JavaScript, Jest, Enzyme, React, HTML, CSS, SCSS, Git, Front-end, Storybook, ECMAScript (ES6), Responsive UI, Responsive Design, Performance, Web Accessibility, A11Y, Front-end Development, Redux, JSON, Testing, JavaScript Testing, Material UI, Unit Testing, Redux Toolkit, Jira, Scrum, Test-driven Development (TDD), REST APIs, Responsive Web Design (RWD), UI Design, Ruby, Ruby on Rails (RoR), API Integration, Interactive UI, Web Development, Web Components, User Experience (UX), UX Design, Figma, Tailwind CSS, React Redux, Single-page Applications (SPA), APIs, Accessibility, SaaS, Chrome Extensions, Design Systems, Design, GitHub, UI Development, Full-stack, Technical Leadership, Software Architecture, Solution Architecture, Cypress, WebSockets, Architecture, User Interface (UI), Google Chrome, Monorepos, Axios, SVG, PDF, Sass, A/B Testing, Startups, Sentry, Pixel Perfect, Test Case Development, UI Automation, Web App Automation, Responsive Web Apps, Application State Management, Web Frameworks, JSX, Software Engineering, MongoDB, HTML DOM, Manifest V3

Full-stack Developer

2020 - 2021

Globant

Developed a highly reusable UI component library based on the atomic component architecture using React, TypeScript, and Storybook to be used across projects.
Enhanced data visibility and control for school administrators with interactive dashboards and granular reporting tools built using Node.js. Developed interactive dashboards and reports using Next.js data fetching and Recharts.
Spearheaded the redesign and migration of the user management portal from legacy frameworks to NextJS and React, achieving user satisfaction and a 30% reduction in support tickets.
Introduced multi-factor authentication and role-based access control features to strengthen user security and data privacy, exceeding industry compliance standards.

Technologies: CSS, HTML5, JavaScript, Jest, TypeScript, Next.js, React, HTML, SCSS, Git, Front-end, Storybook, React Testing Library, ECMAScript (ES6), Responsive UI, Responsive Design, Performance, Web Accessibility, A11Y, Front-end Development, Redux, JSON, Testing, JavaScript Testing, Material UI, Unit Testing, Redux Toolkit, Jira, Scrum, Styled-components, Test-driven Development (TDD), Amazon Web Services (AWS), REST APIs, Responsive Web Design (RWD), UI Design, AWS Amplify, API Integration, Interactive UI, Web Development, Web Components, Material Design, User Experience (UX), Figma, React Redux, Single-page Applications (SPA), APIs, Accessibility, Full-stack Development, Back-end Development, Full-stack, Design Systems, Google Cloud Platform (GCP), GitHub, UI Development, Technical Leadership, Software Architecture, Solution Architecture, Architecture, User Interface (UI), GraphQL, Axios, SVG, A/B Testing, Startups, Pixel Perfect, Test Case Development, Responsive Web Apps, Application State Management, Web Frameworks, JSX, Vercel, Software Engineering, MongoDB, Dashboards, Data Visualization, Web Design

Front-end Developer

2018 - 2020

HCL Technologies

Implemented a local database using IndexedDB to cache frequently accessed data by using multi multi-threading capability of web worker, enabling offline functionality and accelerating subsequent page loads by an additional 40%.
Developed a real-time 3D data visualization dashboard using Vue.js and WebGL to visually represent energy consumption, HVAC efficiency, and occupant comfort metrics.
Integrated an AI model using the Google Cloud AI Platform to identify unusual energy spikes, equipment malfunctions, and potential comfort issues within the Vue.js dashboard.
Utilized TypeScript's generics for reusable components and data structures and explored async/await patterns for streamlined asynchronous operations within Web Workers.

Technologies: Three.js, CSS, HTML5, JavaScript, HTML, SCSS, Git, Front-end, ECMAScript (ES6), Responsive UI, IndexedDB, Web Worker, Responsive Design, Performance, Front-end Development, JSON, Firebase, Jira, Scrum, REST APIs, Responsive Web Design (RWD), UI Design, API Integration, Interactive UI, Web Development, Material Design, User Experience (UX), Progressive Web Applications (PWA), UX Design, Single-page Applications (SPA), APIs, 3D, WebGL, Webflow, Design, GitHub, Vue, TypeScript, UI Development, User Interface (UI), SVG, Sass, Pixel Perfect, Responsive Web Apps, Application State Management, Web Frameworks, Software Engineering, Bootstrap, HTML5 Canvas, Dashboards, Web Design

React Native Developer

2015 - 2018

5 Exception Software Solutions

Implemented custom hooks and state management techniques to optimize performance and maintainability for the 3D scene and customization controls.
Leveraged React Native Navigation with custom animations to create a smooth, intuitive navigation flow between product selection, customization, and design sharing.
Utilized SCSS to handle responsive layouts and conditional rendering based on device orientation and screen size.
Built a performant 3D model viewer using Three.js with scene optimization techniques and custom shaders for efficient rendering on mobile devices.
Developed a modular SCSS architecture with mixins and variables to manage global styles, theme options, and dynamic color adjustments for building materials.

Technologies: CSS, ECMAScript (ES6), HTML5, JavaScript, HTML, Git, Front-end, Three.js, Responsive UI, Responsive Design, Performance, Front-end Development, JSON, Jira, Scrum, Android, iOS, REST APIs, Responsive Web Design (RWD), UI Design, API Integration, Interactive UI, Web Development, User Experience (UX), UX Design, Single-page Applications (SPA), APIs, 3D, WebGL, Design, GitHub, React Native, SCSS, Xcode, Android Studio, React Redux, Redux, UI Development, Cross-platform, Mobile Development, User Interface (UI), App Development, SVG, Startups, Pixel Perfect, Responsive Web Apps, Application State Management, Web Frameworks, JSX, Software Engineering, Mobile Apps, Bootstrap, HTML5 Canvas, Web Design, HTML DOM

Experience

Read It | A Reddit App Redesigned Version

https://readit.hakimudd.in/

Read It consists of an experimental redesigned version of the Reddit app.
In this project I:
• Revamped the infinite nested comments section for better visibility;
• Implemented custom infinite scrolling for feeds;
• Provided the ability to display different media formats like video, audio, and images from multiple API calls, including JSON and XML.

Tech Stack: TypeScript, React, and Styled-components.

Gradient Creator

https://hakimuddinhh.github.io/gradient-creator/

Gradient Creator is a tiny JavaScript plugin that enables users to create a specified amount of gradient colors between two colors. I implemented a Difference Algorithm to get the gradient colors from the two RGB color values provided.

Package: https://www.npmjs.com/package/gradient-creator/

Currency Converter

https://chrome.google.com/webstore/detail/currency-converter/mgajjigejpadffkeaadenehfkojcipoj?hl=en-GB

A Chrome extension lets you convert the currency of the selected text without selecting a currency every time or leaving the current page.

Created a settings page where users can change any country's [from] and [to] currencies.

Certifications

FEBRUARY 2016 - PRESENT

Graphics, Web Design & Development

Arena Animation

Skills

Languages

HTML5, JavaScript, CSS, SCSS, TypeScript, HTML, Sass, ECMAScript (ES6), GraphQL, Ruby

Frameworks

Next.js, Jest, Redux, React Native, Material UI, Cypress, Web Frameworks, Express.js, Tailwind CSS, Bootstrap, Ruby on Rails (RoR)

Libraries/APIs

React, React Testing Library, Node.js, REST APIs, React Redux, WebGL, HTML5 Canvas, ServiceNow REST API, Web Worker, AWS Amplify, Three.js, jQuery, Chrome API, Vue, Fabric.js

Tools

JSX, Git, JavaScript Testing, Redux Toolkit, Jira, Figma, NPM, GitHub, Xcode, Android Studio, Sentry

Paradigms

Unit Testing, Responsive Web Design (RWD), UI Design, UX Design, App Development, HTML DOM, Testing, Scrum, Test-driven Development (TDD), Cross-platform, Mobile Development

Platforms

Amazon Web Services (AWS), Google Chrome, Firebase, Android, iOS, Google Cloud Platform (GCP), Vercel, MacOS, Webflow

Storage

MongoDB, IndexedDB, JSON, Google Cloud, Firebase Realtime Database

Industry Expertise

Web Design

Other

Enzyme, Storybook, Front-end, Front-end Development, Responsive UI, Responsive Design, Chrome Extensions, Styled-components, Interactive UI, Web Development, Web Components, User Experience (UX), Single-page Applications (SPA), ServiceNow, Design Systems, Full-stack, Design, UI Development, Software Architecture, Solution Architecture, Architecture, User Interface (UI), Axios, SVG, A/B Testing, Startups, Pixel Perfect, Test Case Development, Responsive Web Apps, Application State Management, Software Engineering, Dashboards, Performance, Web Accessibility, A11Y, API Integration, Material Design, APIs, Full-stack Development, Back-end Development, 3D, SaaS, Technical Leadership, WebSockets, Large Language Models (LLMs), Monorepos, PDF, UI Automation, Web App Automation, Mobile Apps, Data Visualization, Manifest V3, Progressive Web Applications (PWA), Accessibility

Collaboration That Works

How to Work with Toptal

Toptal matches you directly with global industry experts from our network in hours—not weeks or months.

Share your needs

Discuss your requirements and refine your scope in a call with a Toptal domain expert.

Choose your talent

Get a short list of expertly matched talent within 24 hours to review, interview, and choose from.

Start your risk-free talent trial

Work with your chosen talent on a trial basis for up to two weeks. Pay only if you decide to hire them.

Top talent is in high demand.

Start hiring