Web Development

A collection of 23 posts

Web Development

No Green, No MR: How We Ship Core Web Vitals Fixes with an Agentic Workflow

How Halodoc built an agentic, ship-gated workflow to fix Core Web Vitals on Angular apps — with a human confirming before every MR opens.

SEO

Automating Dynamic Prerendering at Halodoc: A Data-Driven Approach to SEO and Faster Page Discovery

We stopped guessing which pages to prerender. By connecting the Google Search Console API directly to our build pipeline, Halodoc now automatically optimizes SEO based on real-time search trends. Here's how we did it. 🚀

Angular

Migrating the Halodoc Website to Zoneless Angular

Halodoc migrated Angular's SSR frontend from Zone.js to zoneless change detection, eliminating unpredictable server errors and SSR failures. The result: a cleaner bundle, more debuggable code, and better alignment with modern Signals reactivity—all measured in production.

Web Development

Automating RxJS Cleanup: How Halodoc Eliminated Angular Memory Leaks

This blog talks about How Halodoc Eliminated Angular Memory Leaks

Angular

Building a Scalable Multi-Cart Checkout System in Angular with RxJS for Feature-Scoped State

Halodoc uses lightweight RxJS stores for scalable Angular state management — enabling real-time updates, reducing boilerplate by 80%, and improving performance across carts, dashboards, and healthcare workflows.

Angular

Upgrade to ESLint 9: Boost Code Quality in Your Angular Project

Keeping code clean and consistent is tough as projects grow. Gaps in code reviews and automation lead to inefficiencies and technical debt. We tackled this by upgrading to ESLint 9 and refining our Jenkins + SonarQube setup, improving rule enforcement and workflow efficiency

Web Development

Effortless Angular Optimization: Insights from Halodoc Web Development

Looking to optimize your Angular web app effortlessly? Discover Halodoc's strategies for top-notch performance and seamless results.

Web Development

Efficient Dynamic Forms with ngComponentOutlet in Angular

ngComponentOutlet in Angular 17 simplifies dynamic component rendering, especially for nested forms. The new binding input removes the need for explicit injectors, making it easier to manage dynamic content and improve code reusability and maintainability within complex UIs

Web Development

Elevating User Experience and Efficiency with Angular Advanced Routing Techniques

In this blog, we will dive into advanced routing techniques in Angular, focusing on guards, resolvers, and lazy-loaded route modules. These concepts will help in building scalable, efficient, and secure Angular applications.

Web Development

Securing Web applications using CSP Nonce

Content Security Policy (CSP) stands as a potent defense, countering attacks like XSS, data injection, and code injection. By combining CSP with Nonce, Angular apps can enhance their security. Our detailed blog will examine CSP, Nonce's importance, and how to seamlessly apply them in Angular apps.

Web Development

Effective Ways to Authenticate Users: JWT vs Sessions , which one to choose?

This blog compares 2 approaches for session management:1. Cookie or Session based approach2. JSON Web Token (JWT) based approach

Angular

Angular Standalone Components Unleashed: Exploring the Magic of a World Without NgModule

Standalone components in software engineering solve challenges in creating fast and efficient web applications, especially with frameworks like Angular. This approach streamlines development, enhances code modularity, and leads to exceptional user experiences.

Angular

Migrating from Angular Flex Layout to Tailwind CSS

Improve your codebase and enhance the development experience for your team by embracing the power of Tailwind CSS and its utility-first approach to create responsive and visually appealing layouts in your Angular projects.

WebDevelopment

Introduction to Common Web Vulnerabilities and Exposures

web security vulnerabilities can have serious consequences for both users and businesses. Through this article, we have discussed the importance of identifying and addressing these vulnerabilities through regular assessments and patching, as well as following best practices for web security.

Web Development

Proxy Servers - A Web Developer's Perspective

This blog talks about proxy servers, their types and benefits, and how these are used in the context of Halodoc.

Web Development

Building Custom Angular Libraries to Write DRY Code

Implementing custom Angular libraries can offer numerous benefits. The DRY (Don't Repeat Yourself) principle encourages us to avoid duplicating code and functionality whenever possible.

Web Development

Leveraging Google Tag Manager (with Amplitude and Braze) for Halodoc Web

Discover how to utilize Google Tag Manager (GTM) with tools like Amplitude and Braze to help product teams gather necessary information for product analysis and help CRM teams to build better customer engagement with web application.

Angular

Chat Integration with Socket.io in Angular

Learn how to create a simple chat message with socket.io in Angular.

Angular

Ahead-of-time (AOT) Compilation

The AOT compiler improves the performance of our applications dramatically by taking the advantage of inline caching mechanism of the JavaScript Virtual Machines. Read on to discover what, why and how of AOT compilation.

Web Development

Creating Animations with Angular Animations

Angular Animations (@angular/animations) is a module that is part of Angular itself, and it is built based on CSS functionality. This means all the functionalities that are possible in CSS animations are also possible to do with this module.

Web Development

Importance of CSS Specificity and its best practices

CSS specificity is crucial to developing any web application since it will allow us to write more efficient CSS code. Without interfering with other classes or selectors. We have leveraged Specificity extensively (as outlined above) to manage/avoid CSS styles from getting overridden in the Browser.

Security

IFrame security threats and the prevention

Understand iFrame security - This blog describes scenarios of using iFrame, the threats, and the solutions to minimize the chance for attackers.

Web Development

Effective compression technique for web applications using Brotli

Performance plays a vital role in user experience impacting engagement. Web apps need to ensure they are performant as most of the times they are accessed on mobile devices with flaky networks.