added design, and git chapter

2020-04-23 18:48:28 +00:00
parent 3f5e3193a3
commit 9751bbde0f
7 changed files with 131 additions and 8 deletions
--- a/HowToStart/1_6_fet_design_assets.md
+++ b/HowToStart/1_6_fet_design_assets.md
@@ -0,0 +1,94 @@
+title: "1.6. Design & Templates"
+
+In diesem Abschnitt wird die Konfiguration vorgenommen um das gemeinsame css und js zu nutzen.
+
+
+## Jinja 2 Templates hinzufügen
+In einem ersten Schritt wird ein lokaler Ordner erstellt. 
+Um Jinja2 Templates zu nutzen. und in *settings.py* referenziert
+
+    :::python
+    TEMPLATES = [ ...
+    {
+        'BACKEND': 'django.template.backends.jinja2.Jinja2',
+        'DIRS': [os.path.join(BASE_DIR, 'templates')],
+        'APP_DIRS': True,
+        'OPTIONS': {'environment': 'jinja2.Environment',}, 
+    }
+
+## Static Files (Css und js)
+Sobald wir ein gemeinsames Template festgelegt haben kann dieses dann auf die gleiche Weise genutzt werden.
+Jetzt werden die gemeinsamen Static Files hinzugefügt
+settings.py:
+
+    :::python
+    STATIC_URL = '/assets/'
+
+    STATICFILES_DIRS = [
+        os.path.join(BASE_DIR, "static"),
+        '/srv/static/design1/',
+    ]
+
+## Layout bis wir ein gemeinsames haben
+Jetzt kann testweise ein Layout erstellt werden:
+
+layout.html
+
+    :::jinja2
+
+    {% load static %}
+    <!doctype html>
+    <html class="no-js" lang="en">
+    <head>
+        <meta charset="utf-8" />
+        <meta http-equiv="x-ua-compatible" content="ie=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1.0">
+        <title>FET Layout</title>
+        <link rel="stylesheet" href="{% static 'app.css' %}">
+        {% block header %}
+        {% endblock %}
+    </head>
+    <body>
+    <div class="top-bar">
+        <div class="top-bar-left">
+            <ul class="menu">
+                <li><a href="">Home</a></li>
+                <li><a href="article.html">Article</a></li>
+            </ul>
+        </div>
+    </div>
+    
+    {% block content %}
+    {% endblock %}
+    
+    <script src="{%static 'app.js' %}"></script>
+    </body>
+    </html>
+
+
+Ein einfaches Home / Hello World Template schaut dann so aus:
+
+    :::jinja2
+    {% extends 'layout.html' %}
+    {% block content %}
+    Hello World
+    {% endblock %}
+
+
+Damit kann eine einfache views.py Datei erstellt werden:
+
+    :::python
+    from django.shortcuts import render
+    from django.http import HttpResponse
+    def index(request):
+        return render(request, 'home.html')
+
+und dieser View in der urls.py eingetragen werden:
+
+    :::python
+    from django.contrib import admin
+    from django.urls import path, include
+    from . import views
+    urlpatterns = [
+        path('', views.index, name='home')
+    ]