12. Conclusion
We wrote the client [React] for the application [RdvMedecins]. For the user, it displays the same pages as the HTML application from the [NestJS] course, and as the [Vue.js] and [Angular] clients from previous courses; For the developer, everything has changed:
- the server no longer generates pages. It exposes a API JSON, whose contract (routes, body, codes, and error keys) was sufficient to write the client without ever reading its code. The server is, in fact, exactly the same as that of the [Vue.js] and [Angular] clients: only its comments have changed;
- the pages, language, formatting, messages, and navigation have shifted within the browser;
- As for security, nothing has changed: it is still the server that authenticates (cookie [HttpOnly]), verifies roles and management rules, and decides what a patient is authorized to view. The client simply displays whatever the server sends it.
Readers who have followed the three lessons can compare the three frameworks on the same application:
- [React] is more of a display library than a full-fledged framework: it consists of components—which are functions—from JSX, and hooks. For the rest, we had to make some choices: [React Router] for the pages, [TanStack Query] for server data, [Zustand] for shared state, [i18next] for languages, and [Vite] for building. This flexibility comes at a cost: two [React] applications may not resemble each other at all;
- [Angular], on the other hand, provides everything (router, forms, HTTP client, interceptors, build tools), along with a recommended way to use them: more code and concepts (classes, decorators, dependency injection, observables), but applications that all look alike;
- [Vue.js] falls somewhere in between: an official router and store, with templates similar to those in HTML;
- Finally, responsiveness differs. [Vue.js] and [Angular] track signals: when a value changes, only what depends on it is updated. [React] re-renders the component whose state has changed, then compares the result to the previous one: this is easier to understand (a component is a function of its props and state), but it’s up to the developer to declare the dependencies of the effects and to stabilize certain values ([useCallback], the keys in [key]). The [React] compiler ([React Compiler]), which can be added to the project, performs this stabilization automatically.
The [React] concepts covered in this course (components, props, state, effects, custom hooks, contexts, form actions, [Suspense]) are those found in any modern [React] application. To learn more:
- the official documentation, https://react.dev, and its tutorials;
- tests: [Vitest] and [Testing Library] for unit tests of components and hooks, [Playwright] for end-to-end tests (this is the one used to generate the screenshots in this document);
- server-side rendering: the “framework” mode of [React Router] or [Next.js] generates the first page on the server, and the server components of [React] read the data directly from there: this would then partially mirror the architecture of the course [NestJS];
- the course “An Example of a React Client/Server: NestJS” (2026), which examines both a [React] client and its server.