dev HTML Playground: ビューア&エディタ

dev HTML Playgroundは、iPhoneだけでHTML/CSS/JavaScriptを「作る・動かす・見る」ための開発環境です。パソコンは必要ありません。 ■ こんな人におすすめ ・プログラミングを始めてみたいけど、パソコンを持っていない ・通勤・通学のスキマ時間にアプリ作りを楽しみたい ・AIにコードを書いてもらって、自分だけのツールを作りたい ・子どもにプログラミングの楽しさを体験させたい ・AIに書かせたHTMLの資料やレポートをiPhoneでさっと確認したい ■ 主な機能 【コードエディタ】 シンタックスハイライト付きのエディタで、HTML/CSS/JavaScriptを快適に編集。自動保存、ファイルの追加・名前変更・削除にも対応。コード編集の邪魔になる自動修正(スマート引用符など)は無効化済み。 【プレビュー】 書いたコードはワンタップで即実行。console.logの出力やエラーもアプリ内のコンソールに表示されるので、デバッグもiPhoneだけで完結します。 【AI連携】 ChatGPTやClaudeなどのAIに貼るだけの「環境説明プロンプト」を用意。AIが「何を作りましょうか?」と聞いてくるので、作りたいものを答えるだけ。返ってきたコードは「貼り付けて全置換」でワンタップ取り込み。プログラミング未経験でも作品が完成します。 【安全なデータ保存】 各プロジェクトに保存ライブラリ(storage.js)を同梱。作ったアプリのデータはプロジェクトごとに分離して永続保存されます。普通のブラウザでもそのまま動くので、作品の持ち出しも自由。 【7種類のひな形】 ・ゲーム(軍団ラッシュ): 広告でよく見る「軍団が増えるゲーム」の本物 ・ゲーム(ピン抜きの間): 広告でよく見る「ピン抜きパズル」の本物 ・空のプロジェクト: まっさらな状態から ・基本サンプル: カウンターとメモで書き方を学ぶ ・やることリスト: 実用的なTODOアプリ ・習慣カレンダー: 月めくりの習慣トラッカー ・ゲーム(NEON RUSH): ネオン調ミニゲームのフルデモ 【ホーム画面に追加】 作ったアプリはショートカット経由でホーム画面にアイコン登録OK。普通のアプリのようにワンタップで起動できます。 【書き出し】 ZIP(バックアップ用)や単一HTML(共有用)で書き出し可能。AirDropやファイルAppに保存して、作品を人に送ったりMacで続きを編集したりできます。 【HTMLビューア】 AIに書かせたHTML資料をコピーしてワンタップ表示。表示したものは履歴に残り、いつでも見返せます。気に入ったらプロジェクトとして取り込んで編集も。 【ブラウザ内蔵】 調べ物やAIサイトでの会話用にブラウザタブも搭載。アプリを離れずにAIとのやり取りが完結します。 ■ お使いのAIについて ChatGPT・Gemini・Claudeなど、お好きなAIと組み合わせて使えます。無料のAIでも十分作れますが、賢いAIほど一発で動くコードを書いてくれます。もし動かなくても大丈夫。dHPがエラーを見つけてお知らせするので、コピーしてAIに貼り返せばそのまま直せます。 すべての機能が完全無料・広告なし。あなたの「作ってみたい」を、ポケットの中で。

新しいゲームを2本追加しました。 - ひな形に「軍団ラッシュ」と「ピン抜きの間」が登場。広告でよく見るあのゲームの本物です(しかも広告なし)。最初から遊べて、AIに「ステージを足して」と頼む改造の練習台にも最適 - 「コードをコピー(AIに見せる用)」が改修ルールの説明付きになり、どのAIに貼ってもそのまま改修を頼めるようになりました - ゲームは日本語/英語の自動切り替えに対応