Web-Dev-For-Beginners/translations/ja/3-terrarium/README.md

<!--
CO_OP_TRANSLATOR_METADATA:
{
  "original_hash": "7965cd2bc5dc92ad888dc4c6ab2ab70a",
  "translation_date": "2025-08-23T22:23:43+00:00",
  "source_file": "3-terrarium/README.md",
  "language_code": "ja"
}
-->
# 私のテラリウム: HTML、CSS、そしてJavaScriptを使ったDOM操作を学ぶプロジェクト 🌵🌱

小さなドラッグ＆ドロップのコード瞑想。少しのHTML、JS、CSSを使って、ウェブインターフェースを構築し、スタイルを設定し、さらに自分の選んだ複数のインタラクションを追加することができます。

![my terrarium](../../../3-terrarium/images/screenshot_gray.png)

# レッスン

1. [HTMLの紹介](./1-intro-to-html/README.md)
2. [CSSの紹介](./2-intro-to-css/README.md)
3. [DOMとJSクロージャーの紹介](./3-intro-to-DOM-and-closures/README.md)

## クレジット

♥️ を込めて [Jen Looper](https://www.twitter.com/jenlooper) によって執筆されました。

CSSで作成されたテラリウムは、Jakub Mandraのガラス瓶 [codepen](https://codepen.io/Rotarepmi/pen/rjpNZY) にインスパイアされています。

アートワークは [Jen Looper](http://jenlooper.com) によって手描きされ、Procreateの助けを借りて制作されました。

## テラリウムをデプロイする

Azure Static Web Appsを使用して、テラリウムをウェブ上にデプロイ（公開）することができます。

1. このリポジトリをフォークする

2. このボタンを押す

[![Deploy to Azure button](https://aka.ms/deploytoazurebutton)](https://portal.azure.com/?feature.customportal=false&WT.mc_id=academic-77807-sagibbon#create/Microsoft.StaticApp)

3. ウィザードを進めてアプリを作成します。アプリのルートを `/solution` またはコードベースのルートに設定することを忘れないでください。このアプリにはAPIがないので、APIの追加について心配する必要はありません。フォークしたリポジトリ内にGitHubフォルダが作成され、Azure Static Web Appsのビルドサービスがアプリをビルドし、新しいURLに公開するのを助けます。

**免責事項**:  
この文書は、AI翻訳サービス [Co-op Translator](https://github.com/Azure/co-op-translator) を使用して翻訳されています。正確性を追求しておりますが、自動翻訳には誤りや不正確な部分が含まれる可能性があります。元の言語で記載された文書が正式な情報源とみなされるべきです。重要な情報については、専門の人間による翻訳を推奨します。この翻訳の使用に起因する誤解や誤解釈について、当社は一切の責任を負いません。