How to Make Easy UML Sequence Diagrams and Flow Charts with PlantUML

what's going on guys in this video i want to talk to you about a tool that i use all the time for creating sequence diagrams flow charts a whole bunch of other diagrams as well and the tool is called plant uml and so we're on a website right now that's meant to show you what you can do with this tool but before we get into what you can do with it and how it works and all that i want to explain to you the problem that it solves so prior to using this tool i would use things like draw.io or microsoft vizio to create sequence diagrams a sequence diagram is something like this over here where you kind of define the relationship between different components obviously i would never use french but when you're using a tool like draw.i o or vizio or whatever you you would imagine what that looks like you need to kind of lay out how everything is going to be set up and how everything will look you also got to name these things and connect all the vertices so that everything looks how you imagined it and you know while you're halfway through your project and you create this really complicated diagram something changes maybe you have a meeting that goes in a different direction now you need to kind of delete a component and what does that look like you're going to delete the thing redraw all the arrows maybe some things aren't relevant anymore it just becomes a very time consuming process for you to rebuild your diagram you have to waste all this time worrying about the semantics of how things are connected and making sure everything looks nice so i got really sick and tired of that and i started looking for alternatives and that's when it comes to plant uml so plant uml is an absolutely free tool to use you can actually download it on their website i'll show you a little bit about that later but on this website it shows you kind of the things that you can do with plant uml and the things that i use the most are sequence diagrams they look like like these guys to define the relationships between components also lets you do things like class diagrams or the kind of relationships of packages on this website it's actually really cool these are just random submissions that people have created with plant uml and this thing kind of lays them out for you so you can see uh how they created them so for instance i don't know this blue one looks pretty cool let's click on that so this is a state machine it looks like or kind of an activity diagram maybe and it shows you the syntax of how you would do this so this one looks a little bit complicated maybe you want to look at something a little bit easier maybe for where is it maybe use case or sequence diagrams that's what i want so a sequence diagram like this this is a little bit more easy and this is actually the greatest part the part that i love about plant uml the most is that it's just a text block you don't actually draw anything it uses a background engine to read the input of the text put together a visualization of it and then spit it out on your screen so you can very easily add and remove different things just by adding different lines here as opposed to having to introduce new boxes and connect them and all that so it's super super powerful for all sorts of different applications like i said now a kind of negative thing about this is that you lose a little bit of control in terms of how things are laid out and this is especially obvious for things like large state machine diagrams or large flow machine diagrams and things like that part of the benefit of using this tool is that you get to define things as text but part of the negative is that you kind of lose some control in the way that things are laid out you kind of just have to rely on the engine to lay them out in the most intuitive way now that being said you do have a little bit of influence on how things get laid out uh you can kind of say you want certain components to go to the left of another component or the right of another component so there's a little bit of flexibility there again i just want to mention that in case you were wondering so let's head over to the plant uml website um and i just kind of want to show you a demonstration of how i kind of use this on the day-to-day so i'm just at plantuml.com and i'm just on the homepage right now and uh the thing that i like about this website let's actually just kind of skirt around here to see what's going on if you click on any of these top bars here for instance state in this example not only does it show you some awesome examples of how this stuff works so it gives you great templates so you can kind of build your own but it also lets you edit it online so you can just click this button and go to an editor and then you can kind of change anything so this is another string no it's not um and this should update submit yeah no it's not so and it's a png so you can see i just dragging away that image so this website's pretty convenient for that uh how do i close this now back let's go back awesome so that's kind of what this website is about it shows you kind of how these things work it gives you some templates to use it explains the semantics and the syntax of how to kind of get some unique styles going as well okay so here i am on the homepage again and let's scroll down here to this demo where i can show you how i use this thing on the day today so as you can see here it's just a very simple starting project here where bob is talking alice and he's saying hello to alice so let's get rid of this and we can say participant actually let's start with actor so actor user so actor gives you the kind of little stick figure here if you want components to represent services you may say participant and let's just call this thing transaction service in this case you can see here that popped up as a square box so let's say the user calls transaction service so user transaction service and says submit transaction right something like that and you can see that it changed your reflect that and now our transaction service wants to do a whole bunch of things maybe it wants to send to an sns topic and then save to a database probably the other way around so let's say uh participants dynamodb and participant sns and then what we can say here now is transaction service to ddb uh save record something like that and let's just copy that put that down here and we also want to say it goes to sns and says publishes notification right something practical and then it eventually will respond back to the user with an ok indicator so so you would say transaction service i like to use a double arrow for the return and that goes to user and that's going to say ok so this kind of shows you the kind of stuff that you can do with it it's a very very useful tool um and i use it all the time for sequence diagrams sequence diagrams are by far the most common thing that i use this for but it's also great for state machines as well i've built some pretty complicated state machines here so that's kind of what i use it for and there's a whole bunch more to this i just kind of showed you the very very basic stuff for sequence diagrams you can do things where like you activate blocks you can do things for like if statements or switches um you can kind of separate a diagram into two pieces if you want you can actually use html to style these things in specific colors and in some more recent versions you can import certain styles so things like aws you know diagrams or aws icons rather so dynamodb icons sns icons yadda yadda yadda so there's a whole bunch of stuff that you can do with this it's got a very active community there's constantly improvements coming out and fixes for bugs and all that so that's kind of how you use it i just want to copy this put this to my notepad and i want to show you the tool that i use the most in terms of when editing so this tool is called live uml and i usually come to this when i kind of want to put together a diagram this saves you from having to download the thing onto your local machine instead you can just come to this tool and do whatever you want in this case i'm just pasting what i had before and it kind of spits this out and then once you're done you can kind of take this and i think if you actually sign up here you can get a account that persists your diagrams which is super super useful now the thing that i like about this website live uml the most is that it gives you auto complete so you can see here when you type a you get all this stuff the problem that i have most of the time is that i can't remember the syntax so this is a life saver for me this doesn't come by default in the tool by the way this is something that this tool live uml is offering as a feature also it's got a bunch of different kind of examples here so like if you want to use a person it shows you how to do that if you want to use a certain arrow type maybe you like this arrow type it shows you how to do that there's a whole bunch of things here you know if you want to create a loop it shows you the syntax for that so super super useful stuff again this tool is called plant uml and you can download it or use it on live uml and the website that i was after before was plantuml.com and then this website is just real world plant uml right here i'll let you copy this out of the video so you can take a look here what people are kind of creating as some inspiration so you can see here people have created some pretty complicated things with all sorts of colors and sections and fancy things and like this is what my diagram usually looks like something super simple like this or maybe it's got a bunch of components just with arrows but you know nothing fancy i'm a pretty simple guy anyways i hope you really enjoyed this video i use plant uml all the time i think more people need to know about it because this tool is absolutely awesome so if you did enjoy this video please don't forget to like and subscribe and check out the other videos on my channel and as always i will see you next time

Channel: Be A Better Dev

Views: 45,293

Keywords: aws, aws simplified, awssimplified, programming, coding, cloud computing, software design, software engineer, software developer, software design principles, software architecture, plantuml, plant uml, sequence diagrams, uml sequence diagram, websequencediagrams, sequence diagram online, plantuml online, plantuml sequence diagram, how to make a sequence diagram, plantuml editor, flow diagram, architecture diagram, system architecture diagram, uml

Id: xObBUVDMbQs

Length: 9min 13sec (553 seconds)

Published: Thu Oct 08 2020