NotesHub - Take Notes, Sync and Collaborate
Welcome to NotesHubFully cross-platform, vendor-agnostic, Markdown-based note-taking app Offline-FirstWhether you're soaring through the skies or exploring the wilderness, your notes will always be at your fingertips. You can even edit them, delete, add, etc. All the content will be synced once the connection is restored. Auto SyncYour notes will be periodically synced with the remote location usi
Mermaid 入門ã—ã¦ã¿ãŸãƒ¡ãƒ¢(flowchart ã§åŠ›å°½ããŸâ€¦)
GitHub 㧠Markdown ã®ä¸ã« Mermaid を埋ã‚込んã ら表示ã—ã¦ãれる機能ãŒãƒãƒ¬ãƒ³ã‚¿ã‚¤ãƒ³ デーã«ãƒªãƒªãƒ¼ã‚¹ã•ã‚Œã¾ã—ãŸã€‚ 今ã¾ã§ Mermaid ã¯çŸ¥ã‚‰ãªãã¦ã€ãƒ†ã‚ストã§ã‚¢ã‚¯ãƒ†ã‚£ãƒ“ティ図やクラス図ã¿ãŸã„ãªã‚‚ã®ã‚’書ãå¿…è¦ãŒã‚ã‚‹ã¨ã㯠PlantUML を使ã£ã¦ã¾ã—ãŸãŒ GitHub ãŒå¯¾å¿œã—ãŸã¨ã„ã†ã“ã¨ã§ Mermaid ã«å…¥é–€ã—ã¦ã¿ã‚ˆã†ã¨æ€ã„ã¾ã™ã€‚ å› ã¿ã«ã€ã“ã®è¨˜äº‹ã‚’書ã始ã‚ãŸæ™‚点ã§ã¯ã€ã¾ã 何もやã£ã¦ã„ãªã„ã®ã§ Mermaid ã«ã¤ã„ã¦ã¯åå‰ã¨å›³ãŒæ›¸ã‘るらã—ã„ã¨ã„ã†ã“ã¨ã—ã‹çŸ¥ã‚Šã¾ã›ã‚“。 ã§ã¯ã€ã‚„ã£ã¦ã¿ã‚ˆã†ã¨æ€ã„ã¾ã™ã€‚ 試ã™ãŸã‚ã®ç’°å¢ƒ Visual Studio Code ã® Markdown Preview Mermaid Support を入れるã“ã¨ã§ Markdown ã®ãƒ—レビュー機能㌠Mermaid ã®ãƒ—レビューã«å¯¾å¿œã—ã¾ã™ã€‚ å°Žå…¥å‰ã¯ã“ã‚“ãªæ„Ÿã˜ã§ã™ãŒ 拡張機能を入れ
HTMLã®é™çš„サイトã§ã‚‚マークダウンã§è¨˜äº‹ã‚’書ããŸã„ã€jQuery/markdown-it.js】
サイトをコーディングã—ã¦ã„ã‚‹ã¨ã€ WordPressを構築ã™ã‚‹ã»ã©ã˜ã‚ƒãªã„ã‘ã©è¨˜äº‹ãƒšãƒ¼ã‚¸ãŒã‚ã‚‹ å°è¦æ¨¡ãªã‚µã‚¤ãƒˆã§ä¼šç¤¾æ¦‚è¦ã ã‘マークダウンã§ä½œæˆã—ãŸã„ ãƒãƒ¼ãƒˆãƒ•ã‚©ãƒªã‚ªã‚µã‚¤ãƒˆç‰ã§åˆ¶ä½œç‰©ã®ãƒšãƒ¼ã‚¸ã ã‘マークダウンã§ç®¡ç†ã—ãŸã„ ã¨ã„ã†çŠ¶æ³ãŒè‡ªåˆ†è‡ªèº«ã€çµæ§‹ã‚ã‚Šã¾ã—ãŸã€‚ マークダウンã‹ã‚‰HTML化ã•ã›ã‚‹VSCodeã®æ‹¡å¼µæ©Ÿèƒ½ã¨ã‹ã‚‚ã‚ã‚Šã¾ã™ãŒã€ãƒžãƒ¼ã‚¯ãƒ€ã‚¦ãƒ³ã®æ–‡è¨€å«ã‚ã¦GitHubã§ç®¡ç†ã—ãŸã„ãªã¨æ€ã„ã€jQueryã¨markdown-it.jsã¨ã„ã†ã®ã‚’使ã£ã¦HTML＋マークダウンã§ç°¡æ˜“ãªè¤‡æ•°ãƒšãƒ¼ã‚¸ã®ã‚µã‚¤ãƒˆã‚’構築ã™ã‚‹ã‚³ãƒ¼ãƒ‰ã‚’ã¾ã¨ã‚ã¾ã—ãŸã€‚ 最低é™ã®ã‚µãƒ³ãƒ—ルコード ã¾ãšã¯ã€ãƒžãƒ¼ã‚¯ãƒ€ã‚¦ãƒ³ã§ä½œæˆã§ãる最低é™ã®ã‚³ãƒ¼ãƒ‰ã‚’紹介ã—ã¾ã™ã€‚ js-markdown-editerã¨ã„ã†ã‚¯ãƒ©ã‚¹å†…ã®éƒ¨åˆ†ãŒãƒžãƒ¼ã‚¯ãƒ€ã‚¦ãƒ³ã§æ›¸ãã¨å¤‰æ›ã•ã‚Œã‚‹ã‚ˆã†ã«ãªã‚Šã¾ã™ã€‚（インデントã¤ã‘ã‚‹ã¨ã‚³ãƒ³ãƒ‘イルã•ã‚Œãªã„ã§ã™â€¦ðŸ˜ï¼‰ <!-- マークダウン記述箇所
Vivliostyle — 楽ã—ã CSS 組版ï¼
CSS Typesetting 最新 Web 標準技術ã«ã‚ˆã‚Šã€é›»å出版や Web 出版ã®ãŸã‚ã® æ–°ã—ã„組版システムを作るオープンソース・プãƒã‚¸ã‚§ã‚¯ãƒˆ
技術文書ã®æ›¸ãæ–¹
howto-tech-docs.md 技術文書ã®æ›¸ãæ–¹ ã“ã®ãƒ¡ãƒ¢ã¯ã€ç§ï¼ˆ@ymmt2005）ãŒé•·å¹´ã«ã‚ãŸã£ã¦ã‚½ãƒ•ãƒˆã‚¦ã‚§ã‚¢ãƒ—ãƒãƒ€ã‚¯ãƒˆé–‹ç™ºã«é–¢ã‚ã£ã¦ã㦠2022å¹´ç¾åœ¨ã“ã†ã—ãŸã»ã†ãŒè‰¯ã„ã¨è€ƒãˆã¦ã„るベストプラクティスã§ã™ã€‚ 科å¦çš„ãªåˆ†æžç‰ã«åŸºã¥ãã‚ã‘ã§ã¯ãªã„経験則ã§ã‚ã‚‹ãŸã‚ã€ä»Šå¾Œã‚‚éšæ™‚見直ã™ã“ã¨ãŒã‚ã‚Šã¾ã™ã—〠ã“ã“ã«æ›¸ã„ã¦ã‚ã‚‹ã“ã¨ãŒå¸¸ã«æ£ã—ã„ã‚ã‘ã§ã‚‚ã‚らゆるソフトウェア開発ã«é©ã™ã‚‹ã‚ã‘ã§ã‚‚ã‚ã‚Šã¾ã›ã‚“。 ã—ã‹ã—ãªãŒã‚‰ã€å®Ÿå‹™çµŒé¨“ãŒè±Šå¯Œã§ã€ãƒ¢ãƒ€ãƒ³ãªæŠ€è¡“スタックã«æ˜Žã‚‹ã„エンジニアã®çµŒé¨“則ã¯ä¸€å®šã® å½¹ã«ç«‹ã¤ã®ã§ã¯ãªã„ã‹ã¨è€ƒãˆã¦è¨˜ã—ã¾ã™ã€‚ 技術文書ã¨ã¯ ã“ã“ã§ã¯ã€ã‚½ãƒ•ãƒˆã‚¦ã‚§ã‚¢é–‹ç™ºã§æŠ€è¡“者ãŒæ›¸ãã¹ã文書ã¨ã„ã†ã“ã¨ã«ã—ã¾ã™ã€‚ ソフトウェアエンジニアã«ã‚‚役割ãŒã„ã‚ã„ã‚ã‚ã‚Šã€ã‚¢ãƒ¼ã‚テクト㨠independent contributor ã§ã¯æ›¸ã文書ãŒé•ã†ã¨ã„ã†ã“ã¨ã¯ã‚ã‚‹ã§ã—ょã†ã‘ã‚Œã©ã€ã“ã“ã§ã¯ã”ã£ã¡ã‚ƒã«ã—ã¾ã™ã€‚
Markdownã‹ã‚‰ç›´æŽ¥PowerPointを作æˆã™ã‚‹ - 広告ï¼çµ±è¨ˆï¼ã‚¢ãƒ‹ãƒ¡ï¼æ˜ 画　ç‰ã«é–¢ã™ã‚‹ãƒ–ãƒã‚°
ã¡ã‚‡ã£ã¨å‰ã¾ã§ã¯ã€Markdownã‹ã‚‰PDFやワードファイルã«ã§ãã¦ã‚‚PpwerPointã«ã™ã‚‹ã®ã¯å†ç¾æ€§ãŒåŽ³ã—ã„ã‚‚ã®ãŒã‚ã‚Šã¾ã—ãŸã€‚ ※以å‰ã®è¨˜äº‹ yyhhyy.hatenablog.com ã—ã‹ã—ã„ã¤ã®é–“ã«ã‹PandocãŒPowerPointã¸ã®å¤‰æ›ã‚‚サãƒãƒ¼ãƒˆã—ã¦ã„ã¾ã—ãŸã€‚ 使ã„æ–¹ ※ Pandocã®ã‚¤ãƒ³ã‚¹ãƒˆãƒ¼ãƒ«ã¾ã§ã¯æ§˜ã€…ãªã‚µã‚¤ãƒˆãŒã‚ã‚Šã¾ã™ã®ã§å‰²æ„›ã—ã¾ã™ã€‚ã‚ã¨ã‚‚ã†ã¡ã‚‡ã£ã¨ã“ã†ã„ã†ã“ã¨ãŒã§ããŸã‚‰è‰¯ã„ãªã€ã®éƒ¨åˆ†ã‚’以下ã«æŠœç²‹ã—ã¾ã—ãŸã€‚ PowerPointã®ãƒ•ã‚©ãƒ¼ãƒžãƒƒãƒˆã‚’指定ã—ãŸã„ 自分1人ã§ã‚¹ãƒ©ã‚¤ãƒ‰ä½œæˆãŒå®Œçµã™ã‚‹ãªã‚‰PDFã§ã‚‚HTMLスライドã§ã‚‚å•é¡Œã‚ã‚Šã¾ã›ã‚“。ã—ã‹ã—æ•¢ãˆã¦PowerPointファイルã«ã™ã‚‹å¿…è¦ãŒã‚ã‚‹ã€ã¨ã„ã†ã“ã¨ã¯ã€ãƒ‘ワãƒã«ã—ã¦èª°ã‹ã¨å…±æœ‰ã™ã‚‹å¿…è¦ãŒã‚ã‚‹ã¨ã„ã†ã‚±ãƒ¼ã‚¹ã ã¨æ€ã‚ã‚Œã¾ã™ã€‚ ãã®éš›ã€èª²é¡Œã¨ãªã‚‹ã®ãŒã€ã‚¹ãƒ©ã‚¤ãƒ‰ãƒžã‚¹ã‚¿ã‚’ã‚ã‚ã›ãŸã„ã€ãƒ•ã‚©ãƒ³ãƒˆã‚’ä½µã›ãŸã„ã¨ã„ã£ãŸãƒ‹ãƒ¼ã‚ºã§ã—ょã†ã€‚
Markdownã§ã‚·ãƒ¼ã‚±ãƒ³ã‚¹å›³ã¨ã‹ãŒæ›¸ã‘ã‚‹Mermaid記法ã§æ¥å‹™ãƒ•ãƒãƒ¼ã‚’書ã„ãŸã‚‰æ„外ã¨ã‚¤ã‚±ãŸã®ã§è‡ªåˆ†ãªã‚Šã®ã‚³ãƒ„を紹介ã—ã¦ã¿ã‚‹ | DevelopersIO
ã“ã‚“ã«ã¡ã¯ã€è‡¼ç”°ã§ã™ã€‚ ã¿ãªã•ã‚“ã€æ¥å‹™è¨è¨ˆã—ã¦ã¾ã™ã‹ï¼Ÿ(挨拶 今回ã¯Markdownã§ã‚·ãƒ¼ã‚±ãƒ³ã‚¹å›³ã‚„フãƒãƒ¼ãƒãƒ£ãƒ¼ãƒˆãªã©ã®å›³ã‚’記述ã§ãã‚‹Mermaidを使ã£ã¦æ¥å‹™ãƒ•ãƒãƒ¼ã‚’書ã„ã¦ã¿ãŸã‚‰ã€æ„外ã¨æ›¸ã‘ãŸã®ã§è‡ªåˆ†ãªã‚Šã®Tipsを紹介ã—ãŸã„ã¨æ€ã„ã¾ã™ã€‚ ãã®å‰ã« 注æ„点ã¨ã—ã¦ã€ã¾ã Mermaidを使ã„始ã‚ãŸã°ã‹ã‚Šãªã®ã§ã€ã€Œã‚‚ã£ã¨ã“ã†ã—ãŸã‚‰ã„ã„ãžã€ã¨ã‹ã€Œã“ã£ã¡ã®ã»ã†ãŒã„ã„ãžã€ã¨ã‹ã‚ã‚Œã°å»ºè¨çš„ãªãƒ•ã‚£ãƒ¼ãƒ‰ãƒãƒƒã‚¯ã¨ã—ã¦SNSã¨ã‹ã§ã„ãŸã ã‘ã‚‹ã¨ã‚ã‚ŠãŒãŸã„ã§ã™ã€‚ ã‚ã¨æ¥å‹™ãƒ•ãƒãƒ¼ã£ã¦è¡¨ç¾ã—ã¾ã—ãŸãŒã€äººã«ã‚ˆã£ã¦æ€ã„æãæ¥å‹™ãƒ•ãƒãƒ¼ãŒé•ã†ã¨æ€ã†ã®ã§ã€æ¥å‹™ãƒ•ãƒãƒ¼ã®å®šç¾©ã«é–¢ã™ã‚‹ãƒ„ッコミã¯ã”容赦ãã ã•ã„。ç§ãŒä»Šå›žMermaidã§æ›¸ã„ãŸã®ã¯ä»¥ä¸‹ã®å›³ã§ã™ã€‚(内容ã¯ãƒ–ãƒã‚°ç”¨ã«ç°¡ç´ 化ã—ã¾ã—ãŸ) ã“ã®å›³ã®ã‚³ãƒ¼ãƒ‰ã¯ä»¥ä¸‹ã®ã¨ãŠã‚Šã§ã™ã€‚(後ã»ã©è§£èª¬ã—ã¾ã™) sequenceDiagram autonumber actor ãŠå®¢æ§˜ partic
1
リリースã€éšœå®³æƒ…å ±ãªã©ã®ã‚µãƒ¼ãƒ“スã®ãŠçŸ¥ã‚‰ã›
最新ã®äººæ°—エントリーã®é…ä¿¡
j次ã®ãƒ–ックマーク
kå‰ã®ãƒ–ックマーク
lã‚ã¨ã§èªã‚€
eコメント一覧を開ã
oページを開ã
Visual Studio Code＋Markdownã§ã‚レイãªãƒ—レゼンスライドを手軽ã«ä½œæˆã§ãる「Marpã€ï¼Markdownã«æ…£ã‚Œã¦ã„ã‚‹ã®ãªã‚‰ã°ã¡ã‚‡ã£ã¨ã—ãŸæ‹¡å¼µè¨˜æ³•ã‚’覚ãˆã‚‹ã ã‘ã€ãƒ¬ãƒ“ュー】
{{#tags}}- {{label}}
{{/tags}}