Unsplash登録・APIキー保存
Unsplashとは
Unsplashは、世界中のプロフェッショナルな写真家が投稿する高品質な画像を無料で利用できるプラットフォームです。
Claude CodeとUnsplash
今回のWebサイト作成ノウハウでは、Claude Codeが自動的にUnsplashから最適な画像を検索して当てはめてくれます(サブエージェント機能)。
Unsplashアカウント作成
まずは通常のユーザーアカウントを作成します。
Developer登録
APIを使うための開発者登録を行います。
APIキー取得
アプリケーションを作成してAPIキーを取得します。
この機能を使うために、「Unsplashの開発アカウント」を作成し、APIキーと呼ばれる認証用の暗号番号を取得する必要があります。
アカウント作成の手順
1. Unsplashアカウント作成
まず、Unsplash.comでユーザーアカウントを作成します。
登録時のポイント
- メールアドレス: 普段使用しているメールアドレスでOK
- パスワード: 安全なパスワードを設定しましょう
- Google連携: Googleアカウントで簡単に登録できます
2. Developer登録
通常のアカウント作成が完了したら、Developer(開発者)として登録します。
3. アプリケーション作成
Developer登録後、APIキーを取得するための「アプリケーション」を作成します。
“New Application"をクリック
Developer登録ページで"New Application"ボタンを探してクリックします。
利用規約に同意
Unsplash APIの利用規約とガイドラインを読み、チェックボックスにチェックを入れます。
アプリケーション情報を入力
以下の情報を入力します:
- Application name:
My Websiteなど、わかりやすい名前 - Description:
Personal website projectなど、簡単な説明
“Create application"をクリック
入力内容を確認して、アプリケーションを作成します。
APIキーの取得と保存
アプリケーション作成後、APIキーが表示されます。
APIキーの確認
作成したアプリケーションの詳細ページで、以下の情報が表示されます:
Claude Codeへの設定
取得したAPIキー(Access Key)をClaude Codeに設定します。
APIキーをコピー
Access Keyの横にあるコピーボタンをクリックします。
環境変数に設定する
環境変数に設定する作業は、たった１度きりで良いです
macOSの場合は、以下のコマンドをメモ帳にコピーして、 your_access_key_here と書かれた場所をAPIキーに書き換えて、ターミナルを開いて実行します。失敗した場合や、うまくいかない場合は、 .zshrc ファイルを開いて修正して下さい。
macOSの場合、ターミナルを開き、以下を実行します。
grep -q "UNSPLASH_ACCESS_KEY" ~/.zshrc || echo 'export UNSPLASH_ACCESS_KEY="your_access_key_here"' >> ~/.zshrcWindowsの場合も、以下のコマンドをメモ帳などにコピーして、 your_access_key_here を書き換えて、実行して下さい。うまくいかない場合、修正するには、環境変数の設定を開いて修正して下さい。
if (-not [System.Environment]::GetEnvironmentVariable("UNSPLASH_ACCESS_KEY", "User")) { [System.Environment]::SetEnvironmentVariable("UNSPLASH_ACCESS_KEY", "your_access_key_here", "User") }