Atlas Fitness Club


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.