✨ Write conclusion, clarify things

figures/email-src-hbs.tex

@@ -1,4 +1,4 @@
-\begin{figure}
+\begin{figure}[H]
   \begin{lstlisting}[language=hbs, numbers=none]
 {{#>mint.main}}
   {{#>mint.title}}

figures/email-src-mjml.tex

@@ -1,4 +1,4 @@
-\begin{figure}
+\begin{figure}[H]
   \begin{lstlisting}[language=xml, numbers=none]
 <mjml>
 <mj-head>

figures/fromeffectloop.tex

@@ -1,4 +1,4 @@
-\begin{figure}
+\begin{figure}[H]
   \begin{subfigure}[t]{\textwidth}
     \begin{lstlisting}[language=JavaScript]
 function useCategoryCache() {

figures/normalitytest.tex

@@ -1,4 +1,4 @@
-\begin{figure}
+\begin{figure}[H]
   \begin{align*}
     \sigma_{low} &= S_{n-1}^2 - z_{1-\alpha/2} \frac{\sqrt{2}S_{n-1}^2}{\sqrt{n}} \\
     \sigma_{high} &= S_{n-1}^2 + z_{1-\alpha/2} \frac{\sqrt{2}S_{n-1}^2}{\sqrt{n}} \\
@@ -9,8 +9,8 @@
     &I = [\mu^{\star} \pm \sigma_{high} \cdot z_{1 - \beta/2}] \\
     &\text{Avec un taux d'erreur de $\alpha$,} \\
     X \hookrightarrow \mathcal{N}(\mu, \sigma^2)
-    &\Rightarrow \forall i, \mathcal{P}(\omega_i \in I) = 1 - \beta' \ge 1 - \beta \\
+    &\Rightarrow \forall i, \mathcal{P}(X_i \in I) = 1 - \beta' \ge 1 - \beta \\
-    &\Rightarrow S = \sum_{i=1}^{n}{\mathds{1}_{I}(\omega_i)} \hookrightarrow \mathcal{B}(1 - \beta', n) \\
+    &\Rightarrow S = \sum_{i=1}^{n}{\mathds{1}_{I}(X_i)} \hookrightarrow \mathcal{B}(1 - \beta', n) \\
     &\Rightarrow \mathbb{E}(S) = (1 - \beta') n \ge (1 - \beta) n
   \end{align*}
   \caption{Calcul du test de normalité par valeurs anormales}

figures/types.tex

@@ -0,0 +1,97 @@
+\begin{figure}[H]
+  \begin{lstlisting}[language=JavaScript]
+export type InputType = {
+  string: string,
+  'date-time': Date,
+  number: number,
+  checkbox: boolean,
+};
+
+export type InputField<T = unknown> = {
+  defaultValue?: T;
+  validate?: (value: T) => boolean;
+  label?: string;
+  inputType: keyof InputType;
+};
+
+export class InputFieldBuilder {
+  static from<K extends keyof InputType>(inputType: K): InputField<InputType[K]> {
+    // ...
+  }
+  // ...
+}
+
+/**
+ * Represents an action that can be performed on the target device
+ **/
+export abstract class Action<TInput, TOutput> {
+  static module: string;
+  static action: string;
+
+  abstract run(params: TInput): Promise<TOutput>;
+}
+
+/**
+* Returns the `Params` generic type in `Action<Params, Result>`
+**/
+export type ExtractActionParams<TAction extends Action<unknown, unknown>> =
+  TAction extends Action<infer Params, unknown> ? Params : never;
+\end{lstlisting}
+  \caption{Exemple de types avancés en TypeScript (1/2)}
+  \label{types}
+\end{figure}
+\begin{figure}[H]
+\begin{lstlisting}[language=JavaScript]
+/**
+* This type returns a narrowed-down version of `Record<string, InputField>`, that requires that every value in `Params`
+* has a field attached to it.
+**/
+export type MapActionParams<Params> = Params extends undefined | void | null
+  ? unknown
+  : {
+      [Key in keyof Params]: Params[Key] extends InputType[keyof InputType]
+        ? InputField<Params[Key]>
+        : InputField;
+    };
+
+/**
+* Conditionally sets the `fields` property of `Request` to:
+* - if `TAction` is set to `unknown` (default), an optional `Record<string, InputField>`
+* - if `TAction` is set to an `Action`, then it will extract the properties defined in that `Action`,
+*   and require you to properly define their fields
+**/
+export type RequestFields<TAction> = TAction extends Action<unknown, unknown>
+  ? {
+      fields: Record<string, InputField> & MapActionParams<ExtractActionParams<TAction>>;
+    }
+  : {
+      fields?: Record<string, InputField>;
+    };
+
+/**
+ * Represents a network request that will be sent to the device to perform the similarly-named Action.
+ **/
+export type Request<TAction = unknown> = {
+  action?: string;
+  module?: string;
+} & RequestFields<TAction>;
+
+// Exemple:
+
+class ShowMessageAction extends Action<{ message: string}, void> {
+  run({message}): Promise<void> {
+    // show `message`
+  }
+}
+
+const ShowMessageRequestFields: RequestFields<ShowMessageAction> = {
+  module: 'system',
+  action: 'showMessage',
+  fields: {
+    // Si on omet `message` ou si on utilise un autre type, une erreur est affichée
+    message: InputFieldBuilder.from('string').build()
+  }
+};
+  \end{lstlisting}
+  \caption{Exemple de types avancés en TypeScript (2/2)}
+\end{figure}

references.bib

@@ -270,3 +270,10 @@
     eprint={https://analyticalsciencejournals.onlinelibrary.wiley.com/doi/pdf/10.1002/cem.2713},
     year={2015}
 }
+
+@misc{reactivity,
+    title={Guides: Reactivity},
+    author={SolidJS},
+    howpublished="\url{https://www.solidjs.com/guides/reactivity}",
+    note="En ligne; accédé le 10 Février 2023]"
+}

report.tex

@@ -165,10 +165,9 @@
   une start-up française basée à Paris et fondée en 2013.
   \newline
 
-  % TODO: check wording (maritime)
+  Moment propose à ses clients des offres de divertissement pour l'aviation, le secteur maritime, le secteur ferroviaire et
-  Moment propose à ses clients des offres de divertissement pour l'aviation, le secteur maritime, les chemins de fer et
+  plus récemment le domaine de la santé. Leur offre principale, la \og Flymingo Box \fg, est une solution tout-en-un qui permet
-  plus récemment le domaine de la santé. Leur offre principale, \og Flymingo \fg, permet d'accéder aux divertissements
+  aux passagers de directement accéder à une librairie de divertissement depuis leurs appareils mobiles.
-  directement depuis les appareils mobiles des passagers.
   \newline
 
   J'ai pu contribuer au développement de fonctionnalités pour la nouvelle offre déployée dans les cliniques de santé,
@@ -195,17 +194,15 @@ de croisière et plus récemment les cliniques de santé.
 Cette plateforme permet aux voyageurs de se connecter à un réseau wifi avec leurs propres appareils, et de profiter
 de divertissements directement sur ceux-cis.
 
-% TODO: récupérer le vrai nombre d'employés et de projets
 À ce jour, \entityb{Moment} s'apprête à compter 10 ans de travail dans ce domaine, et possède une trentaine d'employés.
-\entityb{Moment} a lancé une cinquantaine de projets, dans 15 pays, et ses produits sont utilisés par plus de 10 millions
+\entityb{Moment} a lancé plus de 60 projets dans plus de 15 pays, et ses produits sont utilisés par plus de 10 millions
 de passagers par jour.
 
-% TODO: valider Air France?
+\entityb{Moment} fournit ses services aujourd'hui à \entity{TGV InOui}, \entity{Air Belgium}, \entity{Brittany Ferries} et \entity{Air Senegal}.
-\entityb{Moment} fournit ses services aujourd'hui à \entity{Air France}, l'\entity{Aéroport de Paris},
+\entityb{Moment} a aussi dans le passé fourni ses services à \entity{Air France} et \entity{l'Aéroport de Paris}.
-\entity{TGV InOui}, \entity{Air Belgium}, \entity{Brittany Ferries} et \entity{Air Senegal}.
 
-L'entreprise \entityb{Moment} a lancé en 2021 une filiale nommée \entity{Moment Care}, qui se spécialise dans
+Après avoir déployé déjà 500 serveurs, l'entreprise \entityb{Moment} a lancé en 2021 une filiale nommée \entity{Moment Care},
-le divertissement dans le domaine de la santé:
+qui se spécialise dans le divertissement dans le domaine de la santé:
 \entity{Moment Care} souhaite révolutionner le contenu des offres de divertissement dans les établissements
 de santé, et la manière d'y accéder \cite{momentcare}.
 
@@ -254,20 +251,29 @@ différents pôles:
   \item[Full Stack:] L'équipe \entity{Full Stack} développe les différentes applications front-end et back-end que \entity{Moment} propose.
     Ces applications s'étendent du serveur de streaming de médias aux applications web et aux applications mobiles.
     C'est également l'équipe que j'ai rejoint durant ce stage.
-  \end{description}
+\end{description}
+
+\begin{figure}[H]
+  \includegraphics[width=\textwidth]{poles}
+  \caption{Diagramme des pôles de l'entreprise}
+\end{figure}
 
+\newpage
 \subsection{Produits de Moment}
 
-\subsubsection{Flymingo}
+\subsubsection{Mood}
 
 % TODO: crop images
 \begin{wrapfigure}{r}{0.25\textwidth}
   \centering
   \includegraphics[width=0.25\textwidth]{flymingo-box}
   \caption*{Flymingo Box}
+  \includegraphics[width=0.25\textwidth]{mood-digital}
+  \caption*{Mood Digital}
 \end{wrapfigure}
 
-\textbf{Flymingo} est la suite de produits principale de \entityb{Moment}, qui est aujourd'hui déployée dans plus de 200 avions, 30 bateaux et 300 trains.
+\textbf{Mood} (auparavant appelé \entity{Flymingo}) est la suite de produits principale de \entityb{Moment},
+qui est aujourd'hui déployée dans plus de 200 avions, 30 bateaux et 300 trains.
 La plateforme \entity{Flymingo} permet aux companies de transport de proposer du divertissement à ses passagers,
 avec une installation et une gestion simplifiée et sans le besoin d'installer des tablettes dans les sièges des passagers.
 
@@ -277,13 +283,18 @@ sur lequel les passagers peuvent se connecter pour profiter des divertissements.
 Différentes applications sont développées autour de la \entity{Flymingo Box}:
 
 \begin{description}
-  \item[Flymingo Entertainment] aussi appelé \entity{Flymingo Digital}, est une application web,
+  \item[Mood Entertainment] aussi appelé \entity{Mood Digital}, est une application web,
-    sur laquelle les passagers se connectent pour regarder des films,
+  sur laquelle les passagers se connectent pour regarder des films,
-    lire de la presse ou jouer à des jeux dans le navigateur.
+  lire de la presse ou jouer à des jeux dans le navigateur.
-    L'application peut être utilisée sur les téléphones, tablettes et ordinateurs.
+  L'application peut être utilisée sur les téléphones, tablettes et ordinateurs.
-    \\
+  \\
-    L'application peut aussi être adaptée visuellement aux besoins des clients,
+  L'application peut aussi être adaptée aux besoins des clients, pour être en accord avec le langage visuel de leur marque
-    ou pour supporter différents services comme l'achat en ligne, les informations de voyage, etc.
+  ou pour supporter différents services comme l'achat en ligne, les informations de voyage, etc.
+\end{description}
+
+\begin{description}
+  \item[Mood TV] est une application tournant sur les télévisions connectées et permettant de profiter du contenu directement sur une télévision.
+    Ces télévisions sont surtout utilisées sur les bateaux de croisière.
 \end{description}
 
 \begin{description}
@@ -294,33 +305,11 @@ Différentes applications sont développées autour de la \entity{Flymingo Box}:
 \begin{description}
   \item[La \og Crew App \fg] est une application sur \entity{iOS} pour les membres de l'équippage,
     qui permet de mettre en pause la lecture des médias pour faire des annonces aux passagers,
-    accéder aux informations des achats faits sur l'application \entity{Flymingo Digital}.
+    accéder aux informations des achats faits sur l'application \entity{Mood Digital}.
-\end{description}
-
-\subsubsection{Mood}
-
-\begin{wrapfigure}{r}{0.25\textwidth}
-  \centering
-  \includegraphics[width=0.25\textwidth]{mood-digital}
-  \caption*{Mood Digital}
-\end{wrapfigure}
-
-% TODO: vérifier la justification de mood
-\textbf{Mood} est une distribution de \entity{Flymingo} plus optimisée pour la robustesse et la rapidité,
-au prix d'une moins vaste customisabilité.
-
-\begin{description}
-  \item[Mood Entertainment] aussi appelé \entity{Mood Digital},
-    est une version de \entity{Flymingo Digital} \og standarde \fg.
-\end{description}
-
-\begin{description}
-  \item[Mood TV] est une application tournant sur les télévisions connectées et permettant de profiter du contenu directement sur une télévision.
 \end{description}
 
 \subsubsection{Mint}
 
-% TODO: éviter la collision de wrapping en forcant un saut de page avant la section précédente
 \begin{wrapfigure}{r}{0.25\textwidth}
   \centering
   \includegraphics[width=0.25\textwidth]{mint-digital}
@@ -334,7 +323,7 @@ Les applications développées autour de cette plateforme sont:
 
 \begin{description}
   \item[Mint Admin,] qui est une application web permettant aux clinique de fixer les prix
-    pour les offres que celles-cis souhaite mettre à disposition, ainsi que de gérer l'assignement des différents
+    pour les offres que celles-ci souhaite mettre à disposition, ainsi que de gérer l'assignement des différents
     appareils (comme les télévisions et les tablettes) aux chambres, des différents patients à ces chambres,
     et des offres aux patients.
 \end{description}
@@ -402,7 +391,7 @@ allant de l'éditeur de texte jusqu'aux outils automatisant le test du code affe
 
 \newcommand{\logowidth}{0.15\textwidth}
 
-\entity{Git} \cite{git} est utilisé pour gérer le versionage du code: cet outil permet de stocker les modifications
+\textbf{Git} \cite{git} est utilisé pour gérer le versionage du code: cet outil permet de stocker les modifications
   apportées au code sous forme de \og commits \fg, et de facilement rassembler et gérer les modifications faites par plusieures personnes.
 
 % wrapfigure does not work with my \entity :(
@@ -534,7 +523,7 @@ Mes tâches au sein de cette équipe seraient de:
 \end{itemize}
 
 Au moment de mes entretiens pour ma candidature de stage,
-les thèmes principaux sur lesquels l'équipe travaillaient étaient le développement de \entity{Flymingo Digital}
+les thèmes principaux sur lesquels l'équipe travaillaient étaient le développement de \entity{Mood Digital}
 et de \entity{Mood TV}, ainsi qu'un peu de développement pour \entity{Mint}.
 
 J'ai aussi pu apprendre que l'équipe utilise la librairie \entity{React} et le framework \entity{Next.JS} pour ses applications front-end,
@@ -557,7 +546,7 @@ un éditeur de texte et un gestionnaire de fenêtre avec lequel je suis plus à
 
 J'ai aussi reçu la documentation d'\og onboarding \fg,
 qui contient une liste de documentations avec lesquelles je devais me familiariser afin de pouvoir travailler efficacement.
-J'ai parcouru ces documentations et ai testé certaines des fonctionnalités décrites dans celles-cis dans un mini-projet de test.
+J'ai parcouru ces documentations et ai testé certaines des fonctionnalités décrites dans celles-ci dans un mini-projet de test.
 
 L'équipe se réunit chaque matin pour discuter des nouveautés et du travail de la veille,
 et pour annoncer sur quoi chaqu'un prévoit de travailler ce jour-ci.
@@ -754,8 +743,6 @@ j'ai également créé une petite application Nest.JS qui affiche dans le naviga
 Cette application permet aussi de développer rapidement les emails sans devoir passer par Amazon pour tester
 les modifications.
 
-% TODO: screenshots
-
 Enfin, j'ai implémenté un module Nest.JS dans l'application \entity{Mint Service},
 qui charge le module de \texttt{mailing-nest} avec en paramètre le chemin des emails pour \entity{Mint}.
 Ce module est importé à plusieurs endroits dans le code, et expose des méthodes dans son service permettant
@@ -935,7 +922,6 @@ alors on peut calculer la moyenne empirique ($\mu^{\star}_n$) et la variance ($(
   (\sigma^{\star}_n)^2 = S_{n-1}^2 &= \frac{\sum_{i=1}^{n} (\omega_i - \mu^{\star}_n)^2}{n-1} \\
   &= \frac{(\mu^{\star}_n)^2}{n-1} - \frac{\sum_{i=1}^{n} \omega_i^2}{n(n-1)} \\ \\
   \mu^{\star}_n \xrightarrow{n\rightarrow\infty} \mu & \quad \quad \quad \sigma^{\star}_n \xrightarrow{n\rightarrow\infty} \sigma
-  % TODO: preuve?
 \end{align*}
 
 Afin de pouvoir comparer différents ensembles de valeurs,
@@ -1047,6 +1033,45 @@ Faire ce travail m'a permis d'avoir une compréhension plus profonde sur différ
 
 \section{Conclusion}
 
+\subsection{Synthèse des résultats}
+
+J'ai été globalement satisfait du travail que j'ai pu fournir durant ce stage:
+les résultats attendus étaient obtenus (le système d'envoi de mail marche encore au moment où j'écris ce rapport, la télévision charge consistemment en moins de 5 secondes, etc.)
+et j'ai pu écrire des tests unitaires pour une bonne partie de mon code, ce qui permettra de maintenir sa fonctionnalité dans les années à venir.
+
+\subsection{Appréciation des technologies utilisées}
+
+J'ai eu durant ce stage des sentiments partagés \entity{React}:
+
+D'un côté, je trouve que la programmation avec React souffre de la décision de React à être à mi-chemin entre de la programmation réactive \og fine \fg \cite{reactivity}
+et de la gestion manuelle de mise à jour.
+J'ai rencontré beaucoup de bugs causés par des effets de bord du système de React,
+dont certains qui ne pouvaient qu'être résolus en changeant en profondeur l'organisation de plusieurs composants.
+
+De l'autre côté, le refactor de \entity{Mood TV} pour extraire ses composants et les placer dans une librairie était très agréable,
+car j'avais le contrôle sur l'organisation que ces composants allaient avoir, et le résultat était très satisfaisant une fois ces composants agencés ensemble.
+
+J'ai apprécié la programmation autour de \entity{Nest.JS}:
+le principe d'inversion de contrôle permet d'écrire du code facilement vérifiable et réutilisable,
+ce qui rend la base de code plus agréable à naviguer et utiliser.
+
+J'ai enfin été agréablement surpris par \entity{TypeScript}:
+si on active l'ensemble des vérifications du code, alors il y a très peu de chances d'avoir des erreurs de type au runtime.
+Le système de type est assez avancé pour pouvoir concevoir des types qui garantissent des invariantes qui auraient été difficiles à garantir dans d'autres langages typés.
+Écrire des types avancés en TypeScript est presque un art. \figref{types}
+
+\subsection{Estimation du gain apporté}
+
+Pour donner une estimation du gain que mon travail a apporté à l'entreprise,
+j'estime que j'ai contribué à 10\% du code sur l'ensemble des applications dévelopées pour \entity{Moment Care}.
+Si on estime ensuite que notre équipe contribue à la moitié de la valeur ajoutée par \entity{Moment Care},
+et que \entity{Moment Care} génère environ 200,000€ par an (les bénéfices de l'année 2022 de \entity{Moment Care} étaient de 183,000€),
+alors on obtient une fourchette basse du gain que j'ai apporté, qui s'élève à 10,000€/an pour les quelques années à suivre.
+
+Naturellement, ma part de contribution va diminuer, via du code écrit par d'autres personnes dans le futur, et via des refactors de mon code.
+Une rapide analyse du code sur la monorepository indique que la demi-vie du code est de 6 mois; \figref{halflife}
+ceci donne environ 2.9 années d'espérance à mon code, soit une fourchette basse de 30,000€ de gain sur les années à venir.
+
 \makeutbmbackcover{}
 \newpage
 
@@ -1059,8 +1084,6 @@ Faire ce travail m'a permis d'avoir une compréhension plus profonde sur différ
 \newpage
 \section{Annexes}
 
-\subsection{Listings de code}
-
 \inputfig{nestjs1}
 \inputfig{nestjs2}
 \inputfig{email-src-hbs}
@@ -1069,4 +1092,12 @@ Faire ce travail m'a permis d'avoir une compréhension plus profonde sur différ
 \inputfig{fromeffectloop}
 \inputfig{normalitytest}
 
+\begin{figure}[H]
+  \includegraphics[width=\textwidth]{survival_plot}
+  \caption{Graphique de survivabilité du code sur la monorepository}
+  \label{halflife}
+\end{figure}
+
+\inputfig{types}
+
 \end{document}