errsy/presentation/slides.tex

\documentclass[usepdftitle=false]{beamer}

\usepackage[fr,code]{projektor}
\usepackage{adforn}

% Aliases
\def\sujetPT{Analyse des conventions de programmation}
\def\clf{\texttt{clang-format}}
\def\black{\texttt{black}}
\def\ruff{\texttt{ruff}}

\def\st{Implémentation du projet tuteuré}
\title[\st]{\sujetPT}
\subtitle{\st}
\author{
    \begin{tabular}{@{}l@{\hspace{.5em}}l}
        \href{mailto:anri.kennel@etud.univ-paris8.fr}{Anri Kennel} &| L3 \\
        \href{http://www.bocal.cs.univ-paris8.fr/~balmas/}{Françoise Balmas} &| Tutrice
    \end{tabular}\\
}
\institute{
       \href{https://informatique.up8.edu/licence-iv/}{Université Paris 8}
$\cdot$ Licence informatique \& vidéoludisme
}
\date{Année universitaire 2022-2023}

\hypersetup{
    pdfauthor={Anri Kennel (étudiant) et Françoise Balmas (tuteur)},
    pdftitle={\st},
}

\begin{document}

\maketitle

\begin{frame}[t, plain]{Plan}
    \begin{center}
        \sujetPT
    \end{center}
    \tableofcontents
\end{frame}

\def\title{Projet}
\section{\title}

\begin{frame}[fragile]{Conventions de programmation}
    Qu'est-ce que c'est ?
    \begin{itemize}
        \item<2-> \alert<4>{Contraintes imposées} de manière à rendre le code plus lisible et échangeable
            \begin{itemize}
                \item<2-> Code source
                \item<2-> Projet en général (organisation des fichiers, \dots)
            \end{itemize}
        \item<3-> Par exemple :
    \end{itemize}

    \onslide<3->
    \begin{figure}
        \begin{minipage}{0.3\textwidth}
            \begin{minted}[autogobble,frame=lines,rulecolor=\color{gray}]{abnf}
                IndentWidth: 4
            \end{minted}
        \end{minipage}
        \caption*{Dans \clf, indentation de 4 espaces}
    \end{figure}

    \only<4>{\frametitle{\dots implémentation ?}}
    \begin{itemize}
        \item<4-> Rendre le suivi des conventions moins contraignantes
    \end{itemize}
\end{frame}

\begin{frame}{\title}
    Base :
    \begin{itemize}
        \item \textbf{Utilisation de \clf.}
              \begin{itemize}
                  \item<2-> Compatible avec plusieurs langages (C, C++, \dots)
                  \item<2-> Customisation du style de convention suivi
              \end{itemize}
        \item<3-> Développé en python
    \end{itemize}

    \onslide<4->{Projet :}
    \begin{itemize}
        \item<4-> Création d'une interface basique pour \clf
        \item<4-> Utilisation de \clf\ moins rebutante
    \end{itemize}
\end{frame}

\def\title{Interface}
\section{\title}
\begin{frame}{\title}
    \only<5>{
        \begin{figure}
            \includegraphics[width=\textwidth]{imgs/regular.png}
            \caption*{Errsy}
        \end{figure}
    }
    \begin{columns}[onlytextwidth]
        \column{\dimexpr\linewidth-50mm-5mm} % colonne de gauche
        \begin{itemize}
            \item<1-3,6-> Simple (tkinter)
            \item<2-3,6-> Support dossier complet ou fichier unique
            \item<3,6-> Rechargement automatique en cas de changement de style/fichier/dossier
            \item<4,6-> Système de pages
            \item<6-> Possibilité de cliquer sur les avertissements (détail)
        \end{itemize}

        \column{50mm} % colonne de droite
        \only<1-2>{
            \vspace{2cm}
            \begin{figure}
                \def\ecart{-6cm}
                \hspace{\ecart}
                \includegraphics[width=10cm]{imgs/main.png}
                \caption*{\hspace{\ecart}Écran principal}
            \end{figure}
        }
        \only<3>{
            \begin{figure}
                \def\ecart{-5mm}
                \hspace{\ecart}
                \includegraphics[width=5cm]{imgs/style.png}
                \caption*{\hspace{\ecart}Sélection des styles}
            \end{figure}
        }
        \only<4>{
            \begin{figure}
                \def\ecart{-6cm}
                \hspace{\ecart}
                \includegraphics[width=10cm]{imgs/page.png}
                \caption*{\hspace{\ecart}Menu du bas pour les pages}
            \end{figure}
        }
    \end{columns}
    \onslide<7>{\centering $\Rightarrow$ Démonstration $\Leftarrow$}
\end{frame}

\section[Suivi de conventions de programmation]{Suivre une convention}
\def\title{Outils utilisés - développement du projet}
\subsection*{\title}
\begin{frame}{\title}
    Langage du projet : \textbf{Python}
    \begin{block}<2->{Formatter : \black}
        Formate le code pour suivre la convention \textit{(convention décidée par les développeurs de l'outil)}
    \end{block}

    \begin{block}<3->{Linter : \ruff}
        Complément à \black, formate les importations, préviens de certains bugs en amont
    \end{block}

    \vspace{5mm}
    \begin{exampleblock}<4->{Configuration}
        Les deux outils sont configurés dans un unique fichier \texttt{pyproject.toml}
        et l'environnement de développement est explicité dans \texttt{requirements.txt}.
    \end{exampleblock}
\end{frame}

\def\title{Facile d'utilisation}
\subsection*{\title}
\begin{frame}{\title}
    \begin{itemize}
        \item Configuration des IDE \begin{itemize}
                  \item \texttt{EditorConfig} (\texttt{Emacs}, \texttt{Vim}\dots)
                  \item \texttt{VSCode}/\texttt{VSCodium}
              \end{itemize}
        \item<2-> Intégration dans Git \begin{itemize}
                \item hook $\rightarrow$ \texttt{precommit} (vérifie le code avec \black\ et \ruff)
            \end{itemize}
    \end{itemize}
    \onslide<3>{\textbf{Permet de suivre les conventions de programmation plus facilement}}
\end{frame}

\def\title{Conclusion}
\section*{\title}
\begin{frame}{\title}
    Conventions de programmation :
    \begin{itemize}
        \item Ne dois pas être contraignant
        \item Il faut être d'accord avec le style choisit
    \end{itemize}

    \onslide<2>
    Projet :
    \begin{itemize}
        \item Simple
        \item Suivre une convention, c'est, aussi, simple
    \end{itemize}
\end{frame}

\appendix
\begin{frame}[plain, c]
    \centering \Large \adforn{21} \textbf{Merci} \adforn{49}
\end{frame}

\end{document}