416 lines
10 KiB
HTML
416 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-15 Don 20:15</p>
|
|
</section>
|
|
<section id="table-of-contents">
|
|
<nav id="table-of-contents">
|
|
<h2>Inhaltsverzeichnis</h2>
|
|
<div id="text-table-of-contents">
|
|
<ul>
|
|
<li><a href="#/slide-org0f71c24">Ausgangslage</a></li>
|
|
<li><a href="#/slide-orge3853ca">Varianten</a></li>
|
|
<li><a href="#/slide-orgb11a01d">Kosten</a></li>
|
|
<li><a href="#/slide-orgbe93713">Vorgehen</a></li>
|
|
<li><a href="#/slide-orga59389e">Fazit</a></li>
|
|
<li><a href="#/slide-org91ba029">Besten Dank für die Aufmerksahmkeit.</a></li>
|
|
</ul>
|
|
</div>
|
|
</nav>
|
|
</section>
|
|
|
|
<section>
|
|
<section id="slide-org0f71c24">
|
|
<h2 id="org0f71c24">Ausgangslage</h2>
|
|
<ul>
|
|
<li>Webshop erstellen</li>
|
|
<li>Währungsumrechnung CHF zu …</li>
|
|
<li>Freie Software in Bezug auf Open-Source Code.</li>
|
|
|
|
</ul>
|
|
|
|
</section>
|
|
<section id="slide-org738f086">
|
|
<h3 id="org738f086">Vision</h3>
|
|
<p>
|
|
Die Vision wurde anhand eines Mindmaps erstmals grob umfasst:
|
|
</p>
|
|
|
|
|
|
<figure>
|
|
<img src="pictures/webshop.png" alt="webshop.png" width="70%">
|
|
|
|
</figure>
|
|
|
|
</section>
|
|
<section id="slide-org33b5046">
|
|
<h3 id="org33b5046">Vision - Artikel</h3>
|
|
|
|
<figure>
|
|
<img src="pictures/Vision-Artikel.png" alt="Vision-Artikel.png" width="80%">
|
|
|
|
</figure>
|
|
|
|
</section>
|
|
<section id="slide-org2ac788f">
|
|
<h3 id="org2ac788f">Vision - Warenkorb</h3>
|
|
|
|
<figure>
|
|
<img src="pictures/Vision-Warenkorb.png" alt="Vision-Warenkorb.png" width="80%">
|
|
|
|
</figure>
|
|
|
|
</section>
|
|
</section>
|
|
<section>
|
|
<section id="slide-orge3853ca">
|
|
<h2 id="orge3853ca">Varianten</h2>
|
|
<div class="outline-text-2" id="text-orge3853ca">
|
|
</div>
|
|
</section>
|
|
<section id="slide-orge2cc8a6">
|
|
<h3 id="orge2cc8a6">ASP.NET (C#) und SQL Server</h3>
|
|
|
|
<figure>
|
|
<img src="pictures/csharp.png" alt="csharp.png">
|
|
|
|
</figure>
|
|
|
|
</section>
|
|
<section id="slide-org245214c">
|
|
<h3 id="org245214c">Laravel (PHP) und MySQL</h3>
|
|
|
|
<figure>
|
|
<img src="pictures/laravel.png" alt="laravel.png">
|
|
|
|
</figure>
|
|
|
|
</section>
|
|
<section id="slide-org43bc035">
|
|
<h3 id="org43bc035">Django und MariaDB</h3>
|
|
|
|
<figure>
|
|
<img src="pictures/django.png" alt="django.png">
|
|
|
|
</figure>
|
|
|
|
</section>
|
|
<section id="slide-orgeac1f25">
|
|
<h3 id="orgeac1f25">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 und Lernfaktor</li>
|
|
|
|
</ul>
|
|
|
|
</section>
|
|
<section id="slide-org4a820d7">
|
|
<h3 id="org4a820d7">Vergleich</h3>
|
|
<table>
|
|
|
|
|
|
<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 von 235</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">Laravel 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>
|
|
<section>
|
|
<section id="slide-orgb11a01d">
|
|
<h2 id="orgb11a01d">Kosten</h2>
|
|
<div class="outline-text-2" id="text-orgb11a01d">
|
|
</div>
|
|
</section>
|
|
<section id="slide-orgaca6dec">
|
|
<h3 id="orgaca6dec">Tools</h3>
|
|
<ul>
|
|
<li>Ausgaben während der Case-Study: 0.00 CHF</li>
|
|
<li>100% freie Software</li>
|
|
<li>„Let’s Encrypt“ für SSL</li>
|
|
<li>„freenom.com“ für Domain</li>
|
|
|
|
</ul>
|
|
|
|
</section>
|
|
<section id="slide-orgec42fba">
|
|
<h3 id="orgec42fba">Laravel Webshop</h3>
|
|
<table>
|
|
|
|
|
|
<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-org72d1792">
|
|
<h3 id="org72d1792">Django Webshop</h3>
|
|
<table>
|
|
|
|
|
|
<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-orgbe93713">
|
|
<h2 id="orgbe93713">Vorgehen</h2>
|
|
<div class="outline-text-2" id="text-orgbe93713">
|
|
</div>
|
|
</section>
|
|
<section id="slide-org9165b64">
|
|
<h3 id="org9165b64">Currencies - App</h3>
|
|
<ul>
|
|
<li>Wurde in Django als eigenen App entwickelt und sollte daher problemlos in andere Applikationen eingebunden werden können.</li>
|
|
<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>
|
|
</p>
|
|
|
|
<p>
|
|
<a href="https://www.snb.ch/selector/de/mmr/exfeed/rss">https://www.snb.ch/selector/de/mmr/exfeed/rss</a>
|
|
</p>
|
|
|
|
|
|
<figure>
|
|
<img src="pictures/currencies-rss-reader.png" alt="currencies-rss-reader.png" width="80%">
|
|
|
|
</figure>
|
|
|
|
</section>
|
|
<section id="slide-org4772424">
|
|
<h3 id="org4772424">Currencies - Quelle</h3>
|
|
|
|
<figure>
|
|
<img src="pictures/currencies-rss-xml.png" alt="currencies-rss-xml.png">
|
|
|
|
</figure>
|
|
|
|
</section>
|
|
<section id="slide-org62d3d0e">
|
|
<h3 id="org62d3d0e">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>
|
|
</p>
|
|
|
|
<p>
|
|
(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-orgb4b2b05">
|
|
<h3 id="orgb4b2b05">Currencies - Ablauf</h3>
|
|
|
|
<figure>
|
|
<img src="pictures/currencies.png" alt="currencies.png" width="55%">
|
|
|
|
</figure>
|
|
|
|
</section>
|
|
<section id="slide-org296197d">
|
|
<h3 id="org296197d">Infrastruktur</h3>
|
|
<aside class="notes">
|
|
<p>
|
|
Andreas erzählt wie die infrastruktur aufgebaut ist.
|
|
</p>
|
|
|
|
</aside>
|
|
|
|
|
|
<figure>
|
|
<img src="pictures/Server-Architecture.png" alt="Server-Architecture.png" width="90%">
|
|
|
|
</figure>
|
|
|
|
</section>
|
|
<section id="slide-orgab1a750">
|
|
<h3 id="orgab1a750">Programmierung</h3>
|
|
|
|
<figure>
|
|
<img src="pictures/form.png" alt="form.png" width="60%">
|
|
|
|
</figure>
|
|
|
|
<div class="org-src-container">
|
|
|
|
<pre class="src src-python"><span style="color: #657b83; background-color: #fdf6e3;">amount_form</span> = CartForm<span style="color: #268bd2;">(</span>
|
|
<span style="color: #93a1a1; background-color: #eee8d5;"> </span> <span style="color: #657b83; background-color: #fdf6e3;">initial</span>=<span style="color: #2aa198;">{</span><span style="color: #2aa198;">'amount_form'</span>: cart_position.amount<span style="color: #2aa198;">}</span>
|
|
<span style="color: #268bd2;">)</span>
|
|
</pre>
|
|
</div>
|
|
|
|
|
|
</section>
|
|
</section>
|
|
<section>
|
|
<section id="slide-orga59389e">
|
|
<h2 id="orga59389e">Fazit</h2>
|
|
<ul>
|
|
<li>Trotz Model View Controll, SQL unerlässlich.</li>
|
|
<li>Vagrant (up, suspend, provision, destroy)</li>
|
|
<li>Git, Python/Django, JS brauchts trotzdem.</li>
|
|
|
|
</ul>
|
|
|
|
</section>
|
|
</section>
|
|
<section>
|
|
<section id="slide-org91ba029">
|
|
<h2 id="org91ba029">Besten Dank für die Aufmerksahmkeit.</h2>
|
|
<p>
|
|
Ivan & Andreas
|
|
</p>
|
|
</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>
|