{"id":1117,"date":"2021-09-07T22:49:58","date_gmt":"2021-09-07T20:49:58","guid":{"rendered":"https:\/\/blogs.uni-bremen.de\/studytools\/?p=1117"},"modified":"2023-08-02T14:17:18","modified_gmt":"2023-08-02T12:17:18","slug":"plantuml-diagramme-von-projektplanung-bis-programmcode","status":"publish","type":"post","link":"https:\/\/blogs.uni-bremen.de\/studytools\/2021\/09\/07\/plantuml-diagramme-von-projektplanung-bis-programmcode\/","title":{"rendered":"PlantUML &#8211; Diagramme von Projektplanung bis Programmcode"},"content":{"rendered":"<figure id=\"attachment_1116\" aria-describedby=\"caption-attachment-1116\" style=\"width: 1024px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/blogs.uni-bremen.de\/studytools\/files\/plantuml_beispiel_wordpress.png\" data-rel=\"lightbox-image-0\" data-rl_title=\"\" data-rl_caption=\"\" title=\"\"><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-1116 size-large\" src=\"https:\/\/blogs.uni-bremen.de\/studytools\/files\/plantuml_beispiel_wordpress-1024x470.png\" alt=\"Beispieldiagramm mit PlantUML; Autor im ZMML schreibt begeistert Artikel f\u00fcr Studytools, wo Studis Tipps, Hilfe und Software finden\" width=\"1024\" height=\"470\" \/><\/a><figcaption id=\"caption-attachment-1116\" class=\"wp-caption-text\">Mit PlantUML erstellst du zahlreiche aussagekr\u00e4ftige UML-Diagrammtypen &#8211; ob Programmier-Klassen, Datentypen, Zeitverl\u00e4ufe, Nutzungsszenarien, Gantt-Diagramme oder Mindmaps.<\/figcaption><\/figure>\n<ul>\n<li>Du bist \u201cTech-Wizard\u201d\u2026 \u00e4h Programmierer*in und musst\u2026 Muggeln die automagischen Funktionen und Abl\u00e4ufe deiner Software erkl\u00e4ren?<\/li>\n<li>Euer Projekt braucht ein Gantt-Diagramm zur Projektplanung?<\/li>\n<\/ul>\n<p>Mit der \u201cProgrammiersprache\u201d PlantUML erstellst du im Handumdrehen UML-Diagramme (\u201cUML\u201d steht f\u00fcr \u201cUnified Modeling Language\u201d). Damit kannst du f\u00fcr technische Abl\u00e4ufe so ziemlich alle Diagramme erstellen, die du jemals brauchen solltest:<br \/>\nFluss-, Ablauf- und Sequenzdiagramme, Klassen, Zeit- bzw. Signalverl\u00e4ufe\u2026 . Zur Projektplanung erstellst du damit auch Gantt-Diagramme, Work-Breakdown-Structure Diagramme oder auch Entw\u00fcrfe deiner GUIs (grafische Oberfl\u00e4chen und Men\u00fcs). Oder auch Mindmaps.<\/p>\n<p>PlantUML ist insbesondere f\u00fcr Programmierer*innen gut, um schnell Diagramme zu den Prozessen und Funktionen von Software zu erstellen. Das hilft Software zu planen, umzusetzen und sp\u00e4ter auch bei der Wartung und Dokumentation\u2026 denn wei\u00dft du in 3 Jahren noch, wie dein Quellcode im Einzelnen zusammenh\u00e4ngt?<\/p>\n<p>Aber auch wenn du kein Techie bist, ist PlantUML gut f\u00fcr dich:<br \/>\nProjektplanung solltest du n\u00e4mlich auch manchmal machen \u2013 z.B. f\u00fcr deine Abschlussarbeit. Oder du erstellst ein paar h\u00fcbsche Diagramme, die den Kern deiner Hausarbeit visualisieren. W\u00e4re doch nett, oder?<\/p>\n<h2 id=\"aber-warum-ist-das-nicht-total-umst\u00e4ndlich\">Aber warum\u2026 !? Ist das nicht total umst\u00e4ndlich?<\/h2>\n<p>Grafiken zu \u201cprogrammieren\u201d hat neben vielen Anderen Vorteilen zun\u00e4chst einen Zeitvorteil:<br \/>\nwundersch\u00f6ne Diagramme zu zeichnen ist n\u00e4mlich wahnsinnig zeitaufw\u00e4ndig!\u00a0 Mit PlantUML schreibst du ein paar Zeilen Text in eine Datei, statt in einem umfangreichen Grafikprogramm hunderte Formen, Linien und Gruppierungen anzuordnen. Klein sind die \u201cGrafiken\u201d auch, denn es ist ja nur ein kurzer Text \u2013 und der l\u00e4sst sich ebenfalls schnell \u00fcberall ansehen und ver\u00e4ndern.<\/p>\n<p>F\u00fcr dich Programmierer*in ist au\u00dferdem vorteilhaft, dass du die Diagramme mit einem Versionsverwaltungssystem (etwa <a href=\"https:\/\/git-scm.com\/\">Git<\/a>) verwalten kannst. Diagramme und Quellcode der Software kannst du damit im Team erstellen und teilen. F\u00fcr \u00c4nderungen haben dann alle einfachen Zugriff auf den Quelltext der Grafik \u2013 und kaputtgehen k\u00f6nnen Formatierungen und das Layout ebenfalls nicht.<\/p>\n<h2 id=\"was-brauchst-du-daf\u00fcr\">Was brauchst du daf\u00fcr?<\/h2>\n<p><strong>Achtung!<\/strong><br \/>\n<em>Um PlantUML auszuf\u00fchren ben\u00f6tigst du die Programmiersprache Java, die du vorher installieren musst.<\/em><br \/>\n<em>F\u00fcr Sequenz- und Aktivit\u00e4tsdiagramme ben\u00f6tigst du au\u00dferdem <a href=\"https:\/\/graphviz.org\/\">Graphviz<\/a>. Mit diesem Programm lassen sich ebenfalls einige Arten von Diagrammen erstellen. Daher greift PlantUML f\u00fcr bestimmte Diagramme auf Graphviz zur\u00fcck.<\/em><\/p>\n<p>Was du daf\u00fcr brauchst? Nur die (Java-)Datei von PlantUML und einen beliebigen Texteditor!<\/p>\n<p>Lade die PlantUML Java-Datei (mit der Endung <code>.jar<\/code>) herunter. Diese kannst du \u00fcber die Kommandozeile \/ Terminal bzw. Eingabeaufforderung aufrufen.<\/p>\n<p><strong>Tipp:<\/strong><br \/>\n<em>Auf der Webseite von PlantUML findest du eine \u00dcbersicht von vielen Diensten und Programmen, die PlantUML-Diagramme bearbeiten und anzeigen k\u00f6nnen. Au\u00dferdem findest du sehr viele Beispiele zu den einzelnen Diagrammtypen.<\/em> <em>Es gibt auch mehrere gute Online-Editoren f\u00fcr PlantUML, bei denen du deine Diagramme schreiben und als Bilddatei herunterladen kannst.<\/em><\/p>\n<h2 id=\"beispiel-ein-diagramm-als-png-bild-speichern\">Beispiel: ein Diagramm als PNG-Bild speichern<\/h2>\n<p>In diesem Beispiel bekommst du aus 3 Zeilen Text eine Grafik (Sequenz-Diagramm) im <code>.png<\/code>-Bildformat:<\/p>\n<p>Du legst eine Textdatei mit dem n\u00f6tigen Code an:<\/p>\n<pre class=\"plantuml\"><code>@startuml\r\nAlice -&gt; Bob: test\r\n@enduml<\/code><\/pre>\n<p>Speichere diese Datei als <code>Beispiel.txt<\/code> ab.<\/p>\n<p>Wenn du die <code>plantuml.jar<\/code>-Datei im gleichen Ordner gespeichert hast, musst du im Terminal bzw. der Eingabeaufforderung im gleichen Ordner sein und folgenden Befehl angeben:<\/p>\n<p><code>java -jar plantuml.jar Beispiel.txt<\/code><\/p>\n<dl>\n<dt>Erkl\u00e4rung:<\/dt>\n<dd><code>java<\/code> ruft dabei die Programmiersprache Java auf, mit <code>-jar<\/code> gibst du an, dass nun eine ausf\u00fchrbare Java-Datei aufgerufen werden soll \u2013 n\u00e4mlich die <code>plantuml.jar<\/code>, die du heruntergeladen hast. Die Datei zum Umwandeln ist dann <code>Beispiel.txt<\/code>. PlantUML erstellt automatisch eine Bilddatei im <code>.png<\/code>-Format.<\/dd>\n<\/dl>\n<p>Wenn du dein Diagramm in einem anderen Format brauchst, kannst du die n\u00f6tigen <a href=\"https:\/\/plantuml.com\/de\/command-line#458de91d76a8569c\">Befehle f\u00fcr die Erstellung in unterschiedlichen Dateiformaten ansehen<\/a>. Mit <code>-svg<\/code> z.B. erstellst du eine SVG-Datei oder mit <code>-pdf<\/code> eine PDF-Datei.<\/p>\n<p><strong>Hinweis:<\/strong><br \/>\n<em>Willst du deine Diagramme interaktiver erstellen, kannst du PlantUML auch folgenderma\u00dfen aufrufen: <code>java -jar plantuml.jar -gui<\/code>. Im folgenden Dialogfenster w\u00e4hlst du einen Ordner aus. PlantUML lie\u00dft dann automatisch die darin enthaltenen Dateien ein und erstellt bei jedem Speichervorgang eine Vorschau deines Diagramms. Damit siehst du <\/em>sofort* alle \u00c4nderungen und ob alles geklappt hat.*<\/p>\n<p style=\"text-align: center\"><a class=\"uri\" href=\"https:\/\/plantuml.com\/de\/\">https:\/\/plantuml.com\/de\/<\/a><\/p>\n<h1 id=\"hilfe\">Hilfe<\/h1>\n<ul>\n<li>Schnelleinstieg in PlantUML (FAQ; Sprache: DE):\n<ul>\n<li><a class=\"uri\" href=\"https:\/\/plantuml.com\/de\/starting\">https:\/\/plantuml.com\/de\/starting<\/a><\/li>\n<\/ul>\n<\/li>\n<li><em>Wie Modellierung mit UML zu besserem Code f\u00fchrt<\/em>\n<ul>\n<li><a class=\"uri\" href=\"https:\/\/blog.nevercodealone.de\/modellierung-mit-uml-besserer-code\/\">https:\/\/blog.nevercodealone.de\/modellierung-mit-uml-besserer-code\/<\/a><\/li>\n<\/ul>\n<\/li>\n<li><em>Docs-as-Code &#8211; Die Grundlagen<\/em>\n<ul>\n<li><a class=\"uri\" href=\"https:\/\/www.informatik-aktuell.de\/entwicklung\/methoden\/docs-as-code-die-grundlagen.html\">https:\/\/www.informatik-aktuell.de\/entwicklung\/methoden\/docs-as-code-die-grundlagen.html<\/a><\/li>\n<\/ul>\n<\/li>\n<li>Video-Tutorial <em>Von 0 auf 100 &#8211; PlantUML &#8211; UML Diagramme \u201cschreiben\u201d<\/em> (<em>coding BOTT<\/em>; YouTube; Sprache:DE)\n<ul>\n<li><a class=\"uri\" href=\"https:\/\/www.youtube.com\/watch?v=a18wPd5jYmQ\">https:\/\/www.youtube.com\/watch?v=a18wPd5jYmQ<\/a><\/li>\n<\/ul>\n<\/li>\n<li>\u201cMarkdown native diagrams with PlantUML\u201d (Andreas Offenhaeuser, Sprache: EN)\n<ul>\n<li><a class=\"uri\" href=\"https:\/\/blog.anoff.io\/2018-07-31-diagrams-with-plantuml\/\">https:\/\/blog.anoff.io\/2018-07-31-diagrams-with-plantuml\/<\/a><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<hr \/>\n<p><a href=\"http:\/\/creativecommons.org\/licenses\/by-sa\/4.0\/\" rel=\"license\"><img decoding=\"async\" class=\"aligncenter\" style=\"border-width: 0\" src=\"https:\/\/i.creativecommons.org\/l\/by-sa\/4.0\/88x31.png\" alt=\"Creative Commons Lizenzvertrag\" \/><\/a><br \/>\nDieses Werk ist lizenziert unter einer <a href=\"http:\/\/creativecommons.org\/licenses\/by-sa\/4.0\/\" rel=\"license\">Creative Commons Namensnennung &#8211; Weitergabe unter gleichen Bedingungen 4.0 International Lizenz<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<div class=\"entry-summary\">\nDu bist \u201cTech-Wizard\u201d\u2026 \u00e4h Programmierer*in und musst\u2026 Muggeln die automagischen Funktionen und Abl\u00e4ufe deiner Software erkl\u00e4ren? Euer Projekt braucht ein&hellip;\n<\/div>\n<div class=\"link-more\"><a href=\"https:\/\/blogs.uni-bremen.de\/studytools\/2021\/09\/07\/plantuml-diagramme-von-projektplanung-bis-programmcode\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &ldquo;PlantUML &#8211; Diagramme von Projektplanung bis Programmcode&rdquo;<\/span>&hellip;<\/a><\/div>\n","protected":false},"author":2209,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"footnotes":""},"categories":[720477,748760,721020],"tags":[838861,838828,838859,21138,526,838860,838862],"coauthors":[838704],"class_list":["post-1117","post","type-post","status-publish","format-standard","hentry","category-dienste-und-programme","category-grafik-und-gestaltung","category-open-source-programme","tag-abbildung","tag-code","tag-diagramme","tag-programmieren","tag-projektplanung","tag-schema","tag-uml","entry"],"_links":{"self":[{"href":"https:\/\/blogs.uni-bremen.de\/studytools\/wp-json\/wp\/v2\/posts\/1117","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.uni-bremen.de\/studytools\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.uni-bremen.de\/studytools\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.uni-bremen.de\/studytools\/wp-json\/wp\/v2\/users\/2209"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.uni-bremen.de\/studytools\/wp-json\/wp\/v2\/comments?post=1117"}],"version-history":[{"count":1,"href":"https:\/\/blogs.uni-bremen.de\/studytools\/wp-json\/wp\/v2\/posts\/1117\/revisions"}],"predecessor-version":[{"id":1158,"href":"https:\/\/blogs.uni-bremen.de\/studytools\/wp-json\/wp\/v2\/posts\/1117\/revisions\/1158"}],"wp:attachment":[{"href":"https:\/\/blogs.uni-bremen.de\/studytools\/wp-json\/wp\/v2\/media?parent=1117"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.uni-bremen.de\/studytools\/wp-json\/wp\/v2\/categories?post=1117"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.uni-bremen.de\/studytools\/wp-json\/wp\/v2\/tags?post=1117"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/blogs.uni-bremen.de\/studytools\/wp-json\/wp\/v2\/coauthors?post=1117"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}