🎓 Write some more things

backend/poetry.lock

@@ -248,6 +248,17 @@ MarkupSafe = ">=2.0"
 [package.extras]
 i18n = ["Babel (>=2.7)"]
 
+[[package]]
+name = "jsx-lexer"
+version = "1.0.0"
+description = "A JSX lexer for Pygments"
+category = "dev"
+optional = false
+python-versions = "*"
+
+[package.dependencies]
+Pygments = ">=2.7"
+
 [[package]]
 name = "latexcodec"
 version = "2.0.1"
@@ -730,7 +741,7 @@ test = ["websockets"]
 [metadata]
 lock-version = "1.1"
 python-versions = "^3.9"
-content-hash = "51ddb46bd6559cbdb22d529967f3368f91b034862c4df87b14e785aa282aa03d"
+content-hash = "a4b579746d23d05799bebbe7a3581f9b0762034ef30cca8934d9d2e46feb0a0b"
 
 [metadata.files]
 alabaster = [
@@ -825,6 +836,10 @@ jinja2 = [
     { file = "Jinja2-3.0.2-py3-none-any.whl", hash = "sha256:8569982d3f0889eed11dd620c706d39b60c36d6d25843961f33f77fb6bc6b20c" },
     { file = "Jinja2-3.0.2.tar.gz", hash = "sha256:827a0e32839ab1600d4eb1c4c33ec5a8edfbc5cb42dafa13b81f182f97784b45" },
 ]
+jsx-lexer = [
+    { file = "jsx-lexer-1.0.0.tar.gz", hash = "sha256:b5f5270cad47b065417fd7bdb780199d5166bd4a88a2a0fd7412e90e7a59b5cc" },
+    { file = "jsx_lexer-1.0.0-py2.py3-none-any.whl", hash = "sha256:491783c7ae75f2cbde18f66c1362e93afd6e281078482215b70c1a8dfa61e57b" },
+]
 latexcodec = [
     { file = "latexcodec-2.0.1-py2.py3-none-any.whl", hash = "sha256:c277a193638dc7683c4c30f6684e3db728a06efb0dc9cf346db8bd0aa6c5d271" },
     { file = "latexcodec-2.0.1.tar.gz", hash = "sha256:2aa2551c373261cefe2ad3a8953a6d6533e68238d180eb4bb91d7964adb3fe9a" },

backend/pyproject.toml

@@ -27,6 +27,7 @@ sphinx-autobuild = "^2021.3.14"
 sphinxcontrib-bibtex = "^2.4.1"
 rinohtype = "^0.5.3"
 Pillow = "^8.4.0"
+jsx-lexer = "^1.0.0"
 
 [build-system]
 requires = ["poetry-core>=1.0.0"]

thesis/source/docs/4_progetto/index.rst

@@ -155,11 +155,11 @@ Per realizzare il requisito dell'`estendibilità <Estendibilità>`, si è scelto
 Modulo backend
 --------------
 
-Il modulo backend consisterà in una web :abbr:`API (application programming interface)` che si interfaccia con il database e i moduli Jupyter, permettendo un accesso controllato alle risorse del software.
+Il modulo backend consiste in una web :abbr:`API (application programming interface)` che si interfaccia con il database e i moduli Jupyter, permettendo un accesso controllato alle risorse del software.
 
-Sarà scritto in `Python`, usando `Poetry` e le librerie `Django`, `Django REST Framework` e `Docker SDK for Python`, descritte nei prossimi paragrafi.
+È scritto in `Python`, usando `Poetry` e le librerie `Django`, `Django REST Framework` e `Docker SDK for Python`, descritte nei prossimi paragrafi.
 
-Esso sarà **eseguito dal server** sul quale si desidera ospitare Sophon.
+Esso è **eseguito dal server** sul quale si desidera ospitare Sophon.
 
 
 .. index::
@@ -228,7 +228,7 @@ Fornisce una suite di strumenti che assistono nella creazione di siti di medie d
 
 Le pagine restituite vengono definite attraverso funzioni, dette *function-based views*, o attraverso classi, dette *class-based views*, che ricevono in input la richiesta effettuata dall'utente ed restituscono in output la risposta HTTP da inoltrargli.
 
-È stato usato per la realizzazione del modulo backend in quanto presentato al corso di Tecnologie web di Unimore, e con tutte le funzionalità necessarie per la realizzazione del progetto del sito.
+È stato scelto per la realizzazione del modulo backend in quanto presentato al corso di Tecnologie web di Unimore, e in quanto contenente tutte le funzionalità necessarie per la realizzazione del progetto del sito.
 
 
 .. index::
@@ -246,6 +246,8 @@ Permette di definire metodi dell'API in modo molto simile alle views di Django:
 
 Inoltre, permette la generazione automatica di metodi per l'interazione con certe entità del database, attraverso particolari classi dette *viewset*.
 
+Come per Django, è stato scelto per lo sviluppo di Sophon in quanto è stato presentato al corso di Tecnologie web di Unimore, e perchè si è ritenuto che fosse l'opzione più semplice per realizzare una web :abbr:`API (application programming interface)` all'interno di Django.
+
 
 .. index::
    single: Docker; SDK for Python
@@ -259,6 +261,7 @@ Per interfacciarsi con i `moduli Jupyter <Modulo Jupyter>`, si è deciso di util
 
    `Containerizzazione`, più avanti nel capitolo.
 
+
 .. index::
    single: modulo; frontend
 
@@ -269,7 +272,13 @@ Il *modulo frontend* consiste in una applicazione web che consente agli utenti d
 
 Le interazioni vengono inviate al `modulo proxy <Modulo proxy>`, che le ispeziona e le inoltra al `modulo server <Modulo server>`.
 
-Sarà scritto in `TypeScript`, usando `Yarn` e le librerie `React`, `FontAwesome` e `Bluelib` in aggiunta a innumerevoli altre microdipendenze.
+È scritto in `TypeScript`, usando `React` e le librerie `FontAwesome` e `Bluelib`, in aggiunta alle loro dipendenze ed altre piccole librerie di supporto.
+
+Viene **eseguito dal browser web** dell'utente che desidera interagire con Sophon, transpilato da TypeScript a `JavaScript`.
+
+.. todo::
+
+   Transpilato esiste come parola italiana? Come si può tradurre "transpiled" altrimenti?
 
 
 .. index::
@@ -278,7 +287,56 @@ Sarà scritto in `TypeScript`, usando `Yarn` e le librerie `React`, `FontAwesome
 JavaScript
 ^^^^^^^^^^
 
-.. todo:: JavaScript
+`JavaScript <https://it.wikipedia.org/wiki/JavaScript>`_ è un linguaggio di programmazione interpretato con tipizzazione debole.
+
+È l'unico linguaggio utilizzabile per fornire interattività alle pagine web; pertanto, è indirettamente utilizzato dal modulo frontend di Sophon.
+
+Il suo modello di oggetti si basa su dizionari che mappano i nomi degli attributi ai loro corrispondenti valori.
+
+Fa inoltre abbondante uso della capacità dei linguaggi dinamici di definire funzioni a runtime (dette anche callback), sfruttandole per favorire la programmazione funzionale.
+
+.. code-block:: javascript
+
+   var cane = {
+      verso: () => console.log("Woof!"),
+   };
+
+   var gatto = {
+      verso: () => console.log("Miao!"),
+   };
+
+   var zoo = [cane, gatto];
+
+   zoo.forEach(
+      (animale) => animale.verso()
+   );
+
+.. index::
+   single: Node.js
+   single: npm
+
+Node.js
+^^^^^^^
+
+`Node.js <https://nodejs.org/>`_ è un runtime `JavaScript` che permette la scrittura e l'esecuzione di programmi all'esterno del contesto di un browser web, utilizzando invece come contesto il sistema operativo su cui viene eseguito.
+
+Include :abbr:`npm (Node package manager)`, un gestore di pacchetti per il download di librerie Node, che interagisce con l'`npm Registry <https://www.npmjs.com/>`_.
+
+È utilizzato da Sophon come toolchain per lo sviluppo e il deployment del modulo frontend, in quanto necessario per l'esecuzione di `Create React App`.
+
+
+.. index::
+   single: Create React App
+   single: React; Create React App
+
+Create React App
+^^^^^^^^^^^^^^^^
+
+`Create React App <https://create-react-app.dev/>`_ è un insieme di strumenti `Node.js` per lo sviluppo di una applicazione web utilizzando la libreria per la creazione di interfacce grafiche `React`.
+
+È utilizzato da Sophon per la costruzione della pagina del modulo frontend che sarà servita all'utente.
+
+Si è scelto di usare Create React App in quanto astrae al programmatore tutta la logica di creazione della pagina, semplificando enormemente la manutenzione ed `estensione <Estendibilità>` futura del software.
 
 
 .. index::
@@ -287,38 +345,60 @@ JavaScript
 TypeScript
 ^^^^^^^^^^
 
-.. todo:: TypeScript
+`TypeScript <https://www.typescriptlang.org/>`_ è un'estensione al linguaggio di programmazione `JavaScript` che vi introduce un sistema di tipizzazione forte.
 
+Non essendo immediatamente utilizzabile all'interno delle pagine web, deve essere prima convertito in JavaScript: ciò viene effettuato da `Create React App` in fase di costruzione dell'applicazione.
 
-.. index::
+.. code-block:: typescript
-   single: Node.JS
 
-Node.JS
+   interface Animale {
-^^^^^^^
+      verso: () => string,
+   }
 
-.. todo:: Node.JS
+   var cane: Animale = {
+      verso: () => console.log("Woof!"),
+   };
 
+   var gatto: Animale = {
+      verso: () => console.log("Miao!"),
+   };
 
-.. index::
+   var zoo: Animale[] = [cane, gatto];
-   single: Yarn
 
-Yarn
+   zoo.forEach(
-^^^^
+      (animale) => animale.verso()
+   );
 
-.. todo:: Yarn
+È stata utilizzata in quasi ogni singola parte del modulo frontend, in quanto avere una tipizzazione forte riduce significativamente i bug prodotti e facilita manutenzione ed `estensione <estendibilità>` del software.
 
 
 .. index::
    single: React
+   single: React; componente
+   single: React; hook
 
 React
 ^^^^^
 
-.. todo:: React
+`React <https://reactjs.org/>`_ è una libreria `JavaScript` per lo sviluppo di interfacce grafiche interattive all'interno di pagine web o applicazioni mobile.
 
+L'interfaccia viene definita in modo dichiarativo e funzionale attraverso una variante dei linguaggi `JavaScript` (o `TypeScript`) detta JSX (o TSX), che permette l'inserimento di nodi HTML all'interno del codice.
 
-.. index::
+Si basa sul concetto di *componenti*, piccole parti incapsulate di interfaccia grafica riutilizzabili attraverso tutta l'applicazione definite attraverso funzioni pure, e di *hooks*, particolari funzioni il cui nome inizia con ``use`` in grado di tenere traccia dello stato di un componente o di causare effetti collaterali all'interno di esso.
-   single: Bluelib
+
+.. code-block:: jsx
+
+   const ComponenteTitoloMaiuscolo = ({text}) => {
+      const capitalizedText = text.toUpperCase();
+
+      return (
+         <h1>
+            {capitalizedText}
+         </h1>
+      );
+   }
+
+È stata scelta per l'utilizzo in Sophon in quanto permette la realizzazione di interfacce grafiche molto complesse attraverso codice di facile comprensione, rendendo possibile la creazione di un'interfaccia altamente `intuibile <Intuibilità>`.
 
 
 .. index::
@@ -327,13 +407,24 @@ React
 FontAwesome
 ^^^^^^^^^^^
 
-.. todo:: FontAwesome
+`FontAwesome <https://fontawesome.com/>`_ è una libreria che fornisce più di mille icone utilizzabili gratuitamente all'interno di pagine web.
 
+È stata usata per favorire l'`intuibilità <Intuibilità>` dell'interfaccia grafica attraverso simboli familiari all'utente.
+
+
+.. index::
+   single: Bluelib
 
 Bluelib
 ^^^^^^^
 
-.. todo:: Bluelib
+.. todo::
+
+   Come potrei dire impersonalmente che l'ho fatta io?
+
+.. todo::
+
+   Bluelib
 
 
 .. index::