- コードを表示
- スクリプトの
常時実行:OFF - サンドボックス
で作り続ける - プレビューを
全画面で表示
×
Blositeって?
×
➡ ➡ ➡
Blositeへようこそ!
このサイトでは、直感的にブロックを組み合わせることで、ウェブサイトを作るための基本的な技術(HTML, CSS, JavaScript)について学びつつ、自分の思うようにサイトを作り、他の人が遊べるように公開することができます!
この文章が書かれているポップアップは、右上の「ヘルプ」からいつでも開くことができますよ!
では、次のスライドに移動しましょう。上のボタンか右下の「進む」を押してください!

移動できましたね!
このブロックはホールドして自由に配置できます。また、左側のメニューを選択するとパネルが開いて、ブロックを取り出すことができます。
テンプレートには、すでに組み合わさったブロックがいくつかあります。
ブロックにマウスポインターをかざすと説明文が出てくるので、ぜひ活用してください!
右側の丸いアイコンを押すとメニューが開かれます。機能は以下のとおりです。
- コードを表示:実際のHTMLのコードを見ることができます。興味があれば左のブロックと見比べてみてください!
- スクリプトの常時実行:OFFのときはボタンを押すたびに
<script>が実行され、ONだと右側のボタンのアイコンが切り替わり、常時実行の状態だとブロックを動かすたびに<script>が実行されます。 - サンドボックスで作り続ける:チュートリアルの内容から外れて作り続けたいときに押しましょう!サンドボックスでは作ったサイトを公開することができます。
- プレビューを全画面で表示:右側にあるプレビューを別のタブで全画面で見ることができます。

右には作ったサイトのプレビューが表示されます。丸型の実行アイコンを押してから、「押してください」と書かれたボタンを押してみましょう!
余裕のある方は、真ん中のブロックを自由に動かしたり、テキストを変えたりしてみて、右側のプレビューがどう変わるのか見てみましょう!
ブロックの意味していることがわからなくても大丈夫です!これからのチュートリアルを通じて、基本的な内容について学んでいきましょう!
進めている途中で何かわからないことがあれば、ぜひスタッフに聞きましょう!