Bilal is available for hire
Hire BilalBilal Tariq
Verified Expert in Engineering
Full-stack Developer
Singapore, Singapore
Toptal member since November 28, 2022
Bio
Bilal is a full-stack engineer specializing in JavaScript and Ruby and builds software for startups and multinational corporations. He has delivered robust service provider platforms, data dashboards, 3D maps, and multiple internal and administration tools. He created a famous Malaysian marketplace for errands and deliveries and launched an in-app wallet with a transaction backtracking and appeal system, reducing manual payment work by 80%. Bilal enjoys fast-paced, creative work environments.
Portfolio
Loopr Digital LTD
Android, iOS, JavaScript, Mobile Apps, Minimum Viable Product (MVP), Flutter...
Finch Tech, Inc.
TypeScript, JavaScript, Next.js, Tailwind CSS, React Flow, User Experience (UX)...
Yardi
Integration, JavaScript, Infrastructure, Redis, Optimization, Zustand, WebRTC
Experience
- TypeScript - 7 years
- HTML - 7 years
- Node.js - 7 years
- JavaScript - 7 years
- React - 7 years
- Ruby on Rails 4 - 6 years
- Tailwind CSS - 5 years
- Team Leadership - 4 years
Availability
Full-time
Preferred Environment
JavaScript, React, Node.js, Tailwind CSS, Next.js, OpenAI, API Development, Mobile App Design, Web App Design, Google Play Store, Gemini API, DigitalOcean
The most amazing...
...thing I've done is implement a micro-frontend architecture to break down a monolithic app and improve performance, development time, codebase, and reusability.
Work Experience
Mobile Developer
2024 - 2024
Loopr Digital LTD
- Developed a community-based dating app MVP designed to help users connect meaningfully within a social, community-oriented platform.
- Built as a cross-platform application using React Native, it ensures a highly responsive and native-like performance on both iOS and Android devices.
- Worked closely with detailed Figma wireframes and technical specifications provided by the client to ensure accurate translation of designs into functional app features.
- Used Node.js for back-end development, enabling data handling for user account creation, profile management, and matching functionalities.
- Integrated Firebase for real-time updates and authentication, ensuring secure and smooth user experiences.
- Incorporated TypeScript into the app to enforce type safety and improve maintainability, while Redux was used to handle global state management efficiently.
- Developed and integrated RESTful APIs to ensure seamless communication between the front-end and back-end systems.
- Adopted Agile methodologies to meet deadlines, conducting regular check-ins with the client to align progress with the project's goals and creative vision.
Technologies: Android, iOS, JavaScript, Mobile Apps, Minimum Viable Product (MVP), Flutter, React Native, Full-stack, Firebase, CSS, Responsive UI, Mobile, Dating Apps, Generative Pre-trained Transformers (GPT), Native Mobile Apps, MVC architecture, App Store, Android Profiler
Front-end Developer
2024 - 2024
Finch Tech, Inc.
- Collaborated with an AI startup that built advanced APIs to route complex tasks among multiple models. My role was to develop a NodeFlow editor to visualize the execution chain, ensuring a seamless and intuitive user interface.
- Implemented XState-driven state management to control workflow execution and ensure smooth user interactions. Utilized Next.js, TypeScript, and Tailwind CSS to design and implement a dynamic, responsive front end for the Nodeflow editor.
- Developed comprehensive unit tests for front-end components, ensuring the reliability of the user interface.
- Played a key role in building and optimizing the NodeFlow editor, enabling users to efficiently visualize and manage the execution flow of complex AI tasks.
- Worked closely with the client's back-end team to ensure smooth front-end integration with the back-end services, aligning with the overall project objectives.
Technologies: TypeScript, JavaScript, Next.js, Tailwind CSS, React Flow, User Experience (UX), GraphQL, MERN Stack, Three.js, Headless CMS, Remix, Tailwind UI, Linux, Payload CMS, CSS-in-JS, Single-page Applications (SPAs), E2E Testing, Fintech, XState, Performance, Optimization, Application State Management, Database Optimization, Cloud, Profiling, UI Testing, Jest, Google Cloud, Apollo Client, Apollo Server, Context API, Graph API, Figma to React, Styled-components, Application Performance Monitoring
Software Engineer
2023 - 2024
Yardi
- Worked on a property managing CRM system, as a software engineer.
- Collaborated on this system, which integrates with coworking spaces.
- Worked on this system that can manage spaces, from clients booking spaces to managing the building, such as inventory and contracts.
Technologies: Integration, JavaScript, Infrastructure, Redis, Optimization, Zustand, WebRTC
Developer
2023 - 2023
Pulse Media Inc
- Built an app that transforms financial statements into meaningful Sankey diagrams. The app utilizes D3 to create various interactive charts, including Sankey, bar, and line graphs, which provide detailed and granular statistics.
- Led the front end, designed and improved the UI/UX, and built a responsive web application using Tailwind CSS.
- Connected the front end with the back-end APIs using React Query for better performance, verified and tested the app with the stakeholders, and handled bug fixing and performance improvements.
- Used pixel shaders to enhance the rendering of complex visualizations such as Sankey diagrams and other interactive charts.
Technologies: React, User Interface (UI), Data Visualization, Sankey, D3.js, Node.js, MongoDB, Full-stack, Amazon Web Services (AWS), Tailwind CSS, Software Architecture, Software Design, Mobile Apps, App Development, React Query, Android App Development, Mobile App Development, Responsive, Animation, Team Management, Web App Design, GraphQL, MERN Stack, MongoDB Atlas, Data Analytics, REST APIs, AWS Lambda, Amazon Simple Queue Service (SQS), Charting, Shaders, Front-end Architecture, Headless CMS, Yoga, Docker Compose, Performance, Optimization, Application State Management, JavaScript Testing, UI Testing, Redux, Docker, Apollo Client, Apollo Server, Graph API, CSS3, Architecture, Algorithms, React Components, Application Performance Monitoring
Senior Front-end Engineer
2021 - 2023
WeWork
- Planned and implemented micro-frontend architecture.
- Used fragment shaders and geometry shaders to optimize the rendering of 3D floor maps, significantly improving the load speed by 50% using Three.js.
- Built features, maintaining and improving the occupancy map tool. Built and deployed 3D floor-map render using Mapbox. Built features, maintaining and improving the occupancy map tool.
- Led a front-end team. Planned, architected, and implemented features.
- Built responsive designs using Tailwind CSS and Headless UI for React, Next.js, and RoR applications.
Technologies: JavaScript, React, Node.js, TypeScript, GraphQL, Communication, Next.js, Tailwind CSS, Semantic UI, Git, Continuous Integration (CI), Ruby on Rails (RoR), APIs, GitHub, Amazon Web Services (AWS), Full-stack, Minimum Viable Product (MVP), SQL, Redux, REST, REST APIs, Full-stack Development, Back-end, Back-end Development, Firebase, eCommerce, User Interface (UI), User Experience (UX), Leadership, React Native, Back-end Architecture, Front-end Development, Web Development, API Integration, Google Cloud Platform (GCP), Android, API Development, UX Design, Technical Leadership, Digital Commerce, Large-scale Projects, Three.js, Mapbox, Responsive, Database Design, Databases, UI Design, Mobile Applications, WebGL, Team Management, Web App Design, Social Communication, Redux Toolkit, Material UI, MERN Stack, Rendering, Microservices, Shaders, Headless CMS, Payload CMS, CSS-in-JS, Single-page Applications (SPAs), E2E Testing, XState, Memory Optimization, Performance Optimization, Performance, Optimization, Application State Management, JavaScript Testing, Profiling, UI Testing, Jest, Apollo Server, Playwright, Webhooks, CSS3, Mapbox API, Architecture, Algorithms, React Components, Application Performance Monitoring
Senior Software Engineer
2019 - 2021
EYOS
- Created a customizable data analysis dashboard tool that presents data insights as a story.
- Automated 80% of the manual work, precluding the need for matching work on Microsoft Excel.
- Built an evaluation tool embedded with filters to generate granular statistics to analyze promotions happening in retail shops.
- Improved and fixed the old reporting system by bringing in greater automation and optimizing SQL and PostgreSQL queries, improving overall performance by 40%.
Technologies: JavaScript, Ruby, Node.js, React, Planning, GraphQL, TypeScript, MySQL, Semantic UI, Git, Continuous Integration (CI), Ruby on Rails (RoR), APIs, GitHub, Amazon Web Services (AWS), Full-stack, SQL, Redux, REST, REST APIs, Full-stack Development, Back-end, Back-end Development, AWS Lambda, Firebase, Front-end, eCommerce, User Interface (UI), User Experience (UX), Leadership, Architecture, Back-end Architecture, Next.js, Figma, Front-end Development, Web Development, Expo, iOS, Android, Instant Messaging, Technical Leadership, Digital Commerce, Database Design, Databases, UI Design, Software Development Toolkits (SDK), MERN Stack, Data Analytics, Front-end Architecture, Performance, Optimization, Database Optimization, Profiling, Chai, Graph API, Styled-components, Algorithms, React Components, Application Performance Monitoring
Full-stack Software Engineer
2015 - 2018
GoGet
- Launched an in-app wallet for freelancers with transactions backtracking and appeal system, reduced manual work by 60%, and eased freelancers' manual payment work by 80%.
- Optimized memory and time-consuming SQL and PostgreSQL queries and other logic-heavy processes and reduced AWS server cost by 30%.
- Planned, designed, and launched a 3-tier incentive system for freelancers with reporting and statistics.
- Created public and private REST APIs for internal app usage and other business integration.
- Built features to improve the community, such as a social platform where the community can connect.
Technologies: Programming, JavaScript, HTML, CSS, Ruby, PostgreSQL, Social Communication, Git, WebSockets, Continuous Integration (CI), Ruby on Rails (RoR), APIs, GitHub, Amazon Web Services (AWS), Full-stack, SQL, REST APIs, Full-stack Development, Back-end, Back-end Development, AWS Lambda, Firebase, Front-end, eCommerce, User Interface (UI), User Experience (UX), Leadership, Architecture, React Native, Back-end Architecture, Vue, RESTful Web Services, Java, Next.js, Figma, Front-end Development, Web Development, Authentication, API Integration, Customer Relationship Management (CRM), D3.js, Data Visualization, MongoDB, Charts, Vercel, Google Cloud Platform (GCP), Dashboards, Heroku, API Development, Digital Commerce, Software Development Toolkits (SDK), Docker, Server-side Rendering (SSR), Memory Optimization, Performance Optimization, HIPAA Compliance, Performance, Optimization, Database Optimization, Profiling, Webhooks, In-app Purchase (IAP), Figma to React, CSS3, Algorithms, Application Performance Monitoring
Experience
Micro-frontend Architecture
Microservices like architecture but for the front end, where micro-frontend architecture might involve breaking down the user interface (UI) into smaller, self-contained React components or modules that can be developed, deployed, and maintained independently, then, each component could represent a specific UI element, feature, or functionality.
I implemented this architecture for one of the companies where one of their main application was getting overloaded with features, and the codebase was getting huge. The app was facing latency issues, and as multiple teams were contributing to the same monolith, the front-end app deploying, testing, and developing was becoming an issue.
With the help of micro front-end architecture, we managed to break down the app into smaller applications that connect to the main shell (where all micro front-end will be rendered), giving individual teams to manage their own applications, repositories, and CI/CD process.
I implemented this architecture for one of the companies where one of their main application was getting overloaded with features, and the codebase was getting huge. The app was facing latency issues, and as multiple teams were contributing to the same monolith, the front-end app deploying, testing, and developing was becoming an issue.
With the help of micro front-end architecture, we managed to break down the app into smaller applications that connect to the main shell (where all micro front-end will be rendered), giving individual teams to manage their own applications, repositories, and CI/CD process.
Dynamic Data Visualization Dashboard System
The dynamic visualization dashboard system I built enables companies to purchase grocery shopper data and visualize it using various charts and filters. It offers granular data exploration, allowing companies to view specific brands like Coca-Cola, including different SKUs. The system efficiently handles large data volumes, provides real-time updates, and has a user-friendly interface with intuitive controls. It empowers businesses to gain insights into consumer behavior and make informed decisions.
As the lead developer, I worked with a team of three engineers, contributing to front-end and back-end development. We wrote specs, developed, tested, planned CI/CD, and deployed the dynamic visualization dashboard system. Our collaboration resulted in a robust product for companies to analyze grocery shopper data.
As the lead developer, I worked with a team of three engineers, contributing to front-end and back-end development. We wrote specs, developed, tested, planned CI/CD, and deployed the dynamic visualization dashboard system. Our collaboration resulted in a robust product for companies to analyze grocery shopper data.
Community Platform for Reliable and Skilled Manpower
A marketplace for errands and deliveries and a community platform for reliable, skilled workers. I managed full-stack operations such as maintaining and building new APIs on the back end, which was built using Ruby and handled the front end for the marketplace side of the application.
My key responsibility was debugging, fixing bugs, enhancing and building new features, and planning and brainstorming with the other teammates.
Brought the 'Gogetter training' system online and reduced errors and manual work by 80%. Optimized memory and time-consuming SQL and PostgreSQL queries and other logic-heavy processes that brought down the AWS server's cost by 30%. Planned and built a B2B model with a payment gateway, which helped break even. Planned and started a PWA app for merchants. Created public and private REST APIs for internal app usage and other business integration. Wrote job matching algorithms and improved job matching. Build features to improve the GoGetter community, e.g., favorite social and auto job allocation.
My key responsibility was debugging, fixing bugs, enhancing and building new features, and planning and brainstorming with the other teammates.
Brought the 'Gogetter training' system online and reduced errors and manual work by 80%. Optimized memory and time-consuming SQL and PostgreSQL queries and other logic-heavy processes that brought down the AWS server's cost by 30%. Planned and built a B2B model with a payment gateway, which helped break even. Planned and started a PWA app for merchants. Created public and private REST APIs for internal app usage and other business integration. Wrote job matching algorithms and improved job matching. Build features to improve the GoGetter community, e.g., favorite social and auto job allocation.
On-demand Work App Website
https://goget.my/A user-facing website for a marketplace for errands and deliveries and to enhance the website's performance, I utilized Next.js, a popular React framework known for its improved load times and SEO capabilities.
My primary responsibility was to coordinate with the UI/UX designer to bring their vision to life and build webpages that were not only responsive but also aligned with the design aesthetics. This involved understanding the design requirements, gathering assets, and collaborating closely with the designer to ensure seamless integration of design elements into the website.
Focused on creating reusable components, proper HTML tags were used for accessibility purposes, implementing SEO-friendly practices, using SSR (a feature by Next.js) to improve page load speed, and ensuring it follows the design pattern with all the colors, components, and animations.
My primary responsibility was to coordinate with the UI/UX designer to bring their vision to life and build webpages that were not only responsive but also aligned with the design aesthetics. This involved understanding the design requirements, gathering assets, and collaborating closely with the designer to ensure seamless integration of design elements into the website.
Focused on creating reusable components, proper HTML tags were used for accessibility purposes, implementing SEO-friendly practices, using SSR (a feature by Next.js) to improve page load speed, and ensuring it follows the design pattern with all the colors, components, and animations.
BarterUnit | Barter Exchange Community
https://apps.apple.com/pk/app/barterunit/id1457207657The BarterUnit app is an innovative digital barter platform that enables users to exchange goods and services without needing traditional currency. As part of the lead developer, I played a role in bringing this project to life by developing key features that support real-time transactions and a user-friendly interface.
ACCOMPLISHMENTS
• Developed a real-time bartering system utilizing socket-based communication, allowing users to engage in instant and secure transactions.
• Created custom UI components to ensure a seamless and consistent user experience across both Android and iOS platforms, enhancing usability and engagement.
• Integrated native device features such as the camera for item listings and geolocation for finding nearby barter opportunities, providing users with enhanced functionality.
• Implemented push notifications to deliver real-time updates on barter offers and transaction statuses, keeping users informed and engaged.
• Used GCP to enhance the app's performance and scalability, enabling it to efficiently handle a large user base.
• Managed the app's publishing to the Apple and Google Play stores and implemented payment gateway solutions.
ACCOMPLISHMENTS
• Developed a real-time bartering system utilizing socket-based communication, allowing users to engage in instant and secure transactions.
• Created custom UI components to ensure a seamless and consistent user experience across both Android and iOS platforms, enhancing usability and engagement.
• Integrated native device features such as the camera for item listings and geolocation for finding nearby barter opportunities, providing users with enhanced functionality.
• Implemented push notifications to deliver real-time updates on barter offers and transaction statuses, keeping users informed and engaged.
• Used GCP to enhance the app's performance and scalability, enabling it to efficiently handle a large user base.
• Managed the app's publishing to the Apple and Google Play stores and implemented payment gateway solutions.
Food Truck Tracking System With an Integrated CMS
A user-friendly platform that simplifies the discovery of nearby food trucks. Users can effortlessly create accounts, explore food trucks within a specified radius using an interactive Google Map, and customize their culinary adventure with intuitive filters. The back-end system, accessible to administrators, streamlines the management of truck details. I played a vital role in both back-end and front-end development. Focusing on front-end design, I utilized pure CSS and incorporated npm packages to enhance the website's visual appeal. On the back end, I implemented a location detection system using Google Maps, offering real-time tracking of food truck positions.
Additionally, I integrated a heatmap feature using Google APIs, providing users with an insightful visual representation of food truck density. As the project expanded, I led the development of APIs for a mobile app in collaboration with the mobile developer. The entire project was crafted using Laravel for the back end and MySQL for the database.
Additionally, I integrated a heatmap feature using Google APIs, providing users with an insightful visual representation of food truck density. As the project expanded, I led the development of APIs for a mobile app in collaboration with the mobile developer. The entire project was crafted using Laravel for the back end and MySQL for the database.
HealthBot AI Prototype
The HealthBot AI Prototype is a proof-of-concept project leveraging OpenAI API connectivity. Designed to address end-users health-related queries, this innovative AI bot is a testament to the potential of artificial intelligence in solving real-world problems. The project, a collaborative effort with another engineer, focuses on seamless integration with OpenAI using the PHP SDK. Additionally, a logic handler was created to enable the use of the same bot with multiple ChatGPT versions, enhancing flexibility and adaptability.
In this venture, my primary contributions centered around extensive research on OpenAI, utilizing the PHP SDK for effective API integration and integration of OpenAI's GPT-3.5 and GPT-4 models. Moreover, I played a key role in developing a logic handler, ensuring the adaptability of the AI bot to different ChatGPT versions. This project underscores the potential of AI in transforming the health sector and providing personalized assistance to end-users.
In this venture, my primary contributions centered around extensive research on OpenAI, utilizing the PHP SDK for effective API integration and integration of OpenAI's GPT-3.5 and GPT-4 models. Moreover, I played a key role in developing a logic handler, ensuring the adaptability of the AI bot to different ChatGPT versions. This project underscores the potential of AI in transforming the health sector and providing personalized assistance to end-users.
Repair Tracker System
A streamlined system designed to help engineers efficiently manage product repair details.
ACHIEVEMENTS
• Replaced traditional cron jobs with Temporal Workflows written in TypeScript, providing fault-tolerant and scalable task orchestration.
• Ensured interrupted workflows, such as failed file processing or server downtimes, resumed seamlessly from the last known state, preventing data loss.
• Designed workflows capable of handling large volumes of XML files concurrently, reducing processing times and improving system efficiency.
• Developed Temporal activities in TypeScript to log into the SFTP account (using phpseclib), fetch uploaded files, verify file extensions, parse XML content, and accurately insert structured data into a MySQL table.
• Integrated Temporal’s TypeScript SDK for advanced error handling, retry logic, and workflow monitoring, enhancing system reliability and visibility.
• Implemented workflows to rename processed files for differentiation and securely archive them for audit purposes.
ACHIEVEMENTS
• Replaced traditional cron jobs with Temporal Workflows written in TypeScript, providing fault-tolerant and scalable task orchestration.
• Ensured interrupted workflows, such as failed file processing or server downtimes, resumed seamlessly from the last known state, preventing data loss.
• Designed workflows capable of handling large volumes of XML files concurrently, reducing processing times and improving system efficiency.
• Developed Temporal activities in TypeScript to log into the SFTP account (using phpseclib), fetch uploaded files, verify file extensions, parse XML content, and accurately insert structured data into a MySQL table.
• Integrated Temporal’s TypeScript SDK for advanced error handling, retry logic, and workflow monitoring, enhancing system reliability and visibility.
• Implemented workflows to rename processed files for differentiation and securely archive them for audit purposes.
Social Commerce
An innovative social commerce platform designed for seamless product management, inventory control, and live selling on Facebook pages. Users can effortlessly showcase products in real time, enhancing their social commerce experience.
In this dynamic project, my role was instrumental in the technical implementation of key features. I spearheaded the setup of the Facebook developer app, configuring it with the necessary permissions. Collaborating closely with the team, I facilitated user account integration with Facebook through Graph APIs, enabling them to connect their Facebook pages to our system. A notable contribution involved creating a user-friendly feature allowing sellers to go live on their chosen Facebook pages with a simple button click. Additionally, I played a key part in integrating a module for handling live feed orders, ensuring smooth processing, and sending receipts seamlessly through Facebook Messenger. Initially, the main logic for the above project was created and controlled using Go, in which I was mainly involved, but then, eventually, every logic was moved to PHP Laravel.
In this dynamic project, my role was instrumental in the technical implementation of key features. I spearheaded the setup of the Facebook developer app, configuring it with the necessary permissions. Collaborating closely with the team, I facilitated user account integration with Facebook through Graph APIs, enabling them to connect their Facebook pages to our system. A notable contribution involved creating a user-friendly feature allowing sellers to go live on their chosen Facebook pages with a simple button click. Additionally, I played a key part in integrating a module for handling live feed orders, ensuring smooth processing, and sending receipts seamlessly through Facebook Messenger. Initially, the main logic for the above project was created and controlled using Go, in which I was mainly involved, but then, eventually, every logic was moved to PHP Laravel.
Messenger
An integrated messaging platform that unifies various chat applications into a centralized hub, offering robust user, leave, and department management functionalities.
I contributed to both the front and back end, utilizing Laravel for the back end and Vue.js for the front end to develop an intuitive chat interface that allows users to seamlessly engage with consumers. The chat UI includes a drag-and-drop feature for predefined text samples, streamlining communication by reducing repetitive typing. On the back end, I integrated WhatsApp and Telegram APIs to enable message sending and parsing directly within the system. The platform was built using MySQL as the primary database for managing large-scale data efficiently, ensuring smooth operations and real-time interactions.
I contributed to both the front and back end, utilizing Laravel for the back end and Vue.js for the front end to develop an intuitive chat interface that allows users to seamlessly engage with consumers. The chat UI includes a drag-and-drop feature for predefined text samples, streamlining communication by reducing repetitive typing. On the back end, I integrated WhatsApp and Telegram APIs to enable message sending and parsing directly within the system. The platform was built using MySQL as the primary database for managing large-scale data efficiently, ensuring smooth operations and real-time interactions.
Golf Space | Booking Manager
https://www.golfspace.fi/I developed a comprehensive web application that revolutionizes the booking process for golf simulators. The app integrates seamlessly with Google Calendar APIs to resolve booking conflicts and streamline reservations.
A flexible pricing system was implemented, allowing different hourly rates for each day of the week and giving the business more control over its pricing strategy. I added a feature for customers to save their information, enabling quick and easy repeat bookings.
I overhauled the back-end infrastructure to support the new pricing model and user profile system, ensuring smooth data flow and processing. Next.js, Tailwind CSS, and custom CSS were used to create an intuitive and responsive user interface.
This project showcases my ability to develop complex, data-intensive applications focusing on user experience and business utility.
A flexible pricing system was implemented, allowing different hourly rates for each day of the week and giving the business more control over its pricing strategy. I added a feature for customers to save their information, enabling quick and easy repeat bookings.
I overhauled the back-end infrastructure to support the new pricing model and user profile system, ensuring smooth data flow and processing. Next.js, Tailwind CSS, and custom CSS were used to create an intuitive and responsive user interface.
This project showcases my ability to develop complex, data-intensive applications focusing on user experience and business utility.
Work Order Management and Seamless Communication
Designed for internal use by an organization's engineers, this system revolves around efficient work order management. Inbound work orders from other systems trigger notifications within the system, allowing engineers to change work order statuses and travel to designated locations for issue resolution.
I played a pivotal role in enhancing communication and information access within the system. Firstly, I developed an internal chat system from the UI to the back end, providing engineers with a seamless communication platform. This chat system featured multiple tabs, enabling engineers to discuss work orders and access related information within the same interface. Moreover, I spearheaded the integration of the WhatsApp Business API into the main system. This integration allowed the automated sending of predefined and approved WhatsApp templates to consumers, ensuring timely notifications about engineer arrivals and updates on their cases.
I played a pivotal role in enhancing communication and information access within the system. Firstly, I developed an internal chat system from the UI to the back end, providing engineers with a seamless communication platform. This chat system featured multiple tabs, enabling engineers to discuss work orders and access related information within the same interface. Moreover, I spearheaded the integration of the WhatsApp Business API into the main system. This integration allowed the automated sending of predefined and approved WhatsApp templates to consumers, ensuring timely notifications about engineer arrivals and updates on their cases.
Real-time Data Visualization Solutions
I contributed to an enterprise SaaS startup that specializes in real-time data visualization for Fortune 500 companies in the CPG industry.
My primary focus was developing production-ready web applications using React and D3.js, delivering high-performance data-driven features that significantly enhanced our platform's visualization capabilities.
ACCOMPLISHMENTS
• Developed and integrated advanced, interactive data visualizations within the platform, ensuring seamless performance and scalability.
• Collaborated with cross-functional teams to optimize D3.js for large-scale data visualization, addressing performance challenges related to rendering and interactivity.
• Utilized a strong understanding of RESTful API architecture to ensure efficient data flow between the back-end's machine learning models and the frontend visualizations.
• Worked closely with data scientists, designers, and back-end engineers to continuously improve the user experience, delivering robust, scalable solutions tailored to the needs of Fortune 500 clients.
My primary focus was developing production-ready web applications using React and D3.js, delivering high-performance data-driven features that significantly enhanced our platform's visualization capabilities.
ACCOMPLISHMENTS
• Developed and integrated advanced, interactive data visualizations within the platform, ensuring seamless performance and scalability.
• Collaborated with cross-functional teams to optimize D3.js for large-scale data visualization, addressing performance challenges related to rendering and interactivity.
• Utilized a strong understanding of RESTful API architecture to ensure efficient data flow between the back-end's machine learning models and the frontend visualizations.
• Worked closely with data scientists, designers, and back-end engineers to continuously improve the user experience, delivering robust, scalable solutions tailored to the needs of Fortune 500 clients.
Mysircles Mobile App
https://play.google.com/store/apps/details?id=com.mysircles&hl=en_IEMysircles is a dynamic social networking mobile application developed using React Native designed to connect individuals within their local communities. It provides a platform where users can join or create circles based on shared interests and activities, whether for sports, hobbies, or local events.
ACCOMPLISHMENTS
• Integrated event management tools enable users to organize and participate in local activities, making staying engaged with community events simple.
• The app features real-time messaging within circles, ensuring seamless communication among members.
• Mysircles involved integrating location-based services such as Google Maps API to suggest nearby circles and events, enhancing local engagement.
My responsibilities included designing the user interface, implementing core features like circle management and real-time messaging, and integrating location-based services. I also collaborated closely with the back-end team to ensure seamless data synchronization and optimal performance. I used Redux to maintain a consistent user experience across different screens and user actions. I used Jest for unit testing and ensuring the reliability of the app’s codebase.
ACCOMPLISHMENTS
• Integrated event management tools enable users to organize and participate in local activities, making staying engaged with community events simple.
• The app features real-time messaging within circles, ensuring seamless communication among members.
• Mysircles involved integrating location-based services such as Google Maps API to suggest nearby circles and events, enhancing local engagement.
My responsibilities included designing the user interface, implementing core features like circle management and real-time messaging, and integrating location-based services. I also collaborated closely with the back-end team to ensure seamless data synchronization and optimal performance. I used Redux to maintain a consistent user experience across different screens and user actions. I used Jest for unit testing and ensuring the reliability of the app’s codebase.
Ma Coiffeuse Afro Mobile and Web App
https://macoiffeuseafro.com/The Ma Coiffeuse Afro app is a platform that connects users with professional Afro hairstylists across Europe. Users can browse and book appointments with skilled stylists, view portfolios, and read reviews. As the lead developer, I created a user-friendly mobile experience. I utilized React Native as the primary framework for developing cross-platform apps.
ACCOMPLISHMENTS
• Used Google Maps API to enable users to find nearby stylists based on their location.
• Integrated Stripe API for secure and straightforward payment processing, ensuring a smooth transaction experience. The API was also used to handle payment disputes, refunds, and recurring payments, providing a reliable financial backbone to the app.
• Implemented Firebase Cloud Messaging to handle real-time notifications, informing users about appointment confirmations, reminders, and other essential updates.
• Used Firebase Authentication to securely manage user logins, providing a seamless and secure sign-in experience.
• Developed a system for managing user profiles, allowing users to upload photos, leave reviews, and track their booking history.
ACCOMPLISHMENTS
• Used Google Maps API to enable users to find nearby stylists based on their location.
• Integrated Stripe API for secure and straightforward payment processing, ensuring a smooth transaction experience. The API was also used to handle payment disputes, refunds, and recurring payments, providing a reliable financial backbone to the app.
• Implemented Firebase Cloud Messaging to handle real-time notifications, informing users about appointment confirmations, reminders, and other essential updates.
• Used Firebase Authentication to securely manage user logins, providing a seamless and secure sign-in experience.
• Developed a system for managing user profiles, allowing users to upload photos, leave reviews, and track their booking history.
Recall
https://www.getrecall.ai/A SaaS-based knowledge management and documentation platform designed to streamline how individuals and teams organize, search, and access information. Built with React, the platform delivers a highly interactive and modular UI that simplifies content navigation, enhances collaboration, and ensures real-time updates through React’s Context API. With a strong focus on performance optimization, Recall integrates efficient data caching and loading techniques, reducing response times and ensuring seamless access to large datasets. The platform is fully responsive, adapting effortlessly across desktops, tablets, and mobile devices, while its advanced search and retrieval system allows users to locate documents instantly.
To enhance scalability and maintainability, Recall employs SPA architecture, ensuring fast transitions between different sections without requiring full-page reloads. Recall’s authentication and security mechanisms, including JWT/OAuth integration, safeguard user data while providing controlled access to sensitive information. Additionally, the platform was developed with modular component structures, allowing for future feature expansion and scalability without compromising system performance.
To enhance scalability and maintainability, Recall employs SPA architecture, ensuring fast transitions between different sections without requiring full-page reloads. Recall’s authentication and security mechanisms, including JWT/OAuth integration, safeguard user data while providing controlled access to sensitive information. Additionally, the platform was developed with modular component structures, allowing for future feature expansion and scalability without compromising system performance.
Education
2012 - 2015
Bachelor's Degree in Computer Science
University of Greenwich - Kuala Lumpur, Malaysia
2010 - 2012
Diploma in Biology
National Grammar Boys High School - Lahore, Pakistan
Certifications
JUNE 2020 - PRESENT
Verified International Academic Qualifications
World Education Services
Skills
Libraries/APIs
React, Node.js, D3.js, Pure CSS, REST APIs, Chart.js, API Development, React Query, Three.js, Google Maps API, Context API, Graph API, OpenAI API, Mapbox API, Socket.IO, Twilio API, Vue, Web3.js, WhatsApp API, Google Calendar API, WebGL, Facebook API, Stripe, Google API, Apollo Client, Chai, Playwright, WebRTC, React Flow, Stripe API, Camera API, CSSinJS
Tools
Git, GitHub, Figma, Expo, Amazon Simple Queue Service (SQS), JavaScript Testing, SendGrid, Android Profiler, Redux Toolkit, MongoDB Atlas, Docker Compose, Shadcn, Webpack, Jira, ChatGPT, Firebase Authentication, Firebase Cloud Messaging (FCM), Google Sheets
Languages
JavaScript, CSS, HTML, Ruby, GraphQL, TypeScript, SCSS, SQL, PHP, CSS3, Java, Python, XML, Go, Regex, PHP 7, TypeScript 4
Frameworks
Ruby on Rails 4, Tailwind CSS, Material UI, Next.js, Ruby on Rails (RoR), Redux, React Native, Laravel, Jest, Payload CMS, RailsAdmin, Express.js, NestJS, Android SDK, Angular, Django, Yoga, Remix, Flutter, Eloquent, ORMLite, Realtime, JSON Web Tokens (JWT)
Paradigms
REST, Back-end Architecture, App Development, Mobile Development, Responsive, Database Design, UI Design, Microservices, E2E Testing, HIPAA Compliance, Continuous Integration (CI), Test Automation, UX Design, Testing, DevOps, Mobile App Design, Web App Design, Modular CSS
Platforms
Firebase, Docker, Vercel, Google Cloud Platform (GCP), iOS, Android, Heroku, Mapbox, Linux, Mobile, Amazon Web Services (AWS), Twilio, AWS Lambda, Blockchain, Azure, WordPress, Temporal Cloud, DigitalOcean
Storage
PostgreSQL, MySQL, MongoDB, Google Cloud, Redis, Databases, Database Caching
Industry Expertise
Trading Systems, Healthcare
Other
Programming, Social Communication, Data Visualization, Semantic UI, APIs, Full-stack, Minimum Viable Product (MVP), Full-stack Development, Back-end, Back-end Development, Front-end, eCommerce, User Interface (UI), User Experience (UX), Leadership, Architecture, Team Leadership, Front-end Development, Web Development, API Integration, Charts, Dashboards, Instant Messaging, UI Components, Design, Styled-components, Software Design, Technical Leadership, Mobile Apps, Digital Commerce, SDKs, Integration, Android App Development, Responsive Design, Mobile App Development, Large-scale Projects, Marketplaces, Mobile Applications, Animation, ChatGPT API, MERN Stack, Data Analytics, Server-side Rendering (SSR), Rendering, Front-end Architecture, Headless CMS, Chatbots, Responsive UI, Tailwind UI, Dating Apps, Generative Pre-trained Transformers (GPT), Pixel Perfect, Native Mobile Apps, FastAPI, CSS-in-JS, Single-page Applications (SPAs), XState, Memory Optimization, Performance Optimization, Fintech, Performance, Optimization, React Components, MVC architecture, Application State Management, Database Optimization, Cloud, Profiling, UI Testing, Webhooks, In-app Purchase (IAP), Figma to React, App Store, Algorithms, Application Performance Monitoring, Project Design & Management, Quality Assurance (QA), Chakra UI, WebSockets, RESTful Web Services, Authentication, Customer Relationship Management (CRM), Graphs, CI/CD Pipelines, Accessibility, Design Systems, Software Architecture, OpenAI GPT-4 API, OpenAI, SDK Development, Software Development Toolkits (SDK), Artificial Intelligence (AI), Infrastructure, Trading, Google Play Store, Charting, Gemini API, Apollo Server, Microsoft Graph API, Zustand, Biology, Planning, Communication, Sankey, Content Management Systems (CMS), SFTP, GRAPH, Education, Team Management, Messaging, Geolocation, Event Management, Leadership Development, Payment Gateways, Push Notifications, Ajax, Blade Templates, App UI, Shaders, Dynamic Loading, Web Pages, Code Splitting, Efficient Data Serialization
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.
1
Share your needs
Discuss your requirements and refine your scope in a call with a Toptal domain expert.
2
Choose your talent
Get a short list of expertly matched talent within 24 hours to review, interview, and choose from.
3
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