You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
34 lines
1.8 KiB
34 lines
1.8 KiB
4 years ago
|
# マイテラリウム: JavaScript を使った HTML・CSS・DOM 操作を学ぶプロジェクト 🌵🌱
|
||
|
|
|
||
|
|
ちょっとしたドラッグ＆ドロップのコードメディテーション。少しの HTML、JS、CSS で、Web インターフェースを構築し、スタイルを設定し、インタラクションを追加することができます。
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
# レッスン
|
||
|
|
|
||
|
|
1. [HTML 入門](./1-intro-to-html/README.md)
|
||
|
|
2. [CSS 入門](./2-intro-to-css/README.md)
|
||
|
|
3. [DOM と JS Closures の紹介](./3-intro-to-DOM-and-closures/README.md)
|
||
|
|
|
||
|
|
## クレジット
|
||
|
|
|
||
|
|
Written with ♥️ by [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. このボタンを押します
|
||
|
|
|
||
|
|
[](https://portal.azure.com/?feature.customportal=false&WT.mc_id=cxaall-4621-cxall#create/Microsoft.StaticApp)
|
||
|
|
|
||
|
|
3. アプリを作成するウィザードに沿って進みます。アプリのルートを `/solution` またはコードベースのルートに設定してください。このアプリには API はありませんので、追加については心配しないでください。フォークされたレポに .github フォルダが作成され、Azure Static Web Apps のビルドサービスのビルドを支援し、新しい URL にアプリを公開します。
|
||
|
|
|
||
|
|
|