タコキンのPスクール・ブログ

今回はSvelteアプリ作成に慣れるために、HTML＆CSSゲームなどに応用のできるタイマーっぽいものを一から作成する過程を解説してみます。

このページでは自前で簡単に作れるHtml&Cssゲーム「四択クイズ」の作成過程をまとめています。Scratchプログラミングを卒業し、本格的なプログラミングをスタートしたい中高生向けの内容になっております。

不定期で四択クイズミニゲームのリファクタリングを進めていく話の第７段です。今回はこれまでネイティブなHTML&CSSを使って作ってきた四択クイズアプリをSvelteアプリとして再構築・マイグレーションする手順を解説していきます。

不定期で四択クイズミニゲームのリファクタリングを進めていく話の第６段です。今回はJavascriptフレームワークを導入してHTML&CSSアプリを開発していく前に知っておきたい基本事項を確認していきます。

不定期で四択クイズミニゲームのリファクタリングを進めていく話の第５段です。今回はSassリストを使ってで四択クイズミニゲームのデータ構造を動的に管理する方法を検討します。

不定期で作成中の四択クイズミニゲームのリファクタリングを進めていく話の第４段です。今回はHTMLのスクリプトタグにあるJavascriptコードの見直しを図ります。

不定期で作成中の四択クイズミニゲームのリファクタリングを進めていく話の第３段。今回はSassリストを高度に使いこなし、HTML擬似要素の内容を初期化する方法を紹介します。

Scratchゲームはキーボードから操作する基本的になっていますが、でもやっぱりゲームと言ったらコントローラーで操作したい、と感じられる方も多いでしょう。今回から数回に渡って、Scratchで使える自作コントローラーを作成してゲームを動かせるまでを解説していきます。

不定期で作成中の四択クイズミニゲームのリファクタリングを進めていく話の第２段です。今回はCSS擬似要素のcontentプロパティを活用したデータ埋め込みのSassならではのテクニックを紹介します。

今回は一部のブラウザで利用可能となっている「Web Serial API」を利用して、Scratchの拡張機能から問題なくシリアル通信が使えるようになっているかを検証してみました。