本文へスキップ
メニュー
ダークモード

記事一覧

50件の記事

新着順更新日順人気順
すべてバックエンド・インフラガジェット開発環境・ツールSEO・アクセス解析フロントエンド

2026年 20件

  2. GASをローカル環境で開発する

    claspを使ってGoogle Apps Script（GAS）のプロジェクトをローカルで開発し、mainブランチへのpushでGitHub ActionsからGASに反映してWebアプリのデプロイを更新する手順です。初回デプロイとシークレットの登録までを説明します。

  3. Next.jsでAuth.js認証を実装する

    Next.js（App Router）で、Auth.js（NextAuth.js v4）を使ったGitHubとGoogleのソーシャルログインを実装する手順です。環境変数の設定、ログインページとマイページの作成、各プロバイダのOAuthアプリの設定までを説明します。

  4. Gitでファイル名の大文字、小文字を区別する

    macOSやWindowsでは、ファイル名の大文字・小文字だけを変えてもGitが変更を検知しません。core.ignorecaseをfalseにして検知させる方法と注意点、設定を変えずにgit mvで名前を変える方法を説明します。

  5. counter()とcounters()でCSS自動採番をシンプルに実装する

    CSSのcounter()とcounters()を使って、見出しやリストに番号を自動で振る方法を、サンプルコードと出力例で説明します。数字のフォーマットの指定と、3桁以上の0埋めの方法も扱います。

  6. JavaScriptライブラリの用途別まとめ

    JavaScriptのライブラリを、カルーセル・ライトボックス・スクロールエフェクト・アニメーション・グラフ・エディタ・シンタックスハイライトなどの用途別に、ライセンスとリポジトリを添えて一覧にしています。随時更新しています。

  8. Next.jsでPrismaからSupabaseを操作してみる

    PrismaからSupabaseのデータベースを操作する簡単なToDoリストを、Next.js（App Router）で作ります。環境構築とマイグレーション、APIの作成、ページの実装、動作確認までの手順を説明します。

  9. カスタムプロパティにSassの変数を渡すと変数のままコンパイルされてしまう

    CSSのカスタムプロパティの値にSassの変数を書くと、変数名のまま出力されます。Sassがカスタムプロパティの値を書かれたとおりに出力するためで、インターポレーション #{} を使うと変数の値を渡せます。

  10. Fractalでスタイルガイドを作ってみる #2 ― プロジェクトを0から始める方法と最もシンプルなコンポーネントの作成

    Fractalのプロジェクトを、newコマンドを使わずに0から作る方法を説明します。ディレクトリの構成、fractal.config.jsの設定、最もシンプルなコンポーネントとドキュメントのインデックスページの作成、開発サーバーの起動までを扱います。

  11. Fractalでスタイルガイドを作ってみる #1 ― インストールから始め方まで

    スタイルガイドジェネレーターのFractalを使って、Webサイトのコンポーネントをまとめたスタイルガイドを作ります。1回目は、FractalとFractal CLIのインストールと、newコマンドでプロジェクトを作って開発サーバーを起動するまでを説明します。

  12. macOSで隠しファイルを表示する

    macOSのFinderで隠しファイルを表示する方法です。キーボードショートカットで表示と非表示を切り替える方法と、ターミナルのコマンドで常に表示する設定を紹介します。

  13. 三角関数を駆使してCSSだけでローディングスピナーを作ろう！

    CSSのsin()とcos()を使って、8つの丸が回転しているように見えるローディングスピナーをCSSだけで作ります。円周上に等間隔で丸を並べる考え方から、アニメーションのずらし方までを順に解説します。

  14. buttonタグにはtype="button"をつけるべし

    buttonタグのtype属性を省略すると、既定値はsubmitになります。フォームの中で意図せず送信されないように、送信以外のボタンにはtype="button"を明示しましょう。

  15. 急上昇

    Pythonで簡易的なDiscordのBotを作成する

    PythonとVisual Studio Codeで、決まったメッセージに返事をする簡単なDiscordのBotを作ります。Discord Developer PortalでのBotの設定、discord.pyとpython-dotenvの準備、テスト用のサーバーへの追加までを紹介します。

  17. Web制作で役立つChromeの拡張機能

    Web制作やサイトの検証で役立つGoogle Chromeの拡張機能を紹介します。ページ全体のスクリーンショット、HTMLの構文チェック、meta情報の確認、使われている技術の確認、ウインドウサイズの変更などに使えるものをまとめました。

  19. macOSでgit-credential-osxkeychainのポップアップが出てきたときの対処方法

    macOSでGitを使っていると「git-credential-osxkeychainがキーチェーン内の機密情報を使用しようとしています」というポップアップが出ることがあります。その場での対処方法と、キーチェーンの項目を作り直して表示されないようにする方法を説明します。

  20. macOSにPythonの開発環境を構築する

    Homebrewでpyenvをインストールし、pyenvでPythonをインストールしてバージョンを切り替える方法を解説します。特定のディレクトリだけバージョンを変える方法や、pipのバージョンの確かめ方も紹介します。