init
This commit is contained in:
commit
c033384c4e
5 changed files with 330 additions and 0 deletions
8
.gitignore
vendored
Normal file
8
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
*.aux
|
||||
*.log
|
||||
*.nav
|
||||
*.out
|
||||
*.snm
|
||||
*.synctex.gz
|
||||
*.toc
|
||||
*.sty
|
||||
BIN
Webdev in Haskell.pdf
Normal file
BIN
Webdev in Haskell.pdf
Normal file
Binary file not shown.
257
Webdev in Haskell.tex
Normal file
257
Webdev in Haskell.tex
Normal file
|
|
@ -0,0 +1,257 @@
|
|||
\documentclass[aspectratio=169,10pt]{beamer}
|
||||
\usepackage{fontspec}
|
||||
\usepackage[utf8]{inputenc}
|
||||
\usepackage[english]{babel}
|
||||
\usepackage{listings}
|
||||
\usepackage{tcolorbox}
|
||||
\usepackage{hyperref}
|
||||
\usepackage{qrcode}
|
||||
|
||||
\newtcbox{\mybox}{
|
||||
on line,
|
||||
%colframe=mycolor,
|
||||
colback=gray,
|
||||
%boxrule=0.5pt,
|
||||
arc=4pt,
|
||||
boxsep=0pt,
|
||||
left=6pt,
|
||||
right=6pt,
|
||||
top=6pt,
|
||||
bottom=6pt
|
||||
}
|
||||
|
||||
\lstdefinelanguage{Haskelln}{
|
||||
language = Haskell,
|
||||
otherkeywords = {=>,->,::,++,!!,|,<-},
|
||||
}
|
||||
|
||||
\lstset{
|
||||
frame=none,
|
||||
xleftmargin=2pt,
|
||||
stepnumber=1,
|
||||
numbers=none,
|
||||
numbersep=5pt,
|
||||
numberstyle=\ttfamily\tiny\color{lightgray},
|
||||
belowcaptionskip=\bigskipamount,
|
||||
captionpos=b,
|
||||
escapeinside={*'}{'*},
|
||||
language=Haskelln,
|
||||
tabsize=2,
|
||||
emphstyle={\bf},
|
||||
commentstyle=\it,
|
||||
stringstyle=\mdseries\ttfamily\color{green},
|
||||
showspaces=false,
|
||||
keywordstyle=[1]\color{cyan}\bfseries\ttfamily,
|
||||
keywordstyle=[2]\color{orange}\bfseries\ttfamily,
|
||||
keywordstyle=[3]\color{yellow}\bfseries\ttfamily,
|
||||
keywordstyle=[4]\color{red}\bfseries\ttfamily,
|
||||
keywordstyle=[5]\color{purple}\bfseries\ttfamily,
|
||||
keywordstyle=[6]\color{blue}\bfseries\ttfamily,
|
||||
%keywordstyle=\color{cyan}\ttfamily
|
||||
columns=flexible,
|
||||
basicstyle=\color{white}\small\ttfamily,
|
||||
showstringspaces=false,
|
||||
morecomment=[l]\%,
|
||||
emptylines=1,
|
||||
}
|
||||
|
||||
% You can set fonts for Latin script here
|
||||
\setmainfont{FreeSerif}
|
||||
\setsansfont{FreeSans}
|
||||
\setmonofont{Fira Mono}
|
||||
|
||||
\usetheme{DarkConsole}
|
||||
|
||||
\begin{document}
|
||||
|
||||
% The metadata of the presentation
|
||||
\title{Modernes WEbdevolpment in Haskell}
|
||||
\subtitle{Am Beispiel des Projektes \texttt{mateamt}}
|
||||
\author[]{Amedeo Molnár - \href{mailto:nek0@nek0.eu}{nek0@nek0.eu}}
|
||||
%\institute{SRH Berufsbildungswerk Dresden gGmbH}
|
||||
\date{\today} % Replace with date of the presentation
|
||||
|
||||
\begin{frame}[plain]
|
||||
\maketitle
|
||||
\end{frame}
|
||||
|
||||
\begin{frame}{Gliederung}
|
||||
\tableofcontents
|
||||
\end{frame}
|
||||
|
||||
\section{Moderne Webentwicklung}
|
||||
|
||||
\begin{frame}{\secname}
|
||||
\onslide<2->{
|
||||
\mybox{
|
||||
\begin{minipage}{0.45\linewidth}
|
||||
\onslide<2->{
|
||||
\begin{center}
|
||||
\textbf{Backend}
|
||||
\end{center}
|
||||
}
|
||||
\onslide<3->{
|
||||
Typische Sprachen:
|
||||
\begin{itemize}
|
||||
\item<4-> PHP
|
||||
\item<5-> Java
|
||||
\item<6-> Ruby
|
||||
\item<7-> Python
|
||||
\end{itemize}
|
||||
}
|
||||
\end{minipage}
|
||||
}
|
||||
\mybox{
|
||||
\begin{minipage}{0.45\linewidth}
|
||||
\onslide<2->{
|
||||
\begin{center}
|
||||
\textbf{Frontend}
|
||||
\end{center}
|
||||
}
|
||||
\onslide<8->
|
||||
Verwendete Sprachen:
|
||||
\begin{itemize}
|
||||
\item<8-> HTML
|
||||
\item<9-> CSS
|
||||
\item<10-> JavaScript
|
||||
\end{itemize}
|
||||
\onslide<11->{
|
||||
Häufig verwendete Frameworks:
|
||||
\begin{itemize}
|
||||
\item<12-> React
|
||||
\item<13-> Bootstrap
|
||||
\item<14-> jQuery
|
||||
\end{itemize}
|
||||
}
|
||||
\end{minipage}
|
||||
}
|
||||
}
|
||||
\end{frame}
|
||||
|
||||
\section{Haskell}
|
||||
|
||||
\begin{frame}{\secname}
|
||||
\begin{center}
|
||||
\includegraphics[width=.2\linewidth]{logo.png}
|
||||
\end{center}
|
||||
\begin{minipage}{.45\linewidth}
|
||||
\begin{itemize}
|
||||
\item<2-> Rein funktional
|
||||
\item<3-> Nicht-strikt evaluiert
|
||||
\item<4-> Stark statisch typisiert
|
||||
\item<5-> Volle Typinferenz
|
||||
\end{itemize}
|
||||
\end{minipage}
|
||||
\begin{minipage}{.45\linewidth}
|
||||
\begin{itemize}
|
||||
\item<6-> Big Data
|
||||
\item<7-> Banken- und FInanzsektor
|
||||
\item<8-> Wissenschaft
|
||||
\end{itemize}
|
||||
\end{minipage}
|
||||
\end{frame}
|
||||
|
||||
\subsection{Hauptunterschiede zu imperativer Programmierung}
|
||||
|
||||
\begin{frame}{\subsecname}
|
||||
\begin{itemize}
|
||||
\item<2-> Strikte Trennung zwischen reinen Berechnungen und Seiteneffekten
|
||||
\item<3-> Unveränderliche Variablen
|
||||
\item<4-> Keine Schleifen
|
||||
\item<5-> Kein State
|
||||
\end{itemize}
|
||||
\end{frame}
|
||||
|
||||
\section{Vorteile von Haskell in der Webentwicklung}
|
||||
|
||||
\begin{frame}{\secname}
|
||||
\begin{itemize}
|
||||
\item<2-> Serialisierung und Deserialisierung von Daten unkompliziert
|
||||
\item<3-> Datenverarbeitung kann leichter auf Korrektheit geprüft werden
|
||||
\item<4-> Webanwendungen sind in der Regel zustandslos
|
||||
\item<5-> Konkurrente Anfragen/Berechungen relativ leicht hmöglich
|
||||
\end{itemize}
|
||||
\end{frame}
|
||||
|
||||
\section{Konventionen beim \texttt{mateamt} im Gegensatz zum \texttt{yammat}}
|
||||
|
||||
\begin{frame}{secname}
|
||||
\mybox{
|
||||
\begin{minipage}{.45\linewidth}
|
||||
\texttt{mateamt}\\
|
||||
\begin{itemize}
|
||||
\item<2-> Programmiersprache: Haskell
|
||||
\item<4-> Stellt nur ein Backend dar
|
||||
\item<6-> Microservice-Architektur
|
||||
\end{itemize}
|
||||
\end{minipage}
|
||||
}
|
||||
\mybox{
|
||||
\begin{minipage}{.45\linewidth}
|
||||
\texttt{yammat}\\
|
||||
\begin{itemize}
|
||||
\item<3-> Programmiersprache: Haskell
|
||||
\item<5-> Front- und Backend
|
||||
\item<7-> Monolithische Architektur
|
||||
\end{itemize}
|
||||
\end{minipage}
|
||||
}
|
||||
\end{frame}
|
||||
|
||||
\section{Das Frontend des \texttt{mateamt}es}
|
||||
|
||||
\begin{frame}{\secname}
|
||||
\begin{itemize}
|
||||
\item<2-> Zukünftige Benutzer des \texttt{mateamt}es sind ausdrücklich eingeladen eigene Frontends/Clients zu schreiben
|
||||
\item<3-> Zur Unterstützung bei der Entwicklung wird folgendes angeboten:
|
||||
\begin{itemize}
|
||||
\item<4-> Beschreibung der API nach OpenAPI 3.0
|
||||
\item<5-> Swagger UI
|
||||
\end{itemize}
|
||||
\item<6-> Ein Referenzclient (der \texttt{matebeamte}) ist bereits in Arbeit
|
||||
\end{itemize}
|
||||
\end{frame}
|
||||
|
||||
\section{Der Quelltext}
|
||||
|
||||
\begin{frame}{Codetour}
|
||||
\begin{center}
|
||||
Bitte schnallen Sie sich an…
|
||||
\end{center}
|
||||
\end{frame}
|
||||
|
||||
\begin{frame}{Code-Repositories}
|
||||
\begin{minipage}{.45\linewidth}
|
||||
\begin{center}
|
||||
\qrcode{https://gitea.nek0.eu/nek0/mateamt}\\
|
||||
\href{https://gitea.nek0.eu/nek0/mateamt}{gitea.nek0.eu/nek0/mateamt}
|
||||
\end{center}
|
||||
\end{minipage}
|
||||
\begin{minipage}{.45\linewidth}
|
||||
\begin{center}
|
||||
\qrcode{https://gitea.nek0.eu/nek0/matebeamter}\\
|
||||
\href{https://gitea.nek0.eu/nek0/matebeamter}{gitea.nek0.eu/nek0/matebeamter}
|
||||
\end{center}
|
||||
\end{minipage}
|
||||
\end{frame}
|
||||
|
||||
\section*{Abschluss}
|
||||
|
||||
\begin{frame}[plain, noframenumbering]
|
||||
\begin{center}
|
||||
\Huge Fragen? Fragen!
|
||||
\end{center}
|
||||
\end{frame}
|
||||
|
||||
\begin{frame}[plain, noframenumbering]
|
||||
\begin{center}
|
||||
{\Huge Vielen Dank für die Aufmerksamkeit!}\\
|
||||
|
||||
\vspace{1cm}
|
||||
|
||||
Diese Presentation steht zum Download bereit unter:\\
|
||||
\url{https://gitea.nek0.eu/nek0/???}
|
||||
\end{center}
|
||||
\end{frame}
|
||||
|
||||
\end{document}
|
||||
BIN
logo.png
Normal file
BIN
logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
65
writeup.md
Normal file
65
writeup.md
Normal file
|
|
@ -0,0 +1,65 @@
|
|||
#Modernes Web-Development in Haskell am Beispiel des Projektes `mateamt`
|
||||
|
||||
##Webentwicklung
|
||||
|
||||
* Typischerweise unterteilt in Frontend und Backend
|
||||
* Typische Sprachen Backend:
|
||||
* PHP
|
||||
* Java
|
||||
* Ruby
|
||||
* Python
|
||||
* Frontendentwicklung geschieht in:
|
||||
* HTML
|
||||
* CSS
|
||||
* JavaScript
|
||||
* Häufige Bibliotheken im Frontend:
|
||||
* React
|
||||
* Bootstrap
|
||||
* jQuery
|
||||
|
||||
##Haskell
|
||||
|
||||
* Rein funktionale Programmiersprache
|
||||
* Nicht-strikt evaluiert
|
||||
* Stark statisch typisiert
|
||||
* Volle Typinferenz
|
||||
* Typische Einsatzgebiete:
|
||||
* Big Data
|
||||
* Banken- und Finanzsektor
|
||||
* Wissenschaft (Simulationen, Hochparallele Berechnungen)
|
||||
* Theoretisch: Überall, da Turing-Vollständig
|
||||
|
||||
###Hauptunterschiede zur imperativen Programmierung
|
||||
|
||||
* Vermeidung bzw. klare Trennung von Seiteneffekten (Disk IO, DB, Netzwerk, etc.)
|
||||
* Unveränderliche Variablen
|
||||
* Keine Schleifen
|
||||
* Kein State
|
||||
|
||||
##Vorteile von Haskell in der Webentwicklung
|
||||
|
||||
* Serialisierung und Deserialisierung von Daten meist unkompliziert, da stark typisiert
|
||||
* Datenverarbeitung kann einfach auf Korrektheit geprüft werden
|
||||
* Webanwendungen sind i.d.R. stateless, Haskell auch
|
||||
* Haskell kann sehr gut mit konkurrenten Berechnungen umgehen, welche bei Webanwendungen häufig
|
||||
auftreten
|
||||
|
||||
##Konventionen beim `mateamt` und Unterschiede vom `yammat`
|
||||
|
||||
* Programmiert ist es (wieder) in Haskell
|
||||
* Grundsätzlich ist das `mateamt` 'nur' ein Backend
|
||||
* Microservice-Architektur (Im Gegensatz zum monolithischen `yammat`) ermöglicht klarere Trennung
|
||||
zwischen Daten- und Kundenseite (Separation of Concerns)
|
||||
* Es wird ein modifiziertes MVC-Architekturmodell verwendet:
|
||||
* 'View' ist ausgelassen, da keine Anzeige erfolgt
|
||||
* Vorteil ist auch hier eine Domänentrennung zwischen Datenbank und Controller.
|
||||
* Kommunikation mit Frontend(s) läuft über eine definierte JSON-REST-API
|
||||
|
||||
##Das Frontend des `mateamt`es
|
||||
|
||||
* Zukünftige Benutzer das `mateamt`es sind ausdrücklich eingeladen eigene Clients/Frontends für die
|
||||
API des `mateamt`es in einer Sprache ihrer Wahl zu implementieren.
|
||||
* Zur Unterstützung der Entwicklung eigener Clients/Frontends werden angeboten:
|
||||
* OpenAPI 3.0 beschreibung der API
|
||||
* Swagger UI
|
||||
* Ein Referenzclient (der `matebeamte`) ist bereits in Arbeit
|
||||
Loading…
Reference in a new issue