Skip to content
Yassir Halaoui
Lire en français

Competence

React, Next.js and TypeScript, from micro-frontends to sites that rank

I've written React since version 17, in bank back offices, a payments portal and every product I've built. Lately: a React 19 micro-frontend in a multi-country portal, and Next.js sites that rank.

In short

Yassir Halaoui is a senior React developer working with React 17 to 19, Next.js, TypeScript and micro-frontends built with Module Federation. He shipped a React 19 micro-frontend into a multi-country payments portal with a type-safe client generated from OpenAPI, and built RevealTogether, TheQuizMaster and this site with Next.js.

Where I've used it

  1. Pluxee · 2025 to now

    Shipped a React 19 and TypeScript micro-frontend over Module Federation into a multi-country host portal, with a type-safe BFF client generated from the OpenAPI spec by a Git hook.

  2. Société Générale · 2022 to 2024

    Built the React and TypeScript front end of a digital-signature application for banking documents, including screens driven by roles and permissions.

  3. Docaposte · 2024 to 2025

    Built React and TypeScript screens for a data-exchange platform used between insurers.

  4. RevealTogether

    Next.js in English, French and Spanish, with a live countdown and votes synchronized across every guest's screen.

  5. This site

    Next.js 16 with React 19 and the React Compiler, every route prerendered, in two languages, with no client JavaScript for its scroll animations.

Everything in this area

React
  • React 17
  • React 18
  • React 19
  • React Compiler
  • Server Components
Frameworks and build
  • Next.js
  • Vite
  • Module Federation
Language
  • TypeScript
  • JavaScript
  • HTML5
  • CSS3
State and data
  • Redux
  • Redux Toolkit
  • RTK Query
  • TanStack Query
  • Zustand
  • Context API
  • Zod
UI
  • Tailwind CSS
  • Material UI
  • Chakra UI
  • Emotion
  • i18next
Testing
  • Vitest
  • Jest
  • React Testing Library

In depth

Micro-frontends, when the org chart asks for them

Module Federation solves a team problem more than a technical one: several teams shipping into one portal on their own schedules. It costs shared-dependency discipline and a contract between host and remote. What made ours safe was regenerating the API client from OpenAPI on every commit, so a backend change broke the build instead of the page.

Server first

On Next.js I default to Server Components and static generation, and add client code only where a browser API requires it. That's why this site ships no JavaScript for its animations and every page is prerendered: fast for people, complete for crawlers.

Types from the API to the button

TypeScript in strict mode, Zod wherever data comes from outside, and generated clients instead of hand-written fetch calls. The aim is simple: a renamed field fails in CI, not in front of a customer.

Questions

Can you build React micro-frontends with Module Federation?

Yes. I shipped one into a multi-country payments portal with React 19 and TypeScript. The work that matters is the shared-dependency policy and a generated, type-safe API client, more than the federation config itself.

Can you migrate an app to the Next.js App Router or React 19?

Yes. This site runs on Next.js 16 and React 19 with the compiler on. A migration goes route by route, moving data fetching to the server first, which is where most of the performance and SEO gains come from.

Is React bad for SEO?

Client-rendered React can be. Server-rendered or statically generated React isn't: the crawler receives complete HTML. Most React SEO problems are rendering decisions, and they're fixable.

Which state management do you recommend?

Server state in TanStack Query or RTK Query, little else global, and Zustand or context for the rest. Most apps that reach for a big global store are caching server data by hand.

Field notes

Shipped work

Related competences