Skip to content

GitLab

Commit beb1e735 authored by cipo7741's avatar cipo7741
Browse files

enhances README.txt and introduces static-content

parent 87a3f437
Expand all Hide whitespace changes
Inline Side-by-side
.gitignore
View file @ beb1e735
output
\ No newline at end of file
README.md
View file @ beb1e735
You wanna change something on the website?
# Website des FSR-Bioinformatik
1. Change the `templates` and rebuild it, so we are able to quickly change the menu. (e.g. if you wanna change the menu, look into `templates/layout/template-header.html`.)
2. Run `python build-jinja2-html.py`. (Added a new template? add it to the script!)
2. Look at the result in `output/`
3. Finally upload content of `output` to server.
Dieses Repository kann zum generieren der *Website des FSR-Bioinformatik* genutzt werden.
Es enthält ein Python-Skript ([Python 3](https://www.python.org/)), dass aus Website-Templates ([Jinja2](https://jinja.palletsprojects.com)) die 4 Hauptseiten des FSR-Bioinformatik generiert (index.html, fsr.html, schueler.html und student.html).
Tipp: run `python build-jinja2-html.py -h`
Website des FSR-Bioinformatik: http://fsrbioinfo.fmi.uni-jena.de
Beware: the templates are no valid html documents!
Dieses Repository: https://gitlab.bau-ha.us/Miau/fsr-bioinfo-website
Fragen gerne an csi.log@mailbox.org oder fsr.bioinformatik@uni-jena.de.
## Templates
Die Templates sind mit Jinja2 umgesetzt.
Die Templates (im Ordner `templates`) sind in 3 Kategorien unterteilt:
1. die Haupt-Templates direkt in `templates` strukturieren nur die Reihenfolge ihres Inhaltes. Spannend wird es, wenn man
2. den Header oder Footer ändern will (`templates/layout`) oder
3. den Inhalt der Abschnitte auf der Website (`templates/content`).
### templates/content
Alle Abschnitte fangen mit `h2` an. Der Template-Name sollte auf diesen Titel schließen lassen.
Der Sitzungstermin findet sich in `templates\content\template-kontakt.html`.
### Jinja2
Das wichtigste ist die Ersetzung von Textstellen in geschweiften Klammern (e.g. `{% include "templates/content/template-kontakt.html"%}`).
Aber auch Variablen können genutzt werden um variablen Inhalt zu generieren.
e.g. `templates/layout/template-header.html`
`{% if stet %}
<p>und Ersties</p>
{% endif %}`
## Python-Skript
Dieses Python-Skript (Python 3) fügt die Jinja2-Templates unter `templates` zusammen.
Es läuft auf einem Terminal einfach mit
python build-jinja2-html.py
Es enthält verschiedene Optionen, die gelistet werden können.
python build-jinja2-html.py -h
usage: build-jinja2-html.py [-h] [-r ROOT] [-t TEMPLATES] [-o OUTPUT] [-s]
Skript, das die FSR-Bioinformatik-Website baut.
optional arguments:
-h, --help show this help message and exit
-r ROOT, --root ROOT Wurzel-HTML-File auf dem alles aufbaut
(default="./templates/layout/template-site.html)
-t TEMPLATES, --templates TEMPLATES
Ordner mit template HTML-Files (default="templates/")
-o OUTPUT, --output OUTPUT
Ordner mit generierten HTML-Files, die dann auf den
Server kopiert werden können (default="output/")
-s, --stet Füge Informationen über die SeET zur Website
Um eine neue Hauptseite zu erstellen, muss das Skript geändert werden.
## Output
Die generierte Website liegt unter `output`, wenn nicht anders definiert (siehe Python-Skript Option `-o`).
Wenn man in diesen Ordner wechselt und einen lokalen Server anwirft, kann man die generierte Website betrachten.
python -m http.server
Dieser Inhalt muss anschließend auf den Webspace der Universität Jena kopiert oder verschoben werden um anschließend auf http://fsrbioinfo.fmi.uni-jena.de angezeigt zu werden.
Änderungen im Output-Ordner werden durch ausführen des Python-Skripts überschrieben. Um diese Arbeit zu verhindern existiert der Output-Ordner nicht im Repository. Er wird erst erzeugt, wenn das Skript zum ersten Mal lokal ausführt wird.
## CSS
Cascading style sheets finden sich unter `static-content/styles`.
### fsr-people-style.css
Hier ist ein wenig Disziplin gefragt. Am besten man oeffnet `templates/content/template-mitglieder.html` parallel zu `static-content/styles/fsr-people-style.css`. Jetzt kann man im css erkennen, welche Leute welchen Nummern entsprächen (e.g. JohannesMeyer.png entspricht p18).
#p18.pic {
background: url(../images/fotos/people/JohannesMeyer.png) no-repeat;
background-size: 240px 240px;
}
Im html-Template erkennt man, welches div die Nummer dieser Person trägt und kann den Text anpassen (e.g. Johannes Meyer mit p18 ist *gewähltes Mitglied von 2016 bis 2019*).
<div class="pic" id="p18">
<div class="text">
<p>gewähltes Mitglied von 2016 bis 2019</p>
</div>
</div>
### mainstyle
Dieses cascading style sheet hat 3 Abschnitte: allgemein, Desktop-Ansicht und mobile Ansicht. Die Desktop-Ansicht umfasst den Inhalt der geschweiften Klammern nach dem Statement `@media screen and (max-width: 900px).`
#### Mobile Ansicht
@media screen and (min-width: 900px) {
... mobile style definitions ...
}
#### Farbschema
gruen #006100
gelb #FFA41B
hell-grau #f9f9f9
#### Kacheln aka tiles
Werden so breit, wie für den Inhalt benötigt, daher können mehrere Nebeneinander auftauchen (siehe [http://fsrbioinfo.fmi.uni-jena.de/fsr.html#termin](http://fsrbioinfo.fmi.uni-jena.de/fsr.html#termin)). Diese sind durch ihre Hintergrundfarbe hervorgehoben (#f9f9f9).
output/fsr.html deleted 100644 → 0
View file @ 87a3f437
This diff is collapsed.
output/index.html deleted 100644 → 0
View file @ 87a3f437
<!-- This file was generated: please check https://gitlab.bau-ha.us/Miau/fsr-bioinfo-website --><!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="language" content="de" />
<meta name="description" content="Hompage des Fachschaftsrates für Bioinformatik">
<meta name="keywords" content="Bioinformatik, Fachschftsrat, Jena, FSU">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Fachschaftsrat Bioinformatik Jena</title>
<link rel="icon" href="images/logo.png">
<link rel="stylesheet" type="text/css" href="styles/mainstyle.css">
<script type="text/javascript" src="scripts/fsr.js"></script>
</head>
<body>
<header>
<div id="fsr-logo">
<a href="index.html">
<img alt="FSR Logo" src="images/bioinfo-fsr-logo.png">
</a>
</div>
<div id="uni-logo">
<a href="http://www.uni-jena.de/">
<img alt="Universität" src="images/banner/uni.gif">
</a>
</div>
<div id="fsr-mail">
<img alt="mail" src="images/mail.png">
</div>
<nav>
<div class="internal">
<ul>
<li class="dropdown">
<a href="schueler.html" class="dropbtn">
<img alt="Schülerinnen und Schüler" src="images/icons/schueler-rocket-green.png" class="default">
<img alt="FSR" src="images/icons/schueler-rocket-yellow.png" class="hide">
<p>Interessierte</p>
</a>
<div class="dropdown-content">
<a href="schueler.html#was">Was ist Bioinformatik?</a>
<a href="schueler.html#links">Nützliche Links</a>
<a class="external" href="http://schuelerweb.bioinf.uni-jena.de/">Schülerweb</a>
</div>
</li>
<li class="dropdown">
<a href="student.html" class="dropbtn">
<img alt="Studierende" src="images/icons/student-laptop-logo-green.png" class="default">
<img alt="FSR" src="images/icons/student-laptop-logo-yellow.png" class="hide">
<p>Studierende</p>
</a>
<div class="dropdown-content">
<a href="index.html#kalender">Kalender</a>
<a href="student.html#links">Linksammlung</a>
<a href="student.html#mail-verteiler">Newsletter</a>
<a href="student.html#lehre">Lehrstühle</a>
<a href="student.html#faq">FAQ</a>
<a class="external" href="http://pruefprot.minet.uni-jena.de/">Übungsklausuren</a>
<a class="external" href="https://cloud.fsrkom.uni-jena.de/index.php/s/DP2xeqrQylLApIJ">FSR-Cloud</a>
</div>
</li>
<li class="dropdown">
<a href="fsr.html" class="dropbtn">
<img alt="FSR" src="images/icons/fsr-laptop-tools-green.png" class="default">
<img alt="FSR" src="images/icons/fsr-laptop-tools-yellow.png" class="hide">
<p>Engagierte</p>
</a>
<div class="dropdown-content">
<a href="fsr.html#termin">Kontakt</a>
<a href="fsr.html#mitglieder">Mitglieder</a>
<a class="external" href="https://fsrmathe.fmi.uni-jena.de/DokuWiki/doku.php">Wiki (FSR only)</a>
<a class="external" href="https://cloud.fsrkom.uni-jena.de/index.php/s/DW6mwKjPHvp3iej">Protokolle</a>
<a href="Satzung.pdf">Satzung (PDF)</a>
<a href="fsr.html#impressum">Impressum</a>
<a href="fsr.html#privacy">Datenschutzerklärung</a>
</div>
</li>
</ul>
</div>
<div class="extra">
<ul>
<li>
<div>
<a href="index.html#kalender" class="dropbtn">
<img alt="Kalender" src="images/icons/calendar-green.png" class="default">
<img alt="Kalender" src="images/icons/calendar-yellow.png" class="hide">
<p>Kalender</p>
</a>
</div>
</li>
<li>
<div>
<a href="student.html#mail-verteiler" class="dropbtn">
<img alt="Newsletter" src="images/icons/letter-closed.png" class="default">
<img alt="Newsletter" src="images/icons/letter-open.png" class="hide">
<p>Newsletter</p>
</a>
</div>
</li>
<li>
<div>
<a href="https://cloud.fsrkom.uni-jena.de/index.php/s/DW6mwKjPHvp3iej" class="dropbtn">
<img alt="Protokolle" src="images/icons/protokoll-green.png" class="default">
<img alt="Protokolle" src="images/icons/protokoll-green-yellow.png" class="hide">
<p>Protokolle</p>
</a>
</div>
</li>
</ul>
</div>
</nav>
</header>
<main>
<section>
<h2 id="herzlich-willkommen">Herzlich Willkommen</h2>
<p>... auf der Seite des Fachschaftsrates (FSR) der Bioinformatik in Jena.</p>
<p>Hier könnt ihr alle Informationen rund um den FSR Bioinformatik sowie über das Studium der Bioinformatik finden. Der FSR steht euch für alle Fragen offen, scheut euch nicht uns direkt zu kontaktieren. Wenn ihr regelmäßig über unsere Veranstaltungen informiert werden wollt, tragt euch in einen unserer <a href="http://www1.uni-jena.de/fsrbioinformatik/student.html#main-verteiler">Mailverteiler</a> ein.</p>
<p>Infos zum Forschungsgebiet Bioinformatik und zum Studium findet ihr auf den Unterseiten <a href="http://www1.uni-jena.de/fsrbioinformatik/schueler.html">Interessierte</a> und <a href="http://www1.uni-jena.de/fsrbioinformatik/student.html">Studierende</a>.</p>
<p>Viel Spaß beim Stöbern auf unserer Homepage.</p>
<p><em>Euer FSR Bioinformatik</em></p>
</section>
<section>
<a href="https://calendar.google.com/calendar/embed?src=bioinfojena%40arcor.de&ctz=Europe%2FBerlin"><h3 id="kalender">Unsere nächsten Veranstaltungen:</h3></a>
<iframe src="https://calendar.google.com/calendar/embed?mode=AGENDA&amp;src=bioinfojena%40arcor.de&ctz=Europe%2FBerlin" style="border: 0" width="100%" height="600" frameborder="0" scrolling="no"></iframe>
</section>
<!--<div class ="wichtig">
<p>Für Erstsemester gibt es <a href="schueler.html#stet">hier</a> Informationen. Wichtig ist es, sich für Vorkurse <a href="http://www.fmi.uni-jena.de/Mitteilungen/Jetzt+f%C3%BCr+Vorkurse+anmelden%21.html">anzumelden</a>.</p>
</div> -->
</main>
<footer>
<a href="kontakt.html#impressum">
&copy; Fachschaftsrat Bioinformatik
<script type="text/javascript">
document.write(new Date().getFullYear());
</script>
</a>
</footer>
</body>
</html>
\ No newline at end of file
output/schueler.html deleted 100644 → 0
View file @ 87a3f437
<!-- This file was generated: please check https://gitlab.bau-ha.us/Miau/fsr-bioinfo-website --><!DOCTYPE html>
<html lang="de">
<head>
<meta charset="utf-8">
<meta name="language" content="de" />
<meta name="description" content="Hompage des Fachschaftsrates für Bioinformatik">
<meta name="keywords" content="Bioinformatik, Fachschftsrat, Jena, FSU">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Fachschaftsrat Bioinformatik Jena</title>
<link rel="icon" href="images/logo.png">
<link rel="stylesheet" type="text/css" href="styles/mainstyle.css">
<script type="text/javascript" src="scripts/fsr.js"></script>
</head>
<body>
<header>
<div id="fsr-logo">
<a href="index.html">
<img alt="FSR Logo" src="images/bioinfo-fsr-logo.png">
</a>
</div>
<div id="uni-logo">
<a href="http://www.uni-jena.de/">
<img alt="Universität" src="images/banner/uni.gif">
</a>
</div>
<div id="fsr-mail">
<img alt="mail" src="images/mail.png">
</div>
<nav>
<div class="internal">
<ul>
<li class="dropdown">
<a href="schueler.html" class="dropbtn">
<img alt="Schülerinnen und Schüler" src="images/icons/schueler-rocket-green.png" class="default">
<img alt="FSR" src="images/icons/schueler-rocket-yellow.png" class="hide">
<p>Interessierte</p>
</a>
<div class="dropdown-content">
<a href="schueler.html#was">Was ist Bioinformatik?</a>
<a href="schueler.html#links">Nützliche Links</a>
<a class="external" href="http://schuelerweb.bioinf.uni-jena.de/">Schülerweb</a>
</div>
</li>
<li class="dropdown">
<a href="student.html" class="dropbtn">
<img alt="Studierende" src="images/icons/student-laptop-logo-green.png" class="default">
<img alt="FSR" src="images/icons/student-laptop-logo-yellow.png" class="hide">
<p>Studierende</p>
</a>
<div class="dropdown-content">
<a href="index.html#kalender">Kalender</a>
<a href="student.html#links">Linksammlung</a>
<a href="student.html#mail-verteiler">Newsletter</a>
<a href="student.html#lehre">Lehrstühle</a>
<a href="student.html#faq">FAQ</a>
<a class="external" href="http://pruefprot.minet.uni-jena.de/">Übungsklausuren</a>
<a class="external" href="https://cloud.fsrkom.uni-jena.de/index.php/s/DP2xeqrQylLApIJ">FSR-Cloud</a>
</div>
</li>
<li class="dropdown">
<a href="fsr.html" class="dropbtn">
<img alt="FSR" src="images/icons/fsr-laptop-tools-green.png" class="default">
<img alt="FSR" src="images/icons/fsr-laptop-tools-yellow.png" class="hide">
<p>Engagierte</p>
</a>
<div class="dropdown-content">
<a href="fsr.html#termin">Kontakt</a>
<a href="fsr.html#mitglieder">Mitglieder</a>
<a class="external" href="https://fsrmathe.fmi.uni-jena.de/DokuWiki/doku.php">Wiki (FSR only)</a>
<a class="external" href="https://cloud.fsrkom.uni-jena.de/index.php/s/DW6mwKjPHvp3iej">Protokolle</a>
<a href="Satzung.pdf">Satzung (PDF)</a>
<a href="fsr.html#impressum">Impressum</a>
<a href="fsr.html#privacy">Datenschutzerklärung</a>
</div>
</li>
</ul>
</div>
<div class="extra">
<ul>
<li>
<div>
<a href="index.html#kalender" class="dropbtn">
<img alt="Kalender" src="images/icons/calendar-green.png" class="default">
<img alt="Kalender" src="images/icons/calendar-yellow.png" class="hide">
<p>Kalender</p>
</a>
</div>
</li>
<li>
<div>
<a href="student.html#mail-verteiler" class="dropbtn">
<img alt="Newsletter" src="images/icons/letter-closed.png" class="default">
<img alt="Newsletter" src="images/icons/letter-open.png" class="hide">
<p>Newsletter</p>
</a>
</div>
</li>
<li>
<div>
<a href="https://cloud.fsrkom.uni-jena.de/index.php/s/DW6mwKjPHvp3iej" class="dropbtn">
<img alt="Protokolle" src="images/icons/protokoll-green.png" class="default">
<img alt="Protokolle" src="images/icons/protokoll-green-yellow.png" class="hide">
<p>Protokolle</p>
</a>
</div>
</li>
</ul>
</div>
</nav>
</header>
<main>
<section>
<a href="http://schuelerweb.bioinf.uni-jena.de/"><img alt="Infobanner mit Link zur Bioinformatik in Jena" class="banner" src="images/banner/infobanner.png"></a>
<h2 id="was">Über das Fach Bioinformatik an der Friedrich-Schiller-Universität Jena</h2>
<p>
Die <a href="https://de.wikipedia.org/wiki/Bioinformatik">Bioinformatik</a> ist ein relativ junges Forschungsgebiet im Bereich der Naturwissenschaften. Sie beschäftigt sich mit der computergestützten Analyse biologischer, chemischer und medizinischer Daten. Beispiele für diese Daten sind Hochdurchsatzverfahren zur
<a href="https://de.wikipedia.org/wiki/DNA-Sequenzierung">DNA- und RNA-Sequenzierung</a>,
<a href="https://de.wikipedia.org/wiki/Massenspektrometrie">Massenspektrometrie</a> oder
<a href="https://de.wikipedia.org/wiki/Fluoreszenzmikroskopie">Mikroskopie</a>. Außerdem entwickelt die Bioinformatik neue
<a href="https://de.wikipedia.org/wiki/Algorithmus">Algorithmen</a> für ebendiese Analysen. Die daraus resultierenden automatisierten Verfahren ermöglichen eine schnelle und objektive Auswertung im Vergleich zur manuellen Analyse.
</p>
<p>
Im Februar 2001 wurde die Sequenz des menschlichen Genoms veröffentlicht. Die Bioinformatik hatte daran den größten Forschungsanteil. Doch die Sequenzierung des menschlichen Genoms war nur der erste Schritt zu dessen Entschlüsselung. Mit Hilfe bioinformatischer Methoden ist es möglich, Gene am Computer vorherzusagen und deren Aktivität im Rahmen von Krankheiten zu analysieren. Versteht man die Funktion der Gene, kann man dieses Wissen z.B. für die Entwicklung neuer Medikamente nutzen.
</p>
<p>
Folgende wichtige Forschungsgebiete gibt es in der Bioinformatik:
</p>
<ul>
<li>in der Vergangenheit: die Sequenzierung des menschlichen Genoms (
<a href="https://de.wikipedia.org/wiki/Humangenomprojekt">Humangenomprojekt</a>,
<a href="https://de.wikipedia.org/wiki/1000-Genome-Projekt">1000-Genome-Projekt</a>)</li>
<li>Sequenzierung der Genome anderer Lebenwesen</li>
<li>Suche nach Genen in Genomen und die Vorhersage ihrer Funktion (
<a href="https://de.wikipedia.org/wiki/RNA-Seq">RNA-Seq</a>)</li>
<li><a href="https://de.wikipedia.org/wiki/Proteinstrukturvorhersage">Proteinstrukturvorhersage</a></li>
<li><a href="https://de.wikipedia.org/wiki/Massenspektrometrie">Massenspektrometrie</a></li>
<li>RNA-Strukturvorhersage und die Vorhersage ihrer Funktion</li>
<li><a href="https://de.wikipedia.org/wiki/Systembiologie">Systembiologie</a></li>
<li>Simulation von metabolischen und regulatorischen Netzwerken (
<a href="https://de.wikipedia.org/wiki/Stoffwechsel">Metabolismus</a>)</li>
<li><a href="https://de.wikipedia.org/wiki/Phylogenetik">phylogenetische Verwandtschaftsaufklärung</a></li>
<li>Auswertung von Sensordaten im Bereich der Robotik,
<a href="https://de.wikipedia.org/wiki/Mustererkennung">Mustererkennung</a>, künstlichen Intelligenz und Mikroskopie (
<a href="https://de.wikipedia.org/wiki/Bildverarbeitung">Bildverarbeitung</a>,
<a href="https://en.wikipedia.org/wiki/Medical_image_computing">Medical Image Computing</a>)</li>
</ul>
<p>
Der Studiengang Bioinformatik setzt sich zusammen aus
<a href="https://de.wikipedia.org/wiki/Molekularbiologie">Molekularbiologie</a>,
<a href="https://de.wikipedia.org/wiki/Biochemie">Biochemie</a>,
<a href="https://de.wikipedia.org/wiki/Genetik">Genetik</a>, theoretischer und praktischer <a href="https://de.wikipedia.org/wiki/Informatik">Informatik</a>, sowie mathematischen Grundlagen. <i>Biologie und Informatik sind in Jena zu gleichen Teilen im Studium vertreten.</i> Näheres zum Aufbau des Studiums (insbesondere zum Bachelor-Studium) findet ihr auf den Seiten der
<a href="http://bioinformatik.uni-jena.de/studium/aufbau-des-studiums/">Bioinformatik in Jena</a> und der <a href="https://www3.uni-jena.de/Studium/Studienangebot/BSc_Bioinformatik.html">Uni Jena</a>.
</p>
<p>
Wenn man ein Studium der Bioinformatik anstrebt, sollte man sowohl Interessen an der Biologie als auch an der Informatik besitzen. Desweiteren sind Grundlagen in der Mathematik erforderlich. Da sich das Gebiet der Bioinformatik im Wachstum befindet, sind die Chancen auf dem Arbeitsmarkt sehr gut. Zudem können Bioinformatiker auch im Bereich der Informatik oder Biotechnologie eine Anstellung finden.
</p>
<h3 id="links">Weitere Informationen</h3>
<ul>
<li><a href="http://schuelerweb.bioinf.uni-jena.de/">Informationsseite zur Bioinformatik in Jena</a> Aufbau des Studiengangs, Bewerbung zum Studium, Professoren in Jena, Firmen, Netzwerke, usw.</li>
<li><a href="http://www.3sat.de/mediathek/?mode=play&obj=41656">3Sat-Beitrag</a> über die Bioinformatik</li>
<li><a href="http://bioinfowelten.uni-jena.de/">Blog "Bioinfowelten"</a></li>
<li><a href="Absolventen.pdf">Absolventenportraits (PDF)</a></li>
<li><a href="https://www.uni-jena.de/Studium/Studienangebot/BSc_Bioinformatik.html">Uni Jena</a> Beschreibung des Bachelor-Studiengangs an der FSU</li>
<li><a href="http://www.fmi.uni-jena.de/Studium/Studierende.html">Fakultät für Mathematik und Informatik (FMI)</a> Regelstudienpläne und Modulbeschreibungen</li>
<li><a href="http://www.studentenparadies-jena.de/">Studienstandort Jena</a></li>
</ul>
<a href="http://www.studentenparadies-jena.de/"><img class="banner" alt="Banner mit Link zum Studentenparadies Jena" src="images/banner/paradies.gif"> </a>
</section>
</main>
<footer>
<a href="kontakt.html#impressum">
&copy; Fachschaftsrat Bioinformatik
<script type="text/javascript">
document.write(new Date().getFullYear());
</script>
</a>
</footer>
</body>
</html>
\ No newline at end of file
output/student.html deleted 100644 → 0
View file @ 87a3f437
This diff is collapsed.
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment