Handism's Tech Blog

このブログについて ​

狼の画像

現役のインハウスエンジニアによる技術ブログです。日々の業務やプライベートで得た知識の備忘録として運用しています。

当ブログはVitePressにて作成し、GitHub Pages上でホスティングしています。

SSG（静的サイト生成） × SPA（シングルページアプリケーション）に対応しているので軽快に動作するはずです。

ダークモードにも対応しており、OSの設定でダークモードをONにしている場合は自動的に背景が暗くなります。

コーディングスタイル ​

全般 ​

  • 文字列はダブルクオート優先で囲う
  • インデント：半角スペース2個

JavaScript ​

  • サイズ単位
    • 文字サイズ：px
    • マージン、パディング：rem
    • 要素のサイズ：%
  • 末尾のセミコロンは省略する
  • .vitepress/theme/components内に格納

CSS ​

  • クラス名はケバブケースで命名
  • SMACSS（スマックス）に少しだけ準拠してみる
    • ベース：.vitepress/theme/style.cssに書いてグローバルで読み込む
    • レイアウト：クラス名の頭にl-を付ける
    • モジュール：機能がわかりやすい命名にする
    • 状態：
    • テーマ：

Vue.js ​

  • script、template、styleの順で書く
  • .vitepress/theme/components内に格納