Add technical basics of flutter

.gitignore

@@ -225,4 +225,5 @@ TSWLatexianTemp*
 *.swp
 *.sic
 
-*.tmp
+*.tmp
+chapters/recommendations/recommendations.pdf

bibliography.bib

@@ -98,4 +98,20 @@ isbn="978-981-15-1465-4"
   month  = mar,
 }
 
+@Misc{dartTypes,
+  author  = {{Google LLC}},
+  title   = {{The Dart type system}},
+  url     = {https://dart.dev/guides/language/type-system},
+  urldate = {2022-01-12},
+  year    = {2021},
+}
+
+@Misc{flutterArch,
+  author  = {{Google LLC}},
+  title   = {Architectural overview},
+  url     = {https://docs.flutter.dev/resources/architectural-overview},
+  urldate = {2022-01-12},
+  year    = {2021},
+}
+
 @Comment{jabref-meta: databaseType:bibtex;}

chapters/basics/flutter.tex

@@ -10,7 +10,38 @@ Neben Flutter existieren auch andere Cross-Plattform Werkzeuge, die das gleiche
 
 \subsection{Technischer Überblick}
 
-Flutter 
+Dieser Abschnitt vermittelt die technischen Grundlagen für die Flutter Technologie. Flutter und die damit entwickelten Anwendungen werden mit der Dart-Programmiersprache entwickelt. Dart lässt sich dabei mir den bereits etablierten Programmiersprachen wie Java oder JavaScript vergleichen wie in \autoref{lst:dartExample} zu sehen ist und ist objektorientierte, optional statisch typisierte \autocite{dartTypes}.
+
+\begin{lstlisting}[caption={Aufbau eines einfachen Flutter-Widgets in Dart}, label={lst:dartExample}]
+import 'package:flutter/material.dart';
+
+class ExampleWidget extends StatelessWidget {
+    const ExampleWidget({Key? key}) : super(key: key);
+
+    @override
+    Widget build(BuildContext context) {
+    return const Text('Hello World');
+    }
+}    
+\end{lstlisting}
+
+Von der Architektur her ist Flutter in einem Schichtentwurf aufgebaut, wie in \autoref{fig:flutterArch} zu sehen ist.
+
+\begin{figure}[h]
+    \centering
+    \includegraphics[width=0.6\textwidth]{chapters/basics/archdiagram.png}
+    \caption{Architekturdiagramm von Flutter \autocite{flutterArch}}
+    \label{fig:flutterArch}
+\end{figure}
+
+Die unterste \texttt{Embedder}-Schicht ist dabei für jede der unterstützten Plattformen einzeln implementiert und stellt den oberen Schichten Resourcen zur Verfügung, wie beispielsweise ein Zeichnungsbereich, indem die Benutzeroberfläche gerendert werden kann. Zudem können hier native Erweiterungen eingebunden werden, die es der App später ermöglicht, von Flutter / Dart aus auf native Betriebssystemfunktionen wie die Kamera zuzugreifen.
+
+Die mittlere \texttt{Engine}-Schicht beinhaltet die meisten performance-kritischen Komponenten und stellt eine universelle Plattform für das Framework zur Verfügung so beinhaltet sie beispielsweise die Rendering-Engine. Anders als bei anderen Cross-Plattform-Frameworks wird in Flutter die komplette Benutzeroberfläche nicht mit nativen Design-Elementen dargestellt, sondern mit dieser eigenen Rendering-Engine gezeichnet. Dies bietet dabei den Vorteil, dass Design-Konzeptionen auf allen Plattformen gleich aussehen.
+
+Die obere \texttt{Framework}-Schicht setzt auf den beiden unteren Schichten auf und bietet die Schnittstellen, die zur Entwicklung von Apps benötigt werden. Zudem beinhaltet sie einen umfangreichen Katalog an Standard-Widgets, die sich am Design der beiden Betriebssysteme iOS und Android orientieren. Diese Widgets sind in den Cupertino-Katalog für das iOS-ähnliche Design und in den Material-Katalog für das besonders auf Android oft genutzte Material-Design eingeordnet. 
+
+Das Konzept des Widgets, welches bereits öfters bisher erwähnt worden ist, wird in dem folgenden Kapitel näher beleuchtet.
+
 
 
 Was ist Flutter?