【Markdown拡張記法】テキストを書くだけでフローチャートなどが作図できる「Mermaid」の導入方法
はじめに
Mermaidは、簡単なテキストを書くだけでフローチャートやシーケンス図といったダイアグラムを動的に作成できるJavaScriptプラグインです。例えば、簡単なフローチャートを作図したい場合は以下のような構文を記述します。
flowchart LR
A["Local Computer"] - ...
【Rails】UIkit - HTML editorを使って簡単にマークダウンエディターを実装
はじめに
Ruby on RailsではAction Textという機能を使うことで簡単にリッチテキストエディターを実装することができます。
<iframe class="hatenablogcard" style="width:100%; height:155px; max-width:680px;" tit ...
【CSS】CSSだけでMarkdownのコードにファイル名をつける
はじめに
Markdownのコードに、そのコードがどのファイルのものなのかを示すためにファイル名が書いてあるとわかりやすいです。以下はQiitaの記事でコードを書いたときの一例です。
<img data-src="https://i.imgur.com/xO6MLjc.png" class="lazyload ...
【Rails】Markdownで記事を書く！「Redcarpet + Rouge」の導入・使用方法
はじめに
当ポートフォリオサイトの記事投稿画面では、長らくRails6から導入されたAction Textを使っていました（Action Textについては下記の記事をご覧ください）。
<iframe class="hatenablogcard" style="width:100%;height:155px;" ...
坂井 光太郎 / Sakai Kotaro
Ruby on Rails を中心とした Web アプリ開発全般に関する技術情報をまとめています。業務に関するご依頼・ご相談、当サイトに対するご感想やメッセージはコンタクトフォームからお気軽にお問い合わせください。
JWTについて
【React】React イチから学習《発展編》
【React】React イチから学習《基礎編》
強力なUIコンポーネントライブラリ「MUI（Material-UI）」について《トラブルシューティング編》
強力なUIコンポーネントライブラリ「MUI（Material-UI）」について《テーマ・スタイリング編》
強力なUIコンポーネントライブラリ「MUI（Material-UI）」について《コンポーネント編》
強力なUIコンポーネントライブラリ「MUI（Material-UI）」について《概要編》
インフラストラクチャ自動化ツール「Terraform」について《ベストプラクティスとトラブルシューティング編》
【CSS+JS】背景画像の視差効果（パララックス）を実装する方法
【CSS+JS】モーダルウィンドウを表示しその中にYouTube動画を動的に埋め込む
【Rails】アプリケーションサーバー「Unicorn」の基本情報と実装方法
【Git】マージにおけるfast-forwardとnon-fast-forwardの違い
MySQL Workbenchでリモートサーバー上のMySQLにSSH接続する方法【接続できない場合の対処法あり】
【Rails】忘れがちなルーティングの書き方を総復習
【Rails】忘れがちなGemfileの書き方を総復習
【Rails】M1チップ搭載MacでRuby on Railsの開発環境構築