Bilal Tariq, Developer in Singapore, Singapore
Bilal is available for hire
Hire Bilal

Bilal Tariq

Verified Expert  in Engineering

Full-stack Developer

Location
Singapore, Singapore
Toptal Member Since
November 28, 2022

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

Pulse Media Inc
React, User Interface (UI), Data Visualization, Sankey, D3.js, Node.js, MongoDB...
WeWork
JavaScript, React, Node.js, TypeScript, GraphQL, Communication, Next.js...
EYOS
JavaScript, Ruby, Node.js, React, Planning, GraphQL, TypeScript, MySQL...

Experience

Availability

Full-time

Preferred Environment

Project Design & Management, Ruby on Rails 4, JavaScript, React, Node.js, CSS, Tailwind CSS, Next.js, Jira, Semantic UI, Docker, Software Architecture, Test Automation, Design, Laravel, PHP, Styled-components, Software Design, Mobile Apps, App Development, React Query

The most amazing...

...thing I've done is a micro-frontend architecture implementation to break down a monolith app & improve performance, development time, codebase, & reusability.

Work Experience

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.
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

Senior Front-end Engineer

2021 - 2023
WeWork
  • Planned and implemented micro-frontend architecture.
  • Improved Three.js floor-map load speed by up to 50% by improving rendering events and data structure.
  • 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

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

Full-stack Software Engineer

2016 - 2019
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

Micro-frontend Architecture

Microservices like architecture but for the front end. Micro-frontend architecture might involve breaking down the user interface (UI) into smaller, self-contained components or modules that can be developed, deployed, and maintained independently. 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.

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.

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.

On-demand Work App Website

https://goget.my/
A user-facing website for a marketplace for errands and deliveries. 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.

BarterUnit | Barter Exchange Community

https://apps.apple.com/pk/app/barterunit/id1457207657
As a mobile application developer at LogicFab, I was responsible for the coding, testing, debugging, documenting, and monitoring of mobile applications. I also managed the publishing of apps to the Apple and Google stores and implemented payment gateway solutions.

In this role, I collaborated closely with different departments within the organization to ensure successful new deployments and contributed to developing project schedules and workflows. Additionally, I provided recommendations for changes and enhancements to software applications to improve performance and user experience.

To ensure successful collaboration across the organization and with all the stakeholders involved, I managed multiple teams both onsite and remotely, along with collaborating with clients to align the expected deliverables, and was able to effectively communicate technical requirements and solutions.

Overall, my experience as a mobile application developer at LogicFab enabled me to develop a deep understanding of mobile application development, project management, and cross-functional collaboration.

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.

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.

Digital Connect Platform

A platform designed to streamline customer interactions across various social apps. Handling text, images, and videos seamlessly within a unified interface, it enhances workforce orchestration, interdepartmental collaboration, and empowers enterprises with insightful reports for comprehensive data mining. With robust user controls and advanced tools, enterprises can safeguard their brand reputation and deliver exceptional customer experiences.

I played a pivotal role in enhancing communication integrity and customer satisfaction in this project. My key responsibility involved creating a taboo filter, enabling managers to prevent the transmission of inappropriate messages. I implemented a customizable filter function, utilizing a custom regex to detect and restrict the use of filtered words. Additionally, I spearheaded the development of an escalation module, ensuring proactive notifications to all admins/owners when agents failed to respond to end-users within defined time thresholds.

Repair Tracker System

A streamlined system for engineers managing product repair details. Engineers upload XML files containing product information to a designated SFTP, triggering an automated process. The system seamlessly processes these files, storing the pertinent details in a MySQL table. Admins can then easily filter through the parts/uploaded information for efficient management.

In this project, my primary responsibility was the creation of a robust function using the Laravel framework. This function, executed every minute via a CronJob, utilized the phpseclib's SFTP library. The function seamlessly logged into the designated SFTP account, performed verification checks on file extensions, and parsed XML files. The extracted details were then gracefully added to the system's MySQL table. To maintain system integrity, the function also handled file renaming for differentiation and created logs for debugging purposes in case of any issues.

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.

Messenger

An integrated messaging platform that seamlessly connects various chat applications into a centralized hub, offering comprehensive user, leave, and department management functionalities.

My technical contributions spanned both front and back end, encompassing the creation of an intuitive chat interface for users to engage with consumers. The chat UI features a convenient drag-and-drop mechanism for utilizing predefined text samples, reducing repetitive typing. I successfully integrated WhatsApp and Telegram APIs on the back end, facilitating the sending and parsing of messages directly within the system. This system was based on Laravel and Vue, using MySQL as the database.

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.

Languages

JavaScript, CSS, HTML, Ruby, GraphQL, TypeScript, SCSS, SQL, Java, PHP, XML, Go

Frameworks

Ruby on Rails 4, Next.js, Ruby on Rails (RoR), React Native, Laravel, Tailwind CSS, Material UI, Redux, Express.js, NestJS, RailsAdmin

Libraries/APIs

React, Node.js, D3.js, Pure CSS, REST APIs, Chart.js, API Development, Twilio API, Vue

Tools

Git, GitHub, Figma, Expo, Webpack, Jira

Paradigms

REST, Back-end Architecture, App Development, Continuous Integration (CI), Test Automation, UX Design

Platforms

Firebase, Vercel, Google Cloud Platform (GCP), iOS, Android, Heroku, Amazon Web Services (AWS), Twilio, AWS Lambda, Docker

Storage

PostgreSQL, MySQL, MongoDB

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, Team Leadership, Front-end Development, Web Development, API Integration, Charts, Dashboards, Instant Messaging, UI Components, Design, Software Design, Technical Leadership, Mobile Apps, React Query, Digital Commerce, Project Design & Management, Quality Assurance (QA), Chakra UI, Architecture, RESTful Web Services, Authentication, Customer Relationship Management (CRM), Graphs, CI/CD Pipelines, Accessibility, Design Systems, Software Architecture, Styled-components, Applied Physics, Biology, Planning, Communication, WebSockets, Sankey, Content Management Systems (CMS), OpenAI GPT-4 API, ChatGPT, SDKs, Integration, SFTP, GRAPH

2012 - 2016

Bachelor's Degree in Computer Science

University of Greenwich - Kuala Lumpur, Malaysia

2008 - 2010

Diploma in Biology

Lahore Grammar High School - Lahore, Pakistan

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