VS CodeやSublimeTextなどWEB関連のソース(HTML,CSS,プログラム)を記述する時の環境についてのTipsをメモっていきます

VS Code MarkDown Preview Enhanced サンプル

● サンプル1

\```flow
  st=>start: Start
  op=>operation: Your Operation
  cond=>condition: Yes or No?
  e=>end
  st->op->cond
  cond(yes)->e
  cond(no)->op
\```

● サンプル2

\```flow
   st=>start: Start|past:>http://www.google.com[blank]
   e=>end: End:>http://www.google.com
   op1=>operation: get_hotel_ids|past
   op2=>operation: get_proxy|current
   sub1=>subroutine: get_proxy|current
   op3=>operation: save_comment|current
   op4=>operation: set_sentiment|current
   op5=>operation: set_record|current
       cond1=>condition: ids_remain empty?
       cond2=>condition: proxy_list empty?
       cond3=>condition: ids_got empty?
       cond4=>condition: successful crawling??
       cond5=>condition: ids_remain empty?
   io1=>inputoutput: ids-remain
   io2=>inputoutput: proxy_list
   io3=>inputoutput: ids-got
   st->op1(right)->io1->cond1
   cond1(yes)->sub1->io2->cond2
   cond2(no)->op3
   cond2(yes)->sub1
   cond1(no)->op3->cond4
   cond4(yes)->io3->cond3
   cond4(no)->io1
   cond3(no)->op4
   cond3(yes, right)->cond5
   cond5(yes)->op5
   cond5(no)->cond3
   op5->e
\```

● サンプル3

\```mermaid
graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;
\```

● サンプル4

\```mermaid
sequenceDiagram
    participant Alice
    participant Bob
    Alice->>John: Hello John, how are you?
    loop Healthcheck
        John->>John: Fight against hypochondria
    end
    Note right of John: Rational thoughts <br/>prevail...
    John-->>Alice: Great!
    John->>Bob: How about you?
    Bob-->>John: Jolly good!
\```
No.1998
05/28 16:45

edit