# 私のテラリウム: HTML、CSS、そしてJavaScriptを使ったDOM操作を学ぶプロジェクト 🌵🌱

小さなドラッグ＆ドロップのコード瞑想。少しのHTML、JS、CSSを使って、ウェブインターフェースを構築し、スタイルを付け、インタラクションを追加できます。

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

## クレジット

♥️を込めて[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がないので、それを追加する必要はありません。フォークしたリポジトリに.githubフォルダーが作成され、Azure Static Web Appsのビルドサービスがアプリをビルドして新しいURLに公開するのを助けます。

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