// case study

Atlas Fitness Club

Atlas Fitness Club on a desktop monitor and a phone: the “What we can offer” classes page and the membership offer on mobileAtlas Fitness Club on a desktop monitor and a phone: the “What we can offer” classes page and the membership offer on mobile

01 — The problem

Why it exists.

Many local gyms have no website, or a static page that is hard to update and invisible on Google.

For Gym members and prospects, including French- and Arabic-speaking visitors.

  • A static HTML template can't grow: every page duplicates the same code.
  • There is a single language, while the audience speaks three.
  • Client-side-only sites are slow to show content and poorly indexed.
  • The site doesn't give visitors any reason to come back.

02 — What I built

What it does.

  • Trilingual

    English, French and Arabic, with a full right-to-left layout.

  • Server-side rendering

    Content is ready on first load and indexable by search engines.

  • Responsive

    Mobile first.

03 — Screens

A closer look.

04 — The stack & why

Tools, and why.

  • Angular 21

    A structured framework (standalone components, routing, signals) that suits a multi-page site and turns a duplicated HTML template into reusable components. It also showcases Angular next to React.

  • Angular SSR

    A gym is a local business, so being found on Google matters. Server rendering delivers real HTML that loads fast and is fully indexable.

  • i18n with RTL support

    Three languages including Arabic required translations to be built into the architecture from day one, not added later.

  • TypeScript

    Typed data for classes, schedules and prices makes the migration safer.

05 — Challenges & learnings

What was hard.

Challenges

  • Migrating jQuery plugins to Angular

    Template scripts touched window and the DOM directly, which breaks server rendering. They had to be rewritten or loaded only in the browser.

  • Mirroring the layout for Arabic

    Without maintaining a second stylesheet.

Learnings

  • SSR changes how you write components: never assume a browser.
  • Plan internationalization in the architecture, not as a final step.