Posts

概要 このレポートで説明されている手順では、macOSでAutomatorを使用してクイックアクションを作成する方法を説明します。このクイックアクションは、テキストをファイル名に適した形式に変換するために使用できます。変換プロセスでは、特殊文字を削除し、テキストを小文字に変換し、スペースをハイフンに置き換えます。 手順 Automatorを開く Cmd + Space を押してSpotlightを開き、「Automator」と入力し、Enter を押します。 新しいサービスを作成する Automatorアプリで「Quick Action」（以前は「Service」と呼ばれていました）を選択し、「Choose」をクリックします。 クイックアクションを設定する 新しいウィンドウの上部で、「Workflow receives current」のドロップダウンメニューを「text」に変更します。 「in」ドロップダウンが「any application」に設定されていることを確認します。 「Run Shell Script」アクションを追加する 左側の検索バーに「Run Shell Script」と入力し、アクションを右側のペインにドラッグします。 「Run Shell Script」アクションを設定する 「Pass input」を「as arguments」に変更します。 以下のスクリプトをテキストボックスに貼り付けます。 for text_input in "$@" do echo "$text_input" | sed 's/[^a-zA-Z0-9 ]//g' | tr '[:upper:]' '[:lower:]' | sed 's/ /-/g' done 「Copy to Clipboard」アクションを追加する 左側の検索バーに「Copy to Clipboard」と入力し、アクションを右側のペインに、「Run Shell Script」アクションの下にドラッグします。 クイックアクションを保存する Cmd + S を押してクイックアクションに名前を付け（例：「テキストをファイル名に変換」）、保存します。 これで、スクリプトはmacOSサービスをサポートするテキストエディタの右クリックコンテキストメニューから使用できるようになりました。 スクリプトの使用方法： テキストエディタでテキストブロックを選択します。 選択したテキストを右クリックします。 「Services」または「Quick Actions」（macOSのバージョンによって異なります）に移動します。 「テキストをファイル名に変換」アクションを選択します。 処理されたテキストがクリップボードにコピーされ、必要な場所に貼り付けることができます。...

概要 rustupは、Rustプログラミング言語の公式のツールチェーンインストーラーおよびマネージャーです。システム上で複数のRustツールチェーンをインストール、更新、管理する便利な方法を提供します。このレポートでは、各プラットフォームのインストールプロセス、rustupの基本的な使用方法、複数のRust環境の管理例について説明します。 インストール macOSおよびLinux macOSおよびLinuxシステムにrustupをインストールするには、ターミナルを開いて、次のコマンドを入力します。 curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh スクリプトは必要なコンポーネントをダウンロードしてインストールします。完了したら、ターミナルを再起動するか、次のコマンドを実行してシェルの環境変数を更新します。 source $HOME/.cargo/env Windows Windowsユーザーの場合は、公式Rustウェブサイトからrustup-init.exe実行可能ファイルをダウンロードして実行します。画面の指示に従ってインストールを完了します。インストールが完了したら、コマンドプロンプトまたはターミナルを再起動します。 使用方法 特定のRustバージョンのインストール 特定のRustバージョンをインストールするには、次のコマンドを使用します。 rustup install <version> <version>をインストールしたいRustバージョン（例：1.52.0）に置き換えてください。 デフォルトのRustバージョンの設定 新しいプロジェクトのデフォルトのRustバージョンを設定するには、次のコマンドを使用します。 rustup default <version> <version>を設定したいRustバージョン（例：1.52.0）に置き換えてください。 Rustバージョンの切り替え 特定のプロジェクトで異なるRustバージョンを切り替えるには、プロジェクトディレクトリに移動して、次のコマンドを使用します。 rustup override set <version> <version>を切り替えたいRustバージョン（例：1.52.0）に置き換えてください。 Rustの更新 インストールされているすべてのRustツールチェーンを最新バージョンに更新するには、次のコマンドを実行します。 rustup update Rustのアンインストール Rustとrustupをシステムからアンインストールするには、次のコマンドを実行します。 rustup self uninstall 例 あなたがproject_oldとproject_newという2つのRustプロジェクトに取り組んでいるとします。project_oldはRustバージョン1.52.0が必要であり、project_newは最新の安定版が必要です。 最初に、必要なRustバージョンをインストールします。 rustup install 1.52.0 rustup install stable 次に、project_oldディレクトリに移動してプロジェクトのRustバージョンを設定します。 cd project_old rustup override set 1.52.0 次に、project_newディレクトリに移動してプロジェクトのRustバージョンを設定します。 cd project_new rustup override set stable これらの設定により、各プロジェクトをビルドまたは実行するときに適切なRustバージョンが使用されます。...

このブログ投稿では、GitHub Actionsを使用して、Hugo静的サイトをGitHub Pagesにデプロイする方法について説明します。GitHub Actionsは、GitHubが提供する自動化機能で、GitHubリポジトリ内でカスタムソフトウェア開発ワークフローを直接作成できます。GitHub Actionsを使用することで、Hugo静的サイトをGitHub Pagesにビルドしてデプロイするプロセスを簡単に自動化できます。 GitHub Pages設定の構成 GitHub Actionsを使用して、Hugo静的サイトをGitHub Pagesに正常にデプロイするには、プロジェクトのGitHub Pages設定を構成する必要があります。 GitHubプロジェクトページに移動し、右上隅の「Settings」タブをクリックします。 「Pages」セクションにスクロールします。 「Build and deployment」設定で、「Source」ドロップダウンメニューを見つけます。 利用可能なオプションから「GitHub Actions」を選択します。これにより、GitHub PagesがGitHub Actionsで生成されたアーティファクトを使用してデプロイするようになります。 GitHub Pagesの設定を構成したので、hugo.yamlファイルで定義されたワークフローを使用してサイトをデプロイできるようになりました。 GitHub Pagesワークフローの設定 HugoとGitHub Actionsを使用したGitHub Pagesワークフローを設定するには、次の手順を実行します。 Hugoサイトのリポジトリの.github/workflows/ディレクトリにhugo.yamlという名前の新しいファイルを作成します。 次のYAML構成をhugo.yamlファイルにコピーします： name: Deploy Hugo site to Pages on: # Runs on pushes targeting the default branch push: branches: - main # Allows you to run this workflow manually from the Actions tab workflow_dispatch: # Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages permissions: contents: read pages: write id-token: write # Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued....

このブログ記事では、PaperModテーマを使用してHugoブログにAdBlocker検出機能を追加する方法を学びます。広告ブロッカーを有効にしたユーザーに対して、無効化するかサイトをホワイトリストに登録するように促す、簡単な警告メッセージを含めます。 概要 以下は、私たちが行う手順の概要です： 警告メッセージのスタイルを指定するためのカスタムCSSファイルを作成します。 広告ブロッカーを検出するためのJavaScriptファイルを作成します。 警告メッセージ用のpartial HTMLファイルを追加します。 headとfooterのpartialsを拡張して、新しいファイルを含めます。 ステップバイステップのガイド 1. カスタムCSSファイルの作成 assets/css/extended/ディレクトリにcustom_css.cssという新しいファイルを作成し、以下のCSSコードを貼り付けます： #adblock-warning { background-color: #f2dede; color: #a94442; border-color: #ebccd1; padding: 15px; margin-bottom: 20px; border: 1px solid transparent; border-radius: 4px; } 2. 広告ブロッカーを検出するJavaScriptファイルの作成 static/js/ディレクトリにadblock-detection.jsという新しいファイルを作成し、以下のJavaScriptコードを貼り付けます： function detectAdBlocker() { const adBlockTest = document.createElement('div'); adBlockTest.innerHTML = '&nbsp;'; adBlockTest.className = 'ad ads adbadge doubleclick BannerAd adsbox ad-placeholder ad-placement'; document.body.appendChild(adBlockTest); window.setTimeout(() => { if (adBlockTest.offsetHeight === 0) { document.getElementById('adblock-warning').style.display = 'block'; console.log('Ad-blocker detected.'); } else { console....

このブログ投稿では、nvm（Node Version Manager）とautoenvを一緒に使用して、開発ワークフローでNode.jsのバージョンと環境変数を管理する方法について学びます。このガイドでは、すでにシステムにnvmとautoenvがインストールされていることを前提としています。 NVMとAutoenvを一緒に使う理由 nvmは、システム上で複数のNode.jsバージョンを管理するための素晴らしいツールで、簡単に切り替えることができます。autoenvは、ディレクトリに入ると.envファイルから自動的に環境変数を読み込んで簡単に管理することができます。 両方を組み合わせることで、開発環境を自動的に適切なNode.jsバージョンに切り替え、関連する環境変数を読み込むように設定し、ワークフローを簡素化することができます。 .envファイルの作成 まず、プロジェクトのルートディレクトリに.envファイルを作成します。このファイルには、プロジェクトで使用する環境変数とNode.jsバージョンが含まれます。 以下は.envファイルの例です： export NODE_ENV=development export API_KEY=your_api_key_here export PORT=3000 export NVM_DIR="$HOME/.nvm" nvm use 14.17.0 この例では、NODE_ENV、API_KEY、およびPORT環境変数を設定しています。また、nvmディレクトリへのパスを指定し、プロジェクトにNode.jsバージョン14.17.0を使用するように指示しています。 NVMをAutoenvと一緒に使う .envファイルを設定したら、autoenvをnvmと連携するように設定する必要があります。シェルに応じて、.autoenv.zshまたは.autoenv.shファイルに以下の行を追加します： source "$NVM_DIR/nvm.sh" この行により、autoenvが.envファイルを読み込むときにnvmコマンドが利用可能になります。 プロジェクトの設定 設定が完了したら、ターミナルを使用してプロジェクトのルートディレクトリに移動します。autoenvから.envファイルが読み込まれたことを示すメッセージが表示されるはずです： $ cd your_project_directory autoenv: autoenv: Loading .env autoenv: Switching to Node.js v14.17.0 これで、指定されたNode.jsバージョンと.envファイルからの環境変数が自動的にプロジェクトに設定されます。 プロジェクトの切り替え 異なる.envファイルを持つプロジェクト間を移動する場合、autoenvとnvmは自動的にNode.jsバージョンと環境変数を適切に調整します： $ cd another_project_directory autoenv: autoenv: Loading .env autoenv: Switching to Node.js v12.22.1 これにより、異なるNode.jsバージョンと環境を管理することが簡単になります！ 結論 nvmとautoenvを組み合わせることで、プロジェクトのNode.jsバージョンと環境変数の管理を大幅に簡素化することができます。これにより、開発プロセスがより効率的になり、各プロジェクトに適切な設定を常に使用することができます。