プログラミングがまったくはじめての人でも、HTML5+CSS3+JavaScriptを使って簡単なサンプルを作りながら、Android/iPhoneの両方に対応したWebアプリの作成を楽しく体験できる入門書です。全9章を順番に読み進めることで、HTML5アプリの基礎知識、アプリ作成に必要な準備、コードの書き方などが理解できます。章ごとに短いトピックで区切られているので、自分のペースで学べます。PCスクールなどの教材としても適しています。
技術が変わっても、ずっと使えるサイトの「正しい」作り方がわかる!「応用力」と「考える力」が身につく!
CSSフレームワーク「Bootstrap」で実践するマルチデバイス対応。現場で使える最新コーディング。コードの記述から本格的Webサイト制作まで網羅!CSSフレームワークの種類や入手についても解説!パソコンからスマートフォンまで自在にレイアウト!
第1章ではHTMLやCSSの仕様そのものや、過去の制作アプローチなどについて、読み物的に触れます。
第2章以降ではHTML5とCSS3を中心に、技術や考え方について基本事項を扱います。
特に、近年ではモバイル対応の重要性が増しているので、モバイル対応の基本的な部分についても触れていきます。
全体としてはサンプルのWebサイトを制作するようなチュートリアルものではなく、文書のマークアップを理解するための情報を適宜提供しています。
(本書は2014年発売の『今、見直すHTML』と『今、見直すCSS』を合本し、改訂したものです)
◆◆3万7000人がこの本から始めた!◆◆
◆◆プログラミング超入門書の定番書籍を改訂◆◆
全くのプログラミング初心者も、他の入門書や教室・動画で挫折しちゃった人も、つまずく所はみんな同じ…。そこを徹底分析した入門教室が秋葉原にあります。たった1日で簡単なWebサイトとデータベースまで作れちゃうPHP速習コースです。その方法を1冊に凝縮した本書なら、無理せず楽しくプログラミングとMySQLの基礎が身に付きます。
刊行から13年、「入門書の前に読む入門書!」「小中学生にもできた!」と絶賛のベストセラーをいよいよ改訂。大事なところは一切変えず、最新のネット環境や開発環境に対応。プログラムを見やすくするなど、さらにブラッシュアップしました。
【本書の対象読者】
・プログラミング入門書で勉強してみたけど、挫折してしまった方
・ITスクールのプログラミング入門コースの期間と料金に、びっくりしてしまった方
・動画で勉強してみたけど、理解できなかった方
・外注に頼りっきりのWebクリエイターの方
・IT業界志望の学生さん
・PHPに限らず、プログラミングをやってみたい方は全員、本書の対象です。
【今回の改訂のポイント】
1. プログラミング環境全体をバージョンアップ
WindowsやMacOSのほか、PHPの開発/実行環境を構築するためのXAMMPのバージョンを新しくし、約170点の画面写真等も全て更新しました。
2. インターネットサイトの変化に対応
第2章での各種ソフトウェアのダウンロードおよびインストール手順、設定手順などを新しくして、Macでの操作説明を加筆しました。
3. PHPのバージョンアップに対応
PHPの最新言語仕様や流行の作法に抵触しないようプログラムコードのごく一部を見直しました。
4. プログラムコードを見やすく、さらに解りやすく
使用する英数字すべての書体デザインを、より判別しやすい等幅フォントに変えました。また、初心者にさらに解りやすく、全編の説明をブラッシュアップしました。
まったくのプログラミング初心者に向けた、Webプログラミングの入門書です。
「HTML+CSS」「JavaScript」「PHPによるサーバー開発」
「Ajaxによる非同期通信」Webを使ったスマホアプリ作成」などを、猛スピードで全部学びましょう!
Webプログラミングに必要なテーマの本は、それぞれ1冊になるくらいのボリュームですので、
それを何冊も読むのは大変ですよね。
本書では必要なものを全部つまみ食いして、一度にすべて使えるようになれます!
「HTML+JavaScriptのWeb作成」から一歩踏み出し、サーバー側の開発まで含めた
プログラミングを学び、応用として、Web部分をそのままスマートフォンのアプリに組み込み、
「サーバーと連携したスマホアプリ」までも取り上げています。
ですので、「Webページ、サーバー、スマホアプリ」のすべてを体験できます。
昨今、プログラミングの仕事というとWebプログラミングは避けて通れませんので、
プログラマーになりたいあなたには必読です!
Chapter 1 基本のHTML&CSSを使おう
1-1 Webの開発って、なに?
1-2 HTMLを使おう
1-3 スタイルシートでデザインしよう
1-4 さまざまなスタイルを利用しよう
Chapter 2 JavaScriptの基本を覚えよう
2-1 値と変数をマスターしよう
2-2 構文を覚えよう
2-3 関数とオブジェクト
Chapter 3 Webを操作しよう
3-1 DOMを操作しよう
3-2 DOMオブジェクトを操作しよう
Chapter 4 グラフィックを操作しよう
4-1 Canvasを使おう
4-2 グラフィックを動かそう
Chapter 5 サーバープログラムを作ろう
5-1 PHPを使えるようになろう
5-2 Webのさまざまな機能を使おう
Chapter 6 本格アプリに挑戦しよう
6-1 アイテム収集ゲーム「Collect It!」
6-2 2D 擬似アドベンチャーゲーム「Adventurer」
Chapter 7 スマホアプリに挑戦!
7-1 Monacaを使いこなそう
7-2 プレビューとデバッグ
ブラウザゲームは、Flash時代にさまざまなゲームが登場し興隆を極めましたが、ここ数年「HTML5&JavaScript」への移行が進み、ゲーム会社各社から本格的なスマホゲームが続々登場したことで、再び注目を集めています。
本書は、enzaのHTML5ゲーム開発に関わった著者が、そこで培われたHTML5ゲーム開発のノウハウを公開した1冊です。
開発環境としては、JavaScript高級言語として利用者の多い「TypeScript」と、2Dレンダリングライブラリ「PIXI.js」を用いて、タワーディフェンス型の本格的なスマホゲームの制作過程を順を追って解説しています。ステップごとの開発工程はGithubにて公開しており、必要なソースコードをダウンロードして実際に試しながら、学習を進めることができます。
HTML5でのゲーム開発では、Unityなどのゲームエンジンを用いたネイティブゲーム開発とは異なり、ブラウザやサーバーとのやりとりに関する知識が必要になります。本書では、ゲーム開発で必要なそれらの知識もコンパクトにまとめています。また、Chromeを使ったデバッグや、パフォーマンスの最適化など、ゲームをリリース品質するために必要な情報も解説しました。
●準備編●
1章 HTML5ゲームとは
1-1 ブラウザゲームの変遷と現在
1-2 本書で取り上げるPIXI.jsとそのほかのJavaScriptライブラリ
1-3 本書で制作するHTML5ゲーム
2章 開発環境の構築
2-1 本書の開発環境の全体像
2-2 PIXI.jsとTypeScriptの開発環境のインストールと構築
2-2 PIXI.jsでのゲーム制作の基本
●基礎編●
3章 ゲームづくりの基本要素
3-1 ゲーム要素とブラウザ技術
3-2 シーンを作る
3-3 リソースのダウンロード
3-4 サウンドの再生
3-5 フォントを利用する
3-6 メインループ
4章 ゲームを作り込む
4-1 PIXI.jsによる描画
4-2 UIシステムを作る
4-3 スプライトシートによるアニメーション
4-4 タッチ操作と連動する背景
4-5 ユニットをスポーンするゲームロジックの実装
4-6 ユニットを対戦させるゲームロジックの実装
4-7 拠点の追加・勝敗判定のゲームロジックの実装
●応用編●
5章 ゲームをデバッグする
5-1 Chromeのデベロッパーツールによるデバッグ
5-2 Chrome拡張の活用
6章 ゲームを最適化する
6-1 デバッグツールで検知できるパフォーマンスの解決
6-2 ブラウザへの最適化:ライフサイクルイベント
6-3 ブラウザへの最適化:ストレージの利用
6-4 ブラウザへの最適化:データの秘匿
大好評にお応えして、ついに出ました第6版。よく使われるタグだけにしぼり、みなさんが知りたい目的別に紹介。解説とサンプルは短いけれど端的で、だからわかりやすいと好評。HTMLタグと連動した76ページにわたるCSSリファレンスも充実。さらに、大人気のサンプルイラストはすべて新作描き下ろし。もちろん、ブラウザやHTML5など最新動向もフォロー。
Webブラウザは、開発者にとってもユーザーにとっても、もはや日常の一部となっているほど身近なソフトウエアですが、近年のブラウザはあまりにも高機能かつ巨大になってしまったため、その仕組みを詳しく理解することは困難です。そこで、シンプルなブラウザをRustを用いて実装することによって、ブラウザ上でWebサイトを開くまでに何が起きているのかを理解することを目的とします。さらに、作成したブラウザを、別冊で解説・実装している自作OSの上で動かすことによって、ブラウザと更にその裏側を理解していきます。
第1章:ブラウザを知る──Webサイトを表示するアプリケーション
ブラウザの役割(1)──Webクライアントとしてのブラウザ
ブラウザの役割(2)──レンダリングエンジンとしてのブラウザ
ブラウザの役割(3)──JavaScriptエンジンとしてのブラウザ
コアの役割を支えるためのさらなる機能
マルチプロセスアーキテクチャ
ブラウザのセキュリティ対策
本書のゴール・注意点
第2章:URLを分解する──リソースを指定する住所
URLとは
URLの構文解析の実装
ユニットテストによる動作確認
第3章:HTTPを実装する──ネットワーク通信を支える約束事
HTTPとは
HTTPクライアントの実装
ユニットテストによる動作確認
WasabiOS上で動かす
第4章:HTMLを解析する──HTMLからDOMツリーへの変換
HTMLとは
HTMLの字句解析──トークン列の生成
ユニットテストによる字句解析の動作確認
HTMLの構文解析──ツリーの構築
ユニットテストによる構文解析の動作確認
WasabiOS上で動かす
第5章:CSSで装飾する──CSSOMとレイアウトツリーの構築
CSSとは
CSSの字句解析──トークン列の生成
ユニットテストによる字句解析の動作確認
CSSの構文解析──CSSOMの構築
ユニットテストによる構文解析の動作確認
レイアウトツリーの構築
ユニットテストによるレイアウトの動作確認
GUI描画のための準備
第6章:GUIを実装する──ユーザーとのやりとり
GUIとは
GUIアプリケーションのウィンドウの作成
ユーザーの入力を取得
アドレスバーからナビゲーション
ページの内容の描画
リンククリックでナビゲーション
第7章:JavaScriptを動かす──ページの動的な変更
JavaScriptとは
JavaScriptの加算/減算の実装
JavaScriptの変数の実装
JavaScriptの関数呼び出しの実装
ブラウザAPIの追加
WasabiOS上で動かす
スマートフォン対応サイトではじめるまったく新しいHTML&CSSの入門書!
本書はWebサイト制作の基礎体力となるHTMLとCSSの「いちばんやさしい」入門書です。
最大の特徴は、実際のWeb制作現場のトレンドを反映し、スマートフォン向けサイトを題材としていること。
モバイル対応サイトを作りながら、HTMLとCSSの基本文法、役割、使い分けについて、ステップ・バイ・ステップで学ぶことができます。
もちろん、パソコン表示への対応方法も解説し、最終的には「レスポンシブデザイン」と呼ばれるWebサイトの制作をトータルで学べるような構成にしてあります。
正しい知識を学び、それを使いこなすことは、結果的にSEO対策やアクセシビリティの向上といった、Webサイトのトレンドにもつながります。
・趣味でサイトを作ってみたい
・スキルアップにつなげたい
・仕事でどうしても必要になった
などなど、「HTMLとCSSの基本を身につけたい」方はぜひ本書をお読みください。
Chapter 1 Webサイト制作の準備をしよう
Chapter 2 HTMLの基本を学ぼう
Chapter 3 Webページのひな形を作ろう
Chapter 4 HTMLでトップページを意味付けしよう
Chapter 5 CSSの基本を学ぼう
Chapter 6 CSSでトップページを装飾しよう
Chapter 7 メニューページとアクセスページを作ろう
Chapter 8 お問い合わせページを作ろう
Chapter 9 WebサイトをPCに対応させよう
Chapter 10 Webサイトを公開しよう
Webアプリケーション構築に必要なHTML、CSS、JavaScriptの基礎を学ぶ。
本書は、HTML5で開発をするために必要な実践的なコードを提供する。また、どのブラウザが仕様のどの部分をサポートしているのかを調べるためのヒントやブラウザによるサポートにばらつきがある場合の対応策と、それらが必要かどうかを見きわめる方法についても解説。これによって、読者はそれらの機能が開発中の案件に必要かどうかを判断できるようになるだろう。ウェブ設計者または開発者など、実践的な解決策を求めるエンジニアのためのHTML5レシピ集。
オールカラーの大きな画面!操作手順がよく見える。HTMLタグやスタイルシートの入力手順を丁寧に解説。操作を間違っても大丈夫!対処方法がすぐわかる。手順の横にヒントを掲載。関連知識も身に付く。ホームページやHTMLの知識が深まる用語集付き。
初めてプログラミングを学ぶときに、「コードエディタが必要」と言われても、「それは一体?」と悩むのは当然です。
これまでのプログラミングは、「コード作成」から「実行」までを同じ画面でできる「オールインワン」の「統合開発環境(IDE)」が人気でした。しかし、機能が多すぎて、「動作が重い」「ボタンやメニューの意味が不可解」「不具合が多い」などの使いにくさがありました。
*
しかし、最近は、「高機能テキスト・エディタ+コマンド操作」の、シンプルな組み合わせが好まれているようです。
この組み合わせを1つのソフトウェアでできるようにした、マイクロソフトが開発し、無償公開している「Visual Studio Code」(ビジュアルスタジオ・コード)、略して「VSCode」(ブイエス・コード)が最も人気です。
プログラミング教本の多くは、「VSCode」を用いてプログラミングの解説をしています。
しかし、「VSCode」そのものの詳しい使い方や、細かい設定を解説した本はほとんどありません。
そこで本書は、「VSCode」の使い方や設定方法を、初心者にも理解しやすく学びやすいように、図版を多用して解説しています。
Visual Studio Codeを導入
●Visual Studio Codeとは
●VSCodeを入手
●VSCodeをインストール
●VSCodeを使いやすく設定
VS Codeの基本的な使い方
●VSCodeでファイル編集の準備をする
●最初の一行でわかること
●記入を増やしてわかること
●HTMLファイルをブラウザで表示させる
VS Codeで複数のファイルを編集
●HTMLファイルにさらに書き加える
●HTMLからCSSファイルを参照する
●複数の箇所を一度に修正する
簡単なデバッグ
●JavaScriptファイルの追加で「動くWebアプリ」
●デバッグ機能を試す
ユーザーとして知っておきたいWebページの基礎を学び,シンプルなWebページを自分で構築できるようになる一冊。写真や動画の挿入法など,学んで楽しい技術を多数紹介する。大学の講義用テキストに最適です。
1 Webページとは
1.1 Webページの概要
1.2 Webページの作成
1.3 Webページの表示
2 HTML
2.1 HTMLの概要
2.2 文書
2.3 文字
2.4 箇条書き
2.5 背景
2.6 画像
2.7 リンク
2.8 表
2.9 音声・映像
3 CSS
3.1 CSSの概要
3.2 セレクタ
3.3 CSSによるデザイン
3.4 外部ファイルへのCSSの記述
4 JavaScript
4.1 JavaScriptの概要
4.2 基本的な利用
4.3 変数と制御構造
4.4 イベント・関数・フォーム
資料1 標準16色
資料2 カラーチャート216色
いちばんやさしく、「モバイルファースト」で「レスポンシブ対応」のWebサイト制作を解説!基礎力が身に付く実績の定番書。
プログラミング言語として広く使われはじめてきたJavaScriptに関し、「言語仕様・文法解説」と「プログラミング」の双方に焦点を当てた学習書。
言語仕様・文法の解説と、関数などの実行例、小さなプログラムの作例があり、作例で書式と機能、実行結果を示す。
学習の要所要所では、言語仕様・文法解説の理解を補強するための例題として、33本のサンプルプログラムを作成。
ECMAScript6対応。