435 lines
10 KiB
HTML
435 lines
10 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="utf-8"/>
|
|
<title>Case-Study</title>
|
|
<meta name="author" content="(Ivan Hörler und Andreas Zweili)"/>
|
|
<style type="text/css">
|
|
.underline { text-decoration: underline; }
|
|
</style>
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/reveal.js/3.0.0/css/reveal.css"/>
|
|
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/reveal.js/3.0.0/css/theme/solarized.css" id="theme"/>
|
|
|
|
|
|
<!-- If the query includes 'print-pdf', include the PDF print sheet -->
|
|
<script>
|
|
if( window.location.search.match( /print-pdf/gi ) ) {
|
|
var link = document.createElement( 'link' );
|
|
link.rel = 'stylesheet';
|
|
link.type = 'text/css';
|
|
link.href = 'https://cdn.jsdelivr.net/reveal.js/3.0.0/css/print/pdf.css';
|
|
document.getElementsByTagName( 'head' )[0].appendChild( link );
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div class="reveal">
|
|
<div class="slides">
|
|
<section id="sec-title-slide"><h1 class="title">Case-Study</h1><h2 class="author">Ivan Hörler und Andreas Zweili</h2><p class="date">Created: 2018-03-14 Wed 14:31</p>
|
|
</section>
|
|
<section id="table-of-contents">
|
|
<div id="table-of-contents">
|
|
<h2>Inhaltsverzeichnis</h2>
|
|
<div id="text-table-of-contents">
|
|
<ul>
|
|
<li><a href="#/slide-org240fb04">Ausgangslage</a></li>
|
|
<li><a href="#/slide-org7faebaf">Varianten</a></li>
|
|
<li><a href="#/slide-orga948954">Kosten</a></li>
|
|
<li><a href="#/slide-orgaf951e8">Vorgehen</a></li>
|
|
<li><a href="#/slide-orgcdd82b2">Fazit</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section>
|
|
<section id="slide-org240fb04">
|
|
<h2 id="org240fb04">Ausgangslage</h2>
|
|
<ul>
|
|
<li>Freie Software in bezug auf open sourcecode.</li>
|
|
|
|
</ul>
|
|
|
|
<p>
|
|
Um einen ersten Anhaltspunkt zu haben, haben wir ein Mindmap gezeichnet in
|
|
welchem wir unsere ersten Ideen erfassten.
|
|
</p>
|
|
|
|
</section>
|
|
<section id="slide-orge789a15">
|
|
<h3 id="orge789a15">Vision</h3>
|
|
<p>
|
|
Die Vision wurde anhand eines Mindmaps erstmals grob umfasst:
|
|
</p>
|
|
|
|
|
|
<div class="figure">
|
|
<p><img src="pictures/webshop.png" alt="webshop.png" width="70%" />
|
|
</p>
|
|
</div>
|
|
|
|
</section>
|
|
<section id="slide-org99bf248">
|
|
<h3 id="org99bf248">Vision - Artikel</h3>
|
|
|
|
<div class="figure">
|
|
<p><img src="pictures/Vision-Artikel.png" alt="Vision-Artikel.png" width="80%" />
|
|
</p>
|
|
</div>
|
|
|
|
</section>
|
|
<section id="slide-orge025fde">
|
|
<h3 id="orge025fde">Vision - Warenkorb</h3>
|
|
|
|
<div class="figure">
|
|
<p><img src="pictures/Vision-Warenkorb.png" alt="Vision-Warenkorb.png" width="80%" />
|
|
</p>
|
|
</div>
|
|
|
|
</section>
|
|
<section id="slide-org9effeb8">
|
|
<h3 id="org9effeb8">Vision - Abgaben</h3>
|
|
|
|
<div class="figure">
|
|
<p><img src="pictures/Vision-Abgaben.png" alt="Vision-Abgaben.png" width="80%" />
|
|
</p>
|
|
</div>
|
|
|
|
</section>
|
|
</section>
|
|
<section>
|
|
<section id="slide-org7faebaf">
|
|
<h2 id="org7faebaf">Varianten</h2>
|
|
<div class="outline-text-2" id="text-org7faebaf">
|
|
</div>
|
|
</section>
|
|
<section id="slide-org0eeae7c">
|
|
<h3 id="org0eeae7c">C# und SQL Server</h3>
|
|
|
|
<div class="figure">
|
|
<p><img src="pictures/csharp.png" alt="csharp.png" />
|
|
</p>
|
|
</div>
|
|
|
|
</section>
|
|
<section id="slide-orgc538cb0">
|
|
<h3 id="orgc538cb0">Laravel und MySQL</h3>
|
|
|
|
<div class="figure">
|
|
<p><img src="pictures/laravel.png" alt="laravel.png" />
|
|
</p>
|
|
</div>
|
|
|
|
</section>
|
|
<section id="slide-orgad29e2c">
|
|
<h3 id="orgad29e2c">Django und MariaDB</h3>
|
|
|
|
<div class="figure">
|
|
<p><img src="pictures/django.png" alt="django.png" />
|
|
</p>
|
|
</div>
|
|
|
|
</section>
|
|
<section id="slide-org1558d6a">
|
|
<h3 id="org1558d6a">Kriterien</h3>
|
|
<ul>
|
|
<li>Freie Software</li>
|
|
<li>Cross Plattform nutzbar</li>
|
|
<li>Lesbarkeit des Codes</li>
|
|
<li>Einfachheit des Setups</li>
|
|
<li>Ohne spezielle Tools nutzbar</li>
|
|
<li>Vorkenntnisse Lernfaktor</li>
|
|
|
|
</ul>
|
|
|
|
</section>
|
|
<section id="slide-org5f3a98b">
|
|
<h3 id="org5f3a98b">Vergleich</h3>
|
|
<table border="2" cellspacing="0" cellpadding="6" rules="groups" frame="hsides">
|
|
|
|
|
|
<colgroup>
|
|
<col class="org-left" />
|
|
|
|
<col class="org-right" />
|
|
</colgroup>
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" class="org-left"><b>Variante</b></th>
|
|
<th scope="col" class="org-right"><b>Erreichte Punktzahl</b></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="org-left">ASP.NET und SQL Server</td>
|
|
<td class="org-right">141</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="org-left">PHP und MySQL</td>
|
|
<td class="org-right">161</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="org-left">Django und MariaDB</td>
|
|
<td class="org-right">196</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
</section>
|
|
<section id="slide-orgc44c2b6">
|
|
<h3 id="orgc44c2b6">Auswahl</h3>
|
|
|
|
</section>
|
|
</section>
|
|
<section>
|
|
<section id="slide-orga948954">
|
|
<h2 id="orga948954">Kosten</h2>
|
|
<div class="outline-text-2" id="text-orga948954">
|
|
</div>
|
|
</section>
|
|
<section id="slide-org3f79894">
|
|
<h3 id="org3f79894">Laravel Webshop</h3>
|
|
<table border="2" cellspacing="0" cellpadding="6" rules="groups" frame="hsides">
|
|
|
|
|
|
<colgroup>
|
|
<col class="org-left" />
|
|
|
|
<col class="org-left" />
|
|
</colgroup>
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" class="org-left">Sprache</th>
|
|
<th scope="col" class="org-left">Codezeilen</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="org-left">PHP</td>
|
|
<td class="org-left">8679</td>
|
|
</tr>
|
|
</tbody>
|
|
<tbody>
|
|
<tr>
|
|
<td class="org-left"><b>Total</b></td>
|
|
<td class="org-left"><b>8679</b></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
</section>
|
|
<section id="slide-org1f051d5">
|
|
<h3 id="org1f051d5">Django Webshop</h3>
|
|
<table border="2" cellspacing="0" cellpadding="6" rules="groups" frame="hsides">
|
|
|
|
|
|
<colgroup>
|
|
<col class="org-left" />
|
|
|
|
<col class="org-right" />
|
|
</colgroup>
|
|
<thead>
|
|
<tr>
|
|
<th scope="col" class="org-left">Sprache</th>
|
|
<th scope="col" class="org-right">Codezeilen</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="org-left">Python</td>
|
|
<td class="org-right">1460</td>
|
|
</tr>
|
|
|
|
<tr>
|
|
<td class="org-left">SQL</td>
|
|
<td class="org-right">4639</td>
|
|
</tr>
|
|
</tbody>
|
|
<tbody>
|
|
<tr>
|
|
<td class="org-left"><b>Total</b></td>
|
|
<td class="org-right"><b>6099</b></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
|
|
</section>
|
|
</section>
|
|
<section>
|
|
<section id="slide-orgaf951e8">
|
|
<h2 id="orgaf951e8">Vorgehen</h2>
|
|
<div class="outline-text-2" id="text-orgaf951e8">
|
|
</div>
|
|
</section>
|
|
<section id="slide-org400bc43">
|
|
<h3 id="org400bc43">Currencies - App</h3>
|
|
<ul>
|
|
<li>Wurde in Django als eigenen App entwickelt und sollte daher problemloos in</li>
|
|
|
|
</ul>
|
|
<p>
|
|
andere Applikationen eingebunden werden können.
|
|
</p>
|
|
|
|
<ul>
|
|
<li>Die Quelle der Währungen ist die Schweizerische Nationalbank mit der URL:</li>
|
|
|
|
</ul>
|
|
|
|
<p>
|
|
<a href="https://www.snb.ch">https://www.snb.ch</a> | resp:
|
|
<a href="https://www.snb.ch/selector/de/mmr/exfeed/rss">https://www.snb.ch/selector/de/mmr/exfeed/rss</a>
|
|
</p>
|
|
|
|
|
|
<div class="figure">
|
|
<p><img src="pictures/currencies-rss-reader.png" alt="currencies-rss-reader.png" width="80%" />
|
|
</p>
|
|
</div>
|
|
|
|
</section>
|
|
<section id="slide-org673f4a7">
|
|
<h3 id="org673f4a7">Currencies - Quelle</h3>
|
|
|
|
<div class="figure">
|
|
<p><img src="pictures/currencies-rss-xml.png" alt="currencies-rss-xml.png" width="80%" />
|
|
</p>
|
|
</div>
|
|
|
|
</section>
|
|
<section id="slide-orgb26303a">
|
|
<h3 id="orgb26303a">Currencies - Parsing</h3>
|
|
<ul>
|
|
<li>Das Konvertieren des XML’s wurde mit Python eigener Module gemacht.</li>
|
|
<li>für das Herunterladen des XML’s wurde das Modul ’urllib’ verwendet (1)</li>
|
|
<li>für das Parsen über die einzelnen items/nodes das Modul xml.etree.ElementTree. (2)</li>
|
|
|
|
</ul>
|
|
|
|
<p>
|
|
(1) <a href="https://docs.python.org/2/library/urllib.html">https://docs.python.org/2/library/urllib.html</a>
|
|
(2) <a href="https://docs.python.org/2/library/xml.etree.elementtree.html">https://docs.python.org/2/library/xml.etree.elementtree.html</a>
|
|
</p>
|
|
|
|
</section>
|
|
<section id="slide-orgb669e39">
|
|
<h3 id="orgb669e39">Currencies - Ablauf</h3>
|
|
|
|
<div class="figure">
|
|
<p><img src="pictures/currencies.png" alt="currencies.png" width="55%" />
|
|
</p>
|
|
</div>
|
|
|
|
</section>
|
|
<section id="slide-org8e5d19b">
|
|
<h3 id="org8e5d19b">Infrastruktur</h3>
|
|
<p>
|
|
Andreas erzählt wie die infrastruktur aufgebaut ist.
|
|
</p>
|
|
|
|
|
|
<div class="figure">
|
|
<p><img src="pictures/Server-Architecture.png" alt="Server-Architecture.png" width="60%" />
|
|
</p>
|
|
</div>
|
|
|
|
</section>
|
|
<section id="slide-orgc0f9048">
|
|
<h3 id="orgc0f9048">Programmierung</h3>
|
|
<p>
|
|
vieleicht zwei Schwierigkeiten
|
|
</p>
|
|
|
|
</section>
|
|
<section id="slide-org712ea4d">
|
|
<h3 id="org712ea4d">Programmierung - Hürde #1</h3>
|
|
<ul>
|
|
<li>Django hat ein modul das die Forms speziell handelt so dass man mit wehnig Code</li>
|
|
|
|
</ul>
|
|
<p>
|
|
Einen HTML Button oder ein Feld erzeugen kann.
|
|
</p>
|
|
<ul>
|
|
<li>Die schwierigkeit war nun heraus zu finden wie man dem Feld ein von der DB stammenden</li>
|
|
|
|
</ul>
|
|
<p>
|
|
default wert mitgeben konnte.
|
|
</p>
|
|
<ul>
|
|
<li>Es stellte sich heraus dass das Feld ein Key: Value paar benötigte um zu wissen wohin es</li>
|
|
|
|
</ul>
|
|
<p>
|
|
den wert schreiben soll….
|
|
</p>
|
|
|
|
<p>
|
|
Note: hier den code higlighter einfügen:
|
|
amount_form = CartForm(
|
|
initial={’amount_form’: cart_position.amount}
|
|
)
|
|
</p>
|
|
|
|
</section>
|
|
</section>
|
|
<section>
|
|
<section id="slide-orgcdd82b2">
|
|
<h2 id="orgcdd82b2">Fazit</h2>
|
|
<p>
|
|
special thanks to:
|
|
</p>
|
|
<ul>
|
|
<li>draw.io,</li>
|
|
<li>Python,</li>
|
|
<li>Django,</li>
|
|
<li>stackexchange and</li>
|
|
<li>Beer.</li>
|
|
|
|
</ul>
|
|
</section>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
<script src="https://cdn.jsdelivr.net/reveal.js/3.0.0/lib/js/head.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/reveal.js/3.0.0/js/reveal.js"></script>
|
|
|
|
<script>
|
|
// Full list of configuration options available here:
|
|
// https://github.com/hakimel/reveal.js#configuration
|
|
Reveal.initialize({
|
|
|
|
controls: true,
|
|
progress: true,
|
|
history: false,
|
|
center: true,
|
|
slideNumber: 'c',
|
|
rollingLinks: false,
|
|
keyboard: true,
|
|
overview: true,
|
|
|
|
theme: Reveal.getQueryHash().theme, // available themes are in /css/theme
|
|
transition: Reveal.getQueryHash().transition || 'linear', // default/cube/page/concave/zoom/linear/fade/none
|
|
transitionSpeed: 'default',
|
|
multiplex: {
|
|
secret: '', // null if client
|
|
id: '', // id, obtained from socket.io server
|
|
url: '' // Location of socket.io server
|
|
},
|
|
|
|
// Optional libraries used to extend on reveal.js
|
|
dependencies: [
|
|
{ src: 'https://cdn.jsdelivr.net/reveal.js/3.0.0/lib/js/classList.js', condition: function() { return !document.body.classList; } },
|
|
{ src: 'https://cdn.jsdelivr.net/reveal.js/3.0.0/plugin/markdown/marked.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
|
|
{ src: 'https://cdn.jsdelivr.net/reveal.js/3.0.0/plugin/markdown/markdown.js', condition: function() { return !!document.querySelector( '[data-markdown]' ); } },
|
|
{ src: 'https://cdn.jsdelivr.net/reveal.js/3.0.0/plugin/zoom-js/zoom.js', async: true, condition: function() { return !!document.body.classList; } },
|
|
{ src: 'https://cdn.jsdelivr.net/reveal.js/3.0.0/plugin/notes/notes.js', async: true, condition: function() { return !!document.body.classList; } }]
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|