Simple Ecommerce Website Navigation Diagram In Plant UML

Simple Ecommerce Website Navigation Diagram Or Simple Ecommerce Website Structure Or Simple Ecommerce Site Map

E-commerce Website Navigation Diagram similar to E-commerce Website Structure similar to E-commerce Website Site Map use to help each user ( for example consumer, customer, seller, etc ) to find all required pages to work in e-commerce activity.

This following e-commerce website navigation diagram example in PlantUML file ( save as ecommerceNavigationDiagram.puml ). You can use plantuml editor or text editor

/' License: 

 Creately Desktop - End User License Agreement (EULA)  

 PlantUML is GNU General Public License as published by the Free Software Foundation, either version 3 of the License.

'/

@startwbs

*(a) Home

**(b) "view\n products"

**(c) Login

***(g) profile

***(h) settings

**(d) shop now

**(e) view cart

**(f) checkout

*** Login

****(i) payment

@endwbs

Hello World In PlantUML

1. type this on a text editor:
   
   @startuml
   skinparam HeaderFontColor Black
   skinparam FooterFontColor Black
   
   header
   This is a header
   endheader
   
   title
   Hello World In PlantUML
   endtitle
   
   note right
   This is a note
   end note
   
   legend
   This is a legend
   endlegend
   
   caption figure 1 Hello World
   
   footer
   This is a footer
   endfooter
   @enduml
   
2. Open your Command Prompt, to learn how to open Command Prompt click How To Launch Command Prompt
3. Go to your PlantUML installation, click Check PlantUML Installation  to learn how to go to PlantUML installation folder.
   
   
   
   
   
4. type
   java -Xms512m -Xmx1024m -jar plantuml.jar "D:\work\blogging\programming\UML\PlantUML\helloWorld.plantuml"
    in Command Prompt
   
   
   
   
   
5. See the output, below
   
   
   
   
   

<< back to Study About UML Diagram

Visual Studio Code Extension 5

These are Useful Extension for Visual Studio Code Editor:

• adammaras.overtype = Provides insert/overtype mode.
• aflov.todogenerator = Boilerplate TODO .txt file generator.
• aiekick.plantuml-switcher = Switch PlantUML elements (relations, links, ...).
• alexcvzz.vscode-sqlite = Explore and query SQLite databases.
• AlekseyNagovitsyn.autocomplete-line = Auto complete lines by grepping the project.
• alpinebuster.vscode-latex-table-editor = An Open Source WYSIWYG table editor that exports to multiples languages including LaTeX, ConTeXt, Plain TeX, CSV, HTML, BBCode, Eplain, PreTeXt, MediaWiki, Markdown and WML.
• antfu.browse-lite = Embedded browser in VS Code.
• asciidoctor.asciidoctor-vscode = Provides rich language support for AsciiDoc.
• barankilic.beamer = Beamer snippets for Visual Studio Code.
• betterthantomorrow.paste-replaced = Paste text replaced using regular expressions that you configure, optionally simulating that you are typing it. Works anywhere in VS Code, not just the editors. E.g. good for fast typing canned text in your presentations and a lot of other cases.
• bierner.markdown-mermaid = Adds Mermaid diagram and flowchart support to VS Code's builtin markdown preview.
• Cardinal90.multi-cursor-case-preserve = Preserves case when editing with multiple cursors.
• claudiobartoli.latex-songs = Syntax highlighting for LaTeX songs package.
• cmoog.sqlnotebook = Open SQL files in the VS Code Notebook interface. Execute query blocks and view output interactively.
• davraamides.todotxt-mode = Commands and decorators for managing todo.txt files.
• efoerster.texlab = LaTeX and BibTeX language support for Visual Studio Code.
• fabiospampinato.vscode-todo-plus = Manage todo lists with ease. Powerful, easy to use and customizable.
• hari64boli64.latexlint = Linter for LaTeX with useful commands for academic writing.
• HuYigong.vscode-latex-commands = Usefull commands for LaTeX.
• isawu.partial-autocomplete = Adds common substrings to suggested completions list for partial auto-completion.
• JaimeOlivares.yuml = UML diagramming tool based on the yUML syntax.
• James-Yu.latex-workshop = Boost LaTeX typesetting efficiency with preview, compile, autocomplete, colorize, and more.
• jebbs.plantuml = Rich PlantUML support for Visual Studio Code.
• JeffersonQin.latex-snippets-jeff = Useful Snippets for LaTeX.
• johnguo.columnpaste = Copy/Paste a column text.
• JZWenxuan.spread-selection = Spread the selected text for every line in the clipboard.
• k-kuroguro.csv2latex = VSCode extension for converting CSV or Excel table to LaTeX tabular.
• kilacoda.code2latex = TeXify Your Code.
• konstantin.wrapSelection = wrap selection with combination of symbols or your custom pattern.
• lhl2617.latex-js-preview = Provides preview of LaTeX.js in VSCode.
• ltex-plus.vscode-ltex-plus = Grammar/spell checker using LanguageTool with support for LaTeX, Markdown, and others.
• lucax88x.codeacejumper = Visual Studio Code Ace Jump.
• Lw-lonely.latex-table-helper = Latex Table Helper provides an easy way to generate table.
• maptz.camelcasenavigation = Provides Camel Case cursor navigation for the Visual Studio Code editor.
• marclipovsky.string-manipulation = Format strings to camelize, dasherize, etc.
• mathematic.vscode-latex = LaTeX language support for Visual Studio Code.
• mjpvs.latex-previewer = Preview a typeset LaTeX document in VS Code.
• NadavGold.tex-matrix = An extension provides user snippets for latex which allows creating matrix up to 12x12.
• nhawkes.selection-overtype = Typing with a selection active overtypes with matching case.
• oijaz.unicode-latex = Insert unicode symbols for latex names.
• pinglewareapps.pingleware-access-db-viewer = A Visual Studio Code extension to view Microsoft Access databases.
• qwtel.sqlite-viewer = SQLite Viewer for VS Code.
• rarnoldmobile.todo-txt = Todo.txt file management.
• sabertazimi.latex-snippets = Powerful LaTeX Snippets for CS Paper Writing.
• SaptarshiDey.latex-viewer = A simple LaTeX previewer for VsCode.
• skyer.vscode-markdown-diagram = Adds Mermaid PlantUML DOT and ditaa support to VS Code's builtin markdown preview.
• tecosaur.latex-utilities = An add-on to LaTeX Workshop that provides some fancy features that are less vital to the basic experience editing a LaTeX document, but can be rather nice to have.
• TheUMLetTeam.umlet = Free UML Tool for Fast UML Diagrams.
• tomoyukim.vscode-mermaid-editor = Live editor for mermaid.js in Visual Studio Code.
• torn4dom4n.latex-support = LaTeX language support for Visual Studio Code.
• usernamehw.todo-md = Todo tracking based on `todo.txt` format. Todo-md extension does NOT conform to the todo.txt spec.
• vomout.latex-syntax = Rich LaTeX syntax highlighting (for use with Texlab).
• vvlvm.paste-in-selected-case = 「Paste in Selected Case」は、クリップボードのテキストを選択したケース（Camel Case、Snake Case、Upper Case など）に変換して貼り付ける Visual Studio Code 拡張機能です。複数カーソルや複数行のテキストにも対応しています。
• wmaurer.change-case = Quickly change the case (camelCase, SCREAMING_CASE or CONSTANT_CASE, PascalCase or TitleCase, dot.case, snake_case, kebab-case or param-case, slash/case, lowercase, UPPERCASE, space case or no case, Sentence case, Upperfirst, etc) of the current selection or current word.
• wware.plain-text-diagrams = Syntax Highlighting and formatting for .ptd (Plain Text Diagram) files.
• wxhenry.latex-begin-end-auto-rename = Automatically modify the other when editing either begin or end in LaTeX.
• Yongke.latex-wordcount = Count the tex words by TexCount.

< Previous Visual Studio Code Extension 4 

Symbol, Notation And Terminologies

Mathematics And Science Symbols

• Math Symbol 1
• Math Symbol 2
• Math Symbol 3
• Math Symbol In English
• Math Symbol In WolframAlpha 1
• Simbol Matematika
• Simbol Matematika 2

Mathematics Terminologies

• Istilah-istilah matematika dalam bahasa inggris 1
• Istilah Matematika Dalam Bahasa Inggris 2
• Istilah Matematika 1
• Istilah Matematika 2
• Istilah Matematika 3
• Venn Diagram Terms

UML ( Unified Modelling Language ) Symbols And Notations

• Class Diagram ( UML ) 2
• Use Case Diagram Notation 1

Study About UML Diagram >

Latex Symbols, Latex Characters And Latex Notations

• Latex Math Symbol And Equations 1
• Latex Math Symbol And Equations 2
• The Most Common Symbol In Latex

Computer Symbols, Computer Characters And Computer Notations

Symbol And Syntax

Symbol And Syntax 2

Comment In Batch, Registry, PowerShell, Bash File

Apa Itu UML Diagram

Apa itu Diagram UML?

UML  (Unified Modelling Language) adalah cara memvisualisasikan software program menggunakan kumpulan diagram. Notasi ini telah berkembang untuk digunakan pada desain object oriented, tetapi sejak itu telah diperluas untuk mencakup berbagai macam proyek software engineering. Saat ini, UML diterima oleh Object Management Group (OMG) sebagai standar untuk pemodelan pengembangan software.

Tipe-Tipe Diagram UML

Standar UML saat ini menyerukan 13 jenis diagram yang berbeda:

class diagram, activity diagram, object diagram, use case diagram, sequence diagram, package diagram, state diagram, component diagram, communication diagram, composite structure diagram, interaction overview diagram, timing diagram, and deployment diagram.

Diagram ini diorganisasikan menjadi dua kelompok berbeda: Structural Diagram dan Behavioral Diagram.

• Structural UML diagrams
• Class diagram
• Package diagram
• Object diagram
• Component diagram
• Composite structure diagram
• Deployment diagram
• Behavioral UML diagrams
• Activity diagram
• Sequence diagram
• Use case diagram
• State diagram
• Communication diagram
• Interaction overview diagram
• Timing diagram.

Class Diagram

• Class Diagram adalah tulang punggung hampir setiap metode object oriented, termasuk UML.
• Class Diagram menggambarkan static structure suatu sistem.
• Class diagram atau diagram kelas merupakan suatu diagram yang digunakan untuk menampilkan kelas-kelas berupa paket-paket (packets) untuk memenuhi salah satu kebutuhan paket yang akan digunakan nantinya.
• Namun, pada Class diagram desain modelnya dibagi menjadi 2 bagian.
• Class diagram yang pertama merupakan penjabaran dari domain model yang merupakan abstraksi dari basis data.
• Class diagram yang kedua merupakan bagian dari modul program, contohnya metode pemrograman MVC pattern (Model View Controller), dimana terdapat boundary presentation class sebagai class interface, class control sebagai tempat ditemukannya algoritma, dan class entity sebagai tabel dalam basis data dan query program.

Package Diagram

• Package Diagram bagian dari class diagram, tetapi pengembang terkadang memperlakukannya sebagai teknik terpisah.
• Package Diagram hadir sebagai solusi untuk memudahkan organisasi dan pemetaan elemen-elemen dalam sistem tersebut.
• Package Diagram mengatur elemen-elemen suatu sistem ke dalam kelompok-kelompok terkait  dalam unit yang lebih kecil untuk meminimalkan ketergantungan antar package.

Object Diagram

• Object Diagram digunakan untuk menggambarkan sebagian atau seluruh static structure diagram ( UML  structural diagram ) dari suatu sistem pada waktu tertentu. Object Diagram dapat digunakan untuk menguji kelengkapan dan keakuratan class diagram.
• Object Diagram menggambarkan hubungan dan struktur objek pada waktu tertentu, contoh selama eksekusi.
• Object Diagram ini dapat memudahkan tim memahami perilaku dan interaksi objek yang terlibat, baik selama pengembangan maupun analisis masalah.
• Object Diagram biasanya digunakan untuk mengidentifikasi informasi mengenai elemen model tertentu untuk menunjukkan contoh spesifik dari pengklasifikasikan yang diperlukan.

Component diagram

• Component Diagram menjelaskan organisasi software component fisik, termasuk source code, run-time (biner)  code, interface yang tersedia, port dengan hubungan di antaranya dan file yang dapat dieksekusi.
• Component Diagram ini biasa digunakan dalam pengembangan perangkat lunak untuk menggambarkan struktur ( UML structural diagram ) dan hubungan antar komponen dalam sistem agar lebih mudah dianalisis.
• Component Diagram membantu dalam visualisasi, spesifikasi, dan dokumentasi sistem berbasis komponen juga membangun sistem yang dapat dieksekusi melalui forward engineering dan reverse engineering.

Composite Structure Diagram

• Composite Structure Diagrammerupakan bagian dari structural Unified Modeling Language (UML) diagram untuk menunjukkan bagian dalam kelas atau komponen.
• Composite Structure Diagram ini berguna untuk memvisualisasikan interaksi antara objek dan elemen internal dari suatu kelas, terutama ketika elemen tersebut memiliki peran yang berbeda dalam komunikasi.
• Composite Structure Diagram dapat mendokumentasikan dan memvisualisasikan hubungan internal yang tidak terlihat pada diagram kelas, dengan menggunakan elemen, seperti objek, port, dan konektor untuk menunjukkan komunikasi antar objek.

Deployment Diagram

• Deployment Diagram menggambarkan sumber daya fisik dalam suatu sistem, termasuk node, component, dan koneksi.
• Deployment diagram menjadi salah satu jenis UML diagram yang memainkan peran penting dalam mendeskripsikan bagaimana komponen software saling berinteraksi dengan komponen lainnya.
• Deployment diagram adalah diagram yang berfungsi untuk menggambarkan penempatan (deployment) komponen software dalam perangkat keras.

Activity Diagram

• Activity Diagram menggambarkan sifat dinamis suatu sistem dengan memodelkan aliran control dari satu activity ke activity lainnya.
• Suatu activity mewakili suatu operasi atau proses pada beberapa class dalam sistem yang mengakibatkan perubahan pada state sistem. Biasanya, aktivitas dari activity diagram digunakan untuk memodelkan workflow atau proses bisnis dan operasi internal.
• Seperti layaknya runtutan proses berjalannya suatu sistem dan digambarkan secara vertikal.
• Activity diagram adalah salah satu contoh diagram dari behavioral UML dalam pengembangan dari Use Case.

Sequence Diagram

• Sequence Diagram menggambarkan interaction antar class atau objek dalam hal pertukaran message dari time ke time atau berdasarkan urutan waktu.
• Sequence dapat menggambarkan urutan atau tahapan yang harus dilakukan untuk dapat menghasilkan sesuatu, seperti yang tertera pada Use Case diagram.

Use Case Diagram

• Use Case Diagram adalah satu jenis dari diagram UML (Unified Modelling Language).
• Use Case Diagram memodelkan fungsionalitas suatu sistem menggunakan actor dan use case.
• Use Case Diagram menggambarkan hubungan interaksi antara sistem dan aktor/pengguna.

State Diagram / Statechart Diagram / State Machine Diagram

• Statechart Diagram, yang sekarang dikenal sebagai State Machine Diagram dan State Diagram, menggambarkan behavior dinamis suatu sistem dalam menanggapi rangsangan external. State Diagram terutama berguna dalam pemodelan objek reaktif yang statenya dipicu oleh event tertentu.
• Statemachine yaitu salah satu jenis diagram pada UML yang berfungsi untuk menggambarkan transisi serta perubahan pada suatu objek pada sistem.

Communication Diagram / Collaboration Diagram

• Communication Diagram memodelkan interaction antara object secara sequence.
• Communication Diagram menggambarkan static structure dan behavior dinamis suatu sistem. Dalam banyak hal, Communication Diagram adalah versi sederhana dari collaboration diagram yang diperkenalkan dalam UML 2.0.
• Communication Diagram memodelkan kolaborasi antara object-object atau peranan yang mengirimkan fungsionalitas dari use cases dan operasi-operasinya.
• Mekanisme Model Communication Diagram dalam architectural design dari suatu system.

Interaction Overview Diagram

• Interaction Overview Diagram merupakan kombinasi activity diagram dan sequence diagram. 
• Interaction Overview Diagram memodelkan serangkaian actiondan memungkinkan Anda mendekonstruksi interaction yang lebih kompleks menjadi kejadian yang dapat dikelola. Anda harus menggunakan notasi yang sama pada Interaction Overview Diagram seperti yang Anda lihat pada activity diagram.
• Interaction Overview Diagram dapat memungkinkan analisis interaksi antar objek atau elemen , mengidentifikasi masalah potensial, dan memiliki fungsi sebagai alat komunikasi untuk pemangku kepentingan (stakeholder) non-teknis.

Timing Diagram

• Timing Diagram adalah jenis diagram UML behavior atau interaction yang berfokus pada proses yang terjadi selama periode time tertentu.
• Timing Diagram adalah contoh khusus dari sequence diagram, kecuali time ditunjukkan meningkat dari kiri ke kanan, bukan dari atas ke bawah.

Manfaat UML Diagram

Berikut adalah beberapa manfaat membuat UML diagram:

1. Membantu Pengambilan Keputusan: Dengan membuat UML diagram, tim pengembang dan perancang software dapat menentukan jenis infrastruktur fisik mengenai apa yang dibutuhkan, seperti apakah sistem harus di-hosting di cloud, server fisik, atau di keduanya.
2. Memudahkan Pengembangan Dan Pemeliharaan: UML diagram juga dapat memudahkan dalam memahami bagaimana komponen dalam software saling berinteraksi, sehingga pengembang dapat lebih mudah memecahkan masalah saat sistem berkembang.
3. Meminimalisir Resiko Kesalahan: Dengan penggambaran visual yang tepat, tim pengembang dapat menghindari kesalahan dalam penempatan komponen produk atau kesalahan konfigurasi yang dapat menyebabkan downtime.
4. Memudahkan Pemahaman Fungsi Komponen Atau Elemen: Tiap-tiap komponen dalam diagram memiliki tugas tertentu dalam sistem, pada aspek ini UML diagram dapat membantu memperjelas tanggung jawab masing-masing komponen sehingga lebih mudah memahami peran mereka dalam sistem secara menyeluruh.
5. Dapat memberikan bahasa pemodelan visual atau gambar kepada para pengguna dari berbagai macam pemrograman maupun proses umum rekayasa.
6. Menyatukan informasi-informasi terbaik yang ada dalam pemodelan.
7. Memberikan suatu gambaran model atau sebagai bahasa pemodelan visual yang ekspresif dalam pengembangan sistem.
8. Tidak hanya menggambarkan model sistem software saja, namun dapat memodelkan sistem lain, seperti sistem berorientasi objek.
9. Mempermudah pengguna untuk membaca suatu sistem.
10. Berguna sebagai blueprint, jelas ini nantinya menjelaskan informasi yang lebih detail dalam perancangan berupa coding suatu program.
11. Panduan Implementasi: UML diagram dapat membantu pengembang saat membangun dan menguji suatu sistem, serta memberikan pedoman dalam representasi sistem pada kode. 
12. Dukungan Pengujian Integrasi: Memiliki fasilitas pengujian integrasi dengan memvisualisasikan hubungan antar-objek dalam sistem dan memastikan sebuah komponen dapat bekerja secara efektif.
13. Validasi Kode: Pengembangan dapat menggunakan diagram ini untuk memastikan sebuah konsistensi antara kode dan sebuah desain. 
14. Ilustrasi Skenario: Diagram objek dapat menggambarkan sebuah skenario atau kasus penggunaan, serta memvisualkan perilaku sistem dalam berbagai keadaan.
15. Mengelola Kompleksitas: Dengan membagi sistem besar menjadi unit yang lebih kecil, analisis dan desain bisa lebih disederhanakan.
16. Komunikasi yang Lebih Efektif: UML Diagram ini mempermudah tim untuk memahami komponen mana saja yang terkait dan bagaimana relasi antar paket berlangsung.

< back to Study About UML Diagram

technical interview, coding qna, most technology question and answer, concept, managerial theory

Bibliography

https://www.conceptdraw.com/

https://www.dicoding.com/

https://www.lawencon.com/

https://www.smartdraw.com/

https://www.sjsu.edu/ ( university )

https://www.visual-paradigm.com/

Dimensions And Outcome Of Rational Unified Process

Rational Unified Process

Four Horizontal Axis Dimensions or Four Consecutive Phases Of Rational Unified Process:

• Inception Phase.
• Elaboration Phase.
• Construction Phase.
• Transition Phase.
• Production Phase.

Vertical Axis Dimension or  Of Rational Unified Process:

• Core Process Workflows:
  • Business Modeling Workflow.
  • Requirements Workflow.
  • Analysis & Design Workflow
  • Implementation Workflow.
  • Test Workflow.
  • Deployment Workflow.
• Core Supporting Workflows:
  • Project Management Workflow.
  • Configuration And Change Management Workflow.
  • Environment Workflow.

The outcome Of Rational Unfied Process

• The outcome of the Inception Phase is establish the business case for the system and delimit the project scope. At minimum, it consists of:
  • A vision document is a general vision of the core project’s requirements, key features, and main constraints.
  • An initial use-case model (10%-20% complete).
  • An initial project glossary (may optionally be partially expressed as a domain model).
  • An initial business case, which includes business context, success criteria (revenue projection, market recognition, and so on), and financial forecast.
  • An initial risk assessment.
  • A project plan, showing phases and iterations.
  • A business model, if necessary.
  • One or several prototypes.
• The outcome of the Elaboration Phase is to analyze the problem domain for an organization. At minimum, it consists of:
  • A use-case model (at least 80% complete) — all use cases and actors have been identified, and most use-case descriptions have been developed.
  • Supplementary requirements capturing the non functional requirements and any requirements that are not associated with a specific use case.
  • A Software Architecture Description.
  • An executable architectural prototype.
  • A revised risk list and a revised business case.
  • A development plan for the overall project, including the coarse-grained project plan, showing iterations” and evaluation criteria for each iteration.
  • An updated development case specifying the process to be used.
  • A preliminary user manual (optional).
• The outcome of the Construction Phase is a product ready to put in hands of its end-users. At minimum, it consists of:
  • The software product integrated on the adequate platforms.
  • The user manuals.
  • A description of the current release.
• The outcome of Transition Phase is entered when a baseline is mature enough to be deployed in the end-user domain. At minimum, it consists of:
  • “beta testing” to validate the new system against user expectations.
  • parallel operation with a legacy system that it is replacing.
  • conversion of operational databases.
  • training of users and maintainers.
  • roll-out the product to the marketing, distribution, and sales teams.

Enterprise Unified Process

Four Horizontal Axis Dimensions or Four Consecutive Phases Of Enterprise Unified Process:

• Inception Phase.
• Elaboration Phase.
• Construction Phase.
• Transition Phase.
• Production Phase.
• Retirement Phase.

Vertical Axis Dimension or  Core Process Engineering Workflows Of Enterprise Unified Process:

• Project Disciplines:
  • Business Modeling Disciplines.
  • Requirements Disciplines.
  • Analysis And Design Disciplines.
  • implementation Disciplines.
  • Test Disciplines.
  • Deployment Disciplines.
  • Configuration andalso Change Management Disciplines.
  • Project Management Disciplines.
  • Environment Disciplines.
  • Operations And Support Disciplines.
• Enterprise Disciplines:
  • Solution Delivery Disciplines.
  • Operations & Support Disciplines.
  • Enterprise Business Modeling Disciplines.
  • Portfolio Management Disciplines.
  • Enterprise Architecture Disciplines.
  • Strategic Reuse Disciplines.
  • People Management Disciplines.
  • Enterprise Administration Disciplines.
  • Deployment Disciplines.
  • Software Process Improvement.

<< back to Study About UML Diagram

Bibliography

https://wikipedia.org/

https://www.ku.edu/ ( university )

https://www.uccs.edu/ ( university )

The Unified Process Series;Addison Wesley Longman

UML Series;Addison Wesley Longman

A Kind Of Process Model In Technology

The Concurrent Model Activity

• Inactive
• Under Development
• Awaiting Changes
• Under Revision
• Under Review
• Baselined
• Done

The Prototyping Paradigm

• Communication
• Quick Plan
• Modeling Quick Design
• Construction Of Prototype
• Deployment, Delivery and Feedback

Spiral Model

• Communication
• Project initiation
• Requirements gathering.
• Planning
• Estimating
• Scheduling
• Risk Analysis
• Modelling
• Analysis
• Design
• Construction
• Code
• Test
• Deployment
• Delivery
• Feedback

The Unified Process ( UP ) or Rational Unified Process ( RUP )

• Inception Phase:
• Communication Activities.
• Planning Activities.
• Elaboration Phase:
• Planning Activities.
• Modelling Activities.
• Construction Phase:
• Construction Activities.
• Deployment Activities.
• Transition Phase:
• Construction Activities.
• Deployment Activities.
• Production Phase:
• Deployment Activities.
• Software Release.

The Dependencies Between Models Of The Unified Process

• Use Case Model Specified By Analysis Model.
• Use Case Model Realized By Design Model.
• Use Case Model Distributed By Deployment Model.
• Use Case Model Implemented By Implementation Model.
• Use Case Model Verified By Test Model.

The Waterfall Model

• Communication
• Project initiation
• Requirements gathering.
• Planning
• Estimating
• Scheduling Tracking
• Modelling
• Analysis
• Design
• Construction
• Code
• Test
• Deployment
• Delivery
• Support
• Feedback

<<back to Study About UML Diagram

technical interview, coding qna, most technology question and answer, concept, managerial theory

Bibliography

https://binus.ac.id/ ( university )

https://ioc.ee/ ( university )

https://www.ku.edu/ ( university )

Business Process Modelling Series;CRC Press

Business Process Modelling Series;Pearson

Business Process Modelling Series;Routledge

Business Process Modelling Series;SpringerLink

Table Creole PlantUML About Microsoft Excel Arithmetic Operator

Type this following plantUML source code in your plantUML editor:

@startuml

/' Creole Table PlantUML '/

title

Arithmetic Operator In Microsoft Office Excel Using Creole PlantUML

|= Arithmetic\n Operator |= Symbol |= Example |= Result |

|Addition |+ |10+5 |15 |

|Subtraction |- |10-5 |5 |

|Multiplication |* |10*5 |50 |

|Division |/ |10/5 |2 |

|Exponent |^ |10^5 |100000 |

|Percentage |% |10% |0.10 |

end title

@enduml

 

Output:

Notes

• Column Separation: Use the pipe symbol | to separate columns within the note. 
• Row Separation: New lines create rows.
• Equal Sign ( = ) as the first char of a cell (after | the pipe symbol) indicates whether to make it bold (usually used for headers).

plant uml, unified modelling language, system analyst and design, textual diagram, text to diagram, textual modelling

<< back to  Study About UML Diagram

<< back to  Study About ERD / DFD

Related Post

Check PlantUML Installation

PlantUML Code About CMS

1. Type this following source code about CMS (Content Management System) in PlantUML Code:

@startuml

/' creately, freeprojectz '/

/' avoid problems with angled crows feet '/

skinparam linetype ortho

(*) --> "Login" as actLogin

actLogin --> "Check User Level And Permissions" as usrLvl

usrLvl --> if "Check Permission" as actChk1 then

--> [true] "Manage Content" as actMngContent

endif

usrLvl --> if "Check Permission" as actChk2 then

--> [true] "Manage Content Type" as actMngCntType

endif

usrLvl --> if "Check Permission" as actChk3 then

--> [true] "Manage Category" as actMngCat

end if

usrLvl --> if "Check Permission" as actChk4 then

--> [true] "Manage Comment" as actMngCmnt

end if

usrLvl --> if "CheckPermission" as actChk5 then

--> [true] "Manage Blogs" as actMngBlogs

end if

actMngContent --> "Logout from the system" as actLogout

actLogout --> (*)

actMngCntType -->actLogout

actLogout --> (*)

actMngCat -->actLogout

actLogout --> (*)

actMngCmnt -->actLogout

actLogout --> (*)

actMngBlogs -->actLogout

actLogout --> (*)

@enduml

2. Save file as cmsActDiaLegacy.plantuml.

3. Build or Compile the source code.

Output

Notes

too see the more clear picture, click on the picture.

diagram as code, textual modelling, plant, uml

Tabel Identifikasi Aktor Use Case Dalam Markdown

Persiapan: Markdown Editor dan Markdown Reader yang mendukung markdown-it parser dan markdown-it-table-captions plugin (Table caption plugin for markdown-it markdown parser).

1. Buka Markdown Editor.

2. Ketik dokumen markdown di bawah ini pada markdown editor:

<meta name="description" content="Author: Tutor Course and After School Course, Description: menampilkan tabel Identifikasi Aktor Use Case UML (Unified Modelling Language), Rev-Number: 1.0, Language: id">

|ID|Aktor|Deskripsi|

|---|---|---|

|AC01|Admin _Inventory_|Aktor yang dapat mengelola data barang, mengelola data pemasok, mengelola data pelanggan, mengelola data barang masuk, mengelola data barang keluar, mengelola data persediaan barang, dan mengelola data permintaan barang.|

|AC02|Admin Pembelian|Aktor yang dapat melihat dan menyetujui permohonan permintaan barang|

|AC03|Admin Penjualan|Aktor yang dapat melihat dan menyetujui permohonan penjualan barang|

|AC04|Manajer|Aktor yang dapat membuat _user_ baru, memiliki hak akses untuk mengedit dan menghapus _user_, melihat laporan barang masuk, laporan barang keluar, laporan daftar barang, laporan persediaan barang, laporan permintaan barang, dan laporan penjualan barang.|

Table: Identifikasi Aktor

3. Simpan dengan nama file tabelIdentifikasiAktor.md.

4. Jalankan preview  atau save as HTML atau PDF.

5. Buka HTML di browser atau PDF di PDF reader.

Notes

Jika Markdown Editor dan Markdown Converter atau Markdown Compiler untuk parsing Markdown berjalan dengan baik maka akan menghasilkan file output HTML seperti di bawah ini:

<!DOCTYPE html>

<head>

<meta name="description" content="Author: Tutor Course and After School Course, Description: menampilkan tabel Identifikasi Aktor Use Case UML (Unified Modelling Language), Rev-Number: 1.0, Language: id">

</head>

<body>

<table>

<caption>Table: Identifikasi Aktor</caption>

<thead>

<tr>

<th>ID</th>

<th>Aktor</th>

<th>Deskripsi</th>

</tr>

</thead>

<tbody>

<tr>

<td>AC01</td>

<td>Admin <em>Inventory</em></td>

<td>Aktor yang dapat mengelola data barang, mengelola data pemasok, mengelola data pelanggan, mengelola data barang masuk, mengelola data barang keluar, mengelola data persediaan barang, dan mengelola data permintaan barang.</td>

</tr>

<tr>

<td>AC02</td>

<td>Admin Pembelian</td>

<td>Aktor yang dapat melihat dan menyetujui permohonan permintaan barang</td>

</tr>

<tr>

<td>AC03</td>

<td>Admin Penjualan</td>

<td>Aktor yang dapat melihat dan menyetujui permohonan penjualan barang</td>

</tr>

<tr>

<td>AC04</td>

<td>Manajer</td>

<td>Aktor yang dapat membuat <em>user</em> baru, memiliki hak akses untuk mengedit dan menghapus <em>user</em>, melihat laporan barang masuk, laporan barang keluar, laporan daftar barang, laporan persediaan barang, laporan permintaan barang, dan laporan penjualan barang.</td>

</tr>

</tbody>

</table>

</body>

</html>

Output

Table: Identifikasi Aktor

ID	Aktor	Deskripsi
AC01	Admin Inventory	Aktor yang dapat mengelola data barang, mengelola data pemasok, mengelola data pelanggan, mengelola data barang masuk, mengelola data barang keluar, mengelola data persediaan barang, dan mengelola data permintaan barang.
AC02	Admin Pembelian	Aktor yang dapat melihat dan menyetujui permohonan permintaan barang
AC03	Admin Penjualan	Aktor yang dapat melihat dan menyetujui permohonan penjualan barang
AC04	Manajer	Aktor yang dapat membuat user baru, memiliki hak akses untuk mengedit dan menghapus user, melihat laporan barang masuk, laporan barang keluar, laporan daftar barang, laporan persediaan barang, laporan permintaan barang, dan laporan penjualan barang.

lightweight markup syntax, lightweight markup document, lightweight markup language

Bibliography

https://daringfireball.net/projects/markdown/

https://developers.google.com/

https://github.com/

http://stackoverflow.com/

https://www.tutorialspoint.com/

Salt Plant UML For ComboBox 1

Plant UML For Design A ComboBox, sample:

@startuml

salt

{

skinparam padding 10

{

title ComboBox and Label

<size:20>**Selected: Alabama**</size>

.

^<size:20>**Alabama**</size>^^<size:20><back:orange>**Alabama**</back></size>^^<size:20>**Alaska**</size>^^<size:20>**Arizona**</size>^^<size:20>**Ohio**</size>^^<size:20>**Utah**</size>^

}

}

@enduml

Output

Bibliography

https://community.devexpress.com/

https://developer.mescius.com/

https://help.syncfusion.com/

https://www.telerik.com/

https://www.youtube.com/@alexlorenlee

https://www.youtube.com/@AndyWicks

https://www.youtube.com/@BroCodez

https://www.youtube.com/@foxlearn

Related Post

Flowchart Symbol List

DDL, DQL, DML, DCL and TCL Commands

ER-Model Of A Database

Case Tools

Study About UML Diagram

Flowchart JS Symbols List

Node Syntax

nodeName=>nodeType: nodeText[|flowstate][:>urlLink]

Items in [] are optional.

nodeName defines the nodes variable name within the flowchart document.

nodeType defines what type the node is. See "Node Types" for more information.

nodeText is the text that will be inserted into the node. Newlines are allowed and will be reflected in the rendered node text.

flowstate is optional and uses the | operator that specifies extra styling for the node.

urlLink is optional and uses the :> operator to specify the url to link to.

Node Types

Node Types consist of start, end, operation, inputoutput, input, output, subroutine, condition, parallel. Defines the shape that the node will take:

start node

Used as the first node ( terminal node ) where flows start from. Default text is Start. ( Oval Shape or Pill Shape or Ellipse Shape ).

st=>start: start

end node

Used as the last node ( terminal node ) where a flow ends. Default text is End. ( Oval Shape or Pill Shape or Ellipse Shape ).

e=>end

operation node

Indicates that an operation needs to happen in the flow. ( Rectangle Shape )

op1=>operation: Operation

inputoutput node

Indicates that IO data happens in a flow. ( Parallelogram Shape )

io=>inputoutput: input and output

input node

Indicates that Input happens in a flow. ( Inverted or Upside Down Trapezium Shape or Trapezoid Shape )

inp1=>input: Input info

output node

Indicates that Output happens in a flow. ( Upright Trapezium Shape or Trapezoid Shape )

out1=>output: Print info

subroutine node

Indicates that a Subroutine or Predefined Process happens in the flow and that there should be another flowchart that documents this subroutine. ( A Rectangle With Two Lines On The Height Side Shape / A Rectangles With Double-Struck Vertical Edges Shape )

sub1=>subroutine: subroutine

condition node

Allows for a conditional or logical statement to direct the flow into one of two paths. ( Diamond Shape or Rhombus Shape )

cond=>condition: condition

Yes or No?

parallel node

Allows for multiple flows to happen simultaneously. ( The Two Horizontal Lines At The Beginning Or Ending Shape / Two Parallel Horizontal Bar Shape )

para=>parallel: parallel

Connections Operator  / Branches Operator / Directional Flow Operator

Connections are defined in their own section below the node definitions. The dash and greater than -> operator specifies a connection from one node to another like nodeVar1->nodeVar2->nodeVar3.

Not all nodes need to be specified in one string and can be separated like so

nodeVar1->nodeVar2

nodeVar2->nodeVar3

Connection syntax of Connections is as follows:

<node variable name>[(<specification1>[,<specification2>])]-><node variable name>[[(<specification1>[,<specification2>]) ]-><node variable name>]

Items in [] are optional.

Directions Specifier

The following directions are available and define the direction of the connection that will leave the node off. If there are more than one specifiers, it is always the last. All nodes have a default direction making this an optional specification. The <direction> specifier will be used to indicate that one of the following should be used in its place.

• left
• right
• top
• bottom

Node Specific Specifiers by Type

Each node variables has optional specifiers, like direction, and some have special specifiers depending on the node type that are defined below. Specifiers are added after the variable name in parentheses () and separated with comma , like nodeVar(spec1, spec2).

start node specifier

Optional direction

startVar(<direction>)->nextNode

end node specifier

No specifications because connections only go to the end node and do not leave from it.

previousNode->endVar

operation node specifier

Optional direction

operationVar(<direction>)->nextNode

inputoutput node specifier

Optional direction

inputoutputVar(<direction>)->nextNode

subroutine node specifier

Optional direction

subroutineVar(<direction>)->nextNode

condition node specifier

Required logical specification of yes or no

Optional direction

conditionalVar(yes, <direction>)->nextNode1

conditionalVar(no,  <direction>)->nextNode2

parallel node specifier

Required path specification of path1, path2, or path3

Optional direction

parallelVar(path1, <direction>)->nextNode1

parallelVar(path2, <direction>)->nextNode2

parallelVar(path3, <direction>)->nextNode3

Links

A external link can be added to a node with the :> operator.

The st node is linked to http://www.google.com and will open a new tab because [blank] is at the end of the URL.

The e node is linked to http://www.yahoo.com and will cause the page to navigate to that page instead of opening a new tab.

st=>start: Start:>http://www.google.com[blank]

e=>end: End:>http://www.yahoo.com

Names for Connections Operator / Custom Labels for Branches Operator

Connection syntax with Custom Labels for Branches operator or Names for Connections Operator is as follows:

<node variable name>[(<specification1>@<customNames>[, <specification2>@<customNames>])]-><node variable name>[[(<specification1>@<customNames>[, <specification2>@<customNames>])]-><node variable name>]

Items in [] are optional.

Example

cond(false@polynomial)->sub1(right)

Full Example

st=>start: Start:>http://www.google.com[blank]

e=>end:>http://www.google.com

op1=>operation: My Operation

sub1=>subroutine: My Subroutine

cond=>condition: linear or polynomial :>http://www.google.com

io=>inputoutput: catch something...

para=>parallel: 3 possibilities

st->op1->cond

cond(true@linear)->io->e

cond(false@polynomial)->sub1(right)

sub1(right)->para

para(path1@an1, top)->cond

para(path2@an2, right)->op1

para(path3@an3, bottom)->e

< Previous  Flowchart Symbol List

< to learn Flowchart Shapes, click Flowchart Symbol List ( Flowchart Shapes )

Next  FlowchartJS Sample >

Bibliography

http://flowchart.js.org/

https://www.drawio.com/

https://www.smartdraw.com/

Related Post

• Study About UML Diagram
• Microsoft Visio Diagram And Chart List
• DDL, DQL, DML, DCL and TCL Commands
• Top Database Comment Syntax 1
• Post Belajar Database Dan SQL Di Website Ini
• Two Dimensional Shape

Flowchart Symbol List

The Most Commonly Used Flowchart Symbols / Basic Flowchart Symbols

• The Start Of Flowchart and The End Of Flowchart ( Terminal Symbol ) or Start Terminator Action and End Terminator Action represents in Oval Shape or Pill Shape or Lozenges Shape.
• A Process Step / An Action Step / An Operation Step / A Task Step / An Activity Step represents in Rectangle Shape or Box Shape.
• The Decision Making / Alternate Flow / Branch Flow / Logic Flow / Conditional Statement / “Yes” or “No” or “True” or “False” question represents in Diamond Shape or Rhombus Shape.
• The Flow Lines / Process’ Direction / Flowchart Path To Connect The Symbols (Blocks Symbol Or Node Symbol) / Sequence Flow represents in Arrow Line Shape.
• Cross-Functional Flowchart Symbol (Swim Lanes Symbol) : Both Vertical And Horizontal Ways /  Participant's Roles And Responsibilities Shape.

Process / Operation Symbols

• A Process Step Symbol : Rectangle Shape or Box Shape;
• Predefined Process Symbol / Sub-Processes (Subroutine in programming flowcharts) Symbol : A Rectangle With Two Lines On The Height Side Shape / A Rectangles With Double-Struck Vertical Edges Shape;
• Alternate Process Symbol : A Rounded Rectangle Shape / A Rectangle With Rounded Corners Shape;
• Delay Symbol / Bottleneck Symbol : A Rectangle With Semi-Circle Shape / An Elongated Circle Shape;
• Preparation Symbol / Initialization Symbol: A Six Point Polygon Shape / A Rectangle With Pointy Bits Shape / A Hexagon Shape;
• Manual Operation Symbol (Looping Operation in data processing flowcharts) : A Trapezoid With The Longest Parallel Side Upmost Shape / Inverted Trapezoid Shape / Upside Down Trapezoid Shape;
• Loop Limit Symbol : A Rectangle With Squared-Off Top Edges Shape;

Branching and Control of Flow Symbols / Navigation Symbols

• Flow Line Symbol (Arrow, Connector) : Arrow Head Line Shape;
• Terminator Symbol (Terminal Point, Oval) : The Oval Shape / An Elongated Circle / An Ellipse;
• Decision Symbol : Diamond Shape or Rhombus Shape;
• Extract Symbol (Measurement) : The Pointed Begin Of The Triangle Shape / The Pointed Up Of The Triangle Shape / Triangle Shape / Upright Triangle Shape;
• Or Symbol : A Circle With A “Plus Sign / Vertical Cross Sign” Inside It Shape;
• Summing Junction / Summoning Junction Symbol / Cummulative Operations : A Circle With A "X Sign" Inside It Divided Into Four Slices Shape;
• Merging & Connecting Symbols
• On-Page Connector (Inspection) : Small Circle Shape;
• Off-Page Connector : Five-Pointed Polygon Shape / Pentagon Shape;
• Merge (Storage in Business Mapping) : The Pointed End Of The Triangle Shape / The Pointed Down Of The Triangle Shape / Inverted Triangle Shape / Upside Down Triangle Shape;
• Parallel Mode Symbol / Parallel Processing / Concurrent Operation : The Two Horizontal Lines At The Beginning Or Ending Shape / Two Parallel Horizontal Bar Shape;
• Annotation Symbol / Comment Symbol : An Unclose Adjustable TextBox With Bracket Shape;

Data Symbols, Document Symbols, Input and Output Symbols

• Data Symbols
• Punched Card : A Rectangle With One Chamfered Corner Shape;
• Punched Tape Symbol / Paper Tape Symbol :  A Rectangle Featuring A Rippled Bottom And Top Shape / A Rectangle With A Wavy Line Above and Below It Shape;
• Document Symbols
• Document Symbol : A Rectangle Featuring A Rippled Bottom Shape / A Rectangle With A Wavy Line Below It Shape / A Piece Of Torn Paper Shape;
• Multi-Document Symbol : Multiple Rectangles Featuring A Rippled Bottom Shape / Multiple Rectangles With A Wavy Line Below It Shape / A Stack Of Papers Shape;
• Input & Output Symbols
• Data Input Output Symbol (I/O) : A Parallelogram Shape;
• Display Symbol : An  Elongated Semi-Circle With An Isosceles Triangle On One Side Shape;
• Manual Input Symbol : A Rectangle With The Top Irregularly Sloping Up From Left To Right / The Trapezoid Shape With A Longer Top Side / Right Angled Trapezium Shape / Right Angled Trapezoid Shape;

File and Information Storage Symbols

• Stored Data Symbol (Data Storage Symbol) : A Curved Piece Of Paper Shape;
• Magnetic Disk Symbol (Database) : A Stack Of Cylinders Shape / A Cylinder Shape;
• Direct Access Storage Symbol (Hard Disk / Hard Drive) : A Cylinder Lying On Its Curved Side Shape;
• Internal Storage Symbol (RAM) : A Rectangle With Two Lines Going Across Its Length And Width Shape;
• Sequential Access Storage (Magnetic Tape) : A Reel Of Tape Shape;

Data Processing Symbols

• Collate Symbol : An Hourglass Shape;
• Sort Symbol : Two Isosceles Triangles Joined Together On The Longest Side Shape;

< Previous Flowchart Symbol List ( Flowchart Shapes )

to learn Flowchart Shapes, click Flowchart JS Symbols List >

flowchart symbol, flowchart shape, workflow, diagram

Bibliography

https://asana.com/

https://clickup.com/

https://creately.com/

https://insidemain.wordpress.com/

https://itbox.id/

https://mockflow.com/

https://nist.gov/

https://venngage.com/

https://www.breezetree.com/

https://www.computersciencecafe.com/

https://www.conceptdraw.com/

https://www.edrawsoft.com/

https://www.gliffy.com/

https://www.rff.com/

https://www.smartdraw.com/

https://www.visual-paradigm.com/

https://www.zenflowchart.com/

Related Post

• Microsoft Visio Diagram And Chart List
• UML Diagram List
• Post Belajar Database Dan SQL Di Website Ini
• Post About Database

Study About ERD / DFD

UML, Case Tools, DFD, ER-M Vocabulary

to learn about ERD ( Entity Relationship Diagram ), you can read these following lessons:

• ERD In PlantUML
• ER-Model Of A Database
• Entity Relationship Diagram ( ERD ) 2

to learn about DFD ( Data Flow Diagram ), you can read these following lessons:

• DFD ( Data Flow Diagram ) 1
• Data Definition Of DFD Operators

to learn about Database, you can read these following lessons:

• DDL, DQL, DML, DCL and TCL Commands
• SQL Queries Command
• Create Table In SQL Server
• Create Table In Microsoft Access SQL
• Microsoft Access SQL Sample
• Microsoft Access SQL Sample 2 Result 1
• Microsoft Access SQL Sample 2
• Microsoft Access SQL Sample 2 Result 2
• Contoh MySQL Table 1
• Contoh Desain Tabel Database 1
• Simple ERD Table Design In AsciiDoctor

to learn about Electronic Data Interchange, you can read these following lessons:

• CSV On The Web 1
• CSV Format File In Microsoft Excel

to learn about UML Diagram ( Unified Modeling Language ), click Study About UML Diagram >

to learn about Database in this website, click  Post Belajar Database Dan SQL Di Website Ini >

Bibliography

https://dataedo.com/

Database Management Systems Addison Wesley ( ebook )

Database Management Systems Pearson ( ebook )

Database Management Systems Wiley ( ebook )

Related Post

Data Process In Database

Proses Data Dalam Database

Data Processing

Microsoft Visio Diagram And Chart List

UML, Case Tools, DFD, ER-M Vocabulary

UML Vocabulary

to learn UML Vocabulary, click this UML Vocabulary List

Case Tools

to learn UML Vocabulary, click this Case Tools

DFD ( Data-Flow Diagram )

There are four basic symbols constructs of the DFD:

• A Process in Gane and Sarson is represents by the rounded rectangle.
  A Process in Yourdon and Coad is represents by the circle.
  Process consist of ID and Process name for easy referencing;
• Data Store or Data Repository.
  Data Stores in Yourdon and Coad represents by the parallel lines;
  Data Stores in Gane and Sarson represents by the open-ended rectangle.
  Data Store or Data Repository consist of Data Store Label and Data Store Name.
• Data Flow Connector represents by the arrow line;
  Data Flow Connector may consist of Data Flow Connector Note or Data Flow Connector Label.
• External Entity or Actors or Sources or Sinks, and Terminators is represents by the rectangle.

There are various DFD in-depth analysis with multiple detail levels:

1. A context diagram or level 0 DFD, which shows a system as a single Process, External Entity, Data Flow Connector and does not contain any data storage.
2. A level 1 diagram provides greater detail, focusing on a system’s main functions.
• A level 1 should not have more than nine process symbols.
• Use a unique reference number for each process symbol. (1, 2, 3,...); 
• Another way to avoid crossing lines is to duplicate an external entity or data store. Use a special notation such as an asterisk, to denote the duplicate symbol.
3. Diagrams that are level 2 or higher illustrate a system’s functioning with increasing detail.
• It’s rare for a DFD to go beyond level 2 because of the increasing complexity, which makes it less effective as a communication tool.
• Other process numbers are in the hierarchy of: (1.1, 1.2, 1.3, ..., 2.1, 2.2, 2.3,...); (1.1.1, 1.1.2, 1.1.3,...).

Data flow diagrams are categorized as:

• A logical data flow diagram focuses on the business and how the business operates. We can ignore implementation specifics such as, computer configuration, data storage technology, communication or message passing methods by focusing on the functions performed by the system, such as, data collection, data to information transformation and information reporting.
• A physical data flow diagram shows how the system will be implemented, including the hardware, software, files, and people in the system. It is developed such that the processes described in the logical data flow diagrams are implemented correctly to achieve the goal of the business.

ER-M ( Entity Relationship-Model )

The main constructs of the ER-M:

• Entities are represented by the rectangles.
• Strong Entity represented by the rectangles;
• Weak Entity represented by the double rectangles.
• Relationships are represented by the diamond shapes.
• Attributes are represented by the oval shapes:
• Key Attribute is represented by the oval shape with underline text;
• Composite Attribute is represented by the oval shape with bold text;
• Multivalued Attribute is represented by the double oval shape;
• Derived Attribute is represented by the dashed oval shape;
• Associated attributes / Cardinality : specifies the numerical attribute of the relationship between entities. It can be :
• one-to-one; 1 - 1
• many-to-one; * - 1 or M - 1
• many-to-many; * - 1 or M - M
• Connecting lines, solid lines.

ERD Models

The level of abstraction visualized / The level of detail you want to show:

1. conceptual ERD;
2. logical ERD;
3. physical ERD;

Conceptual ERD or data model contain :

• entities;
• relationships;

Logical ERD or data model contain:

• defining additional entities that are operational and transactional;
• relationships;
• attributes 

Physical ERD or data model contain: 

• defining entities;
• relationships;
• showing primary and foreign keys of entities instead of just their abstract semantic names. For this type of ERD, 
• attributes, cardinality and attributes types will often be listed to represent the columns of the real database table.

Study About UML Diagram

• UML Diagram List
  UML Class Diagram, UML Component (Structure) Diagram, UML Deployment Diagram
• Most Common UML Notation
  Study about Notes and Stereotypes
• UML Vocabulary List
• Apa Itu UML Diagram
  Mempelajari tipe-tipe diagram UML, Class Diagram, Package Diagram, Object Diagram, Component Diagram, Composite Structure Diagram, Deployment Diagram, Activity Diagram, Sequence Diagram, Use Case Diagram, State Diagram / Statechart Diagram / State Machine Diagram, Communication Diagram / Collaboration Diagram, Interaction Overview Diagram, Timing Diagram, dan manfaat UML Diagram.

Use Case Diagram:

• Use Case Diagram ( uml )
  System, Use Case, Actors
• Use Case Diagram 2 ( UML )
  Use case, Actor, Extension, Stereotypes
• Use Case Diagram Notation 1 ( UML )
• Tabel Identifikasi Use Case Dalam AsciiDoctor
• Tabel Identifikasi Aktor Use Case Dalam Markdown

Class Diagram and Object Diagram:

Class Diagram ( UML )

Class Diagram ( UML ) 2

Object Diagram ( UML )

Other Structure Diagrams:

Component Diagram ( UML )

Deployment Diagram ( UML )

Behavioral Diagrams:

Activity Diagram ( UML )

Activity Diagram ( UML ) 2

State Diagram ( UML )

View Of State Chart Diagram  ( UML )

Interaction Diagram:

Sequence Diagram ( UML )

Sequence Diagram ( UML ) 2

PlantUML:

• PlantUML Local Installation
• Check PlantUML Installation
• Format File Extension For PlantUML
• Hello World In PlantUML
• ERD In PlantUML
• PlantUML Sequence Diagram Message Arrow 1
• PlantUML Code About CMS
• Salt Plant UML For ComboBox 1
• Table Creole PlantUML About Microsoft Excel Arithmetic Operator
• Flowchart JS Symbols List
• Simple Ecommerce Website Navigation Diagram In Plant UML

Business Process

• A Kind Of Process Model In Technology
• Typical Operating Events In Business Process

unified modeling language, uml chart, software engineer, software developer,

Related Post

• Microsoft Visio Diagram And Chart List
• DDL, DQL, DML, DCL and TCL Commands
• Top Database Comment Syntax 1
• Two Dimensional Shape

The Most Common HTML Attributes

These following table is the most common HTML Attributes:

HTML attributes	Description	Example
id	Identifies a HTML element.	id="example"
class	Assigns an element to one or more classes.	class="cars"
style	Defines the style of an HTML element (CSS) and can determine the color, font, font size, etc.	style="color: blue; font-size: 2em"
title	Contains additional information about the content of an element; this is displayed in a tooltip when the mouse hovers over the element.	title="exampletext"
lang	Determines the language of a document.	<html lang="en">
dir	Defines the text’s running direction from left to right or vice versa.	<html dir="ltr"> example</html>

Related Post

Commonly Used HTML Tags

Most Common HTML Entities

Most Common Quotation On HTML Entities

ER-Model Of A Database

Most Common UML Notation