WEB+DB PRESS plusシリーズフロントエンド開発徹底攻略

[表紙]フロントエンド開発徹底攻略

B5判/192ページ

定価(本体1,980円+税)

ISBN 978-4-7741-6614-8

電子版

→学校・法人一括購入ご検討の皆様へ

書籍の概要

この本の概要

WEB+DB PRESS plus 徹底攻略シリーズでは,Webアプリケーション開発のためのプログラミング技術情報誌『WEB+DB PRESS』の掲載記事をテーマ別に厳選し,再編集してお届けします。『フロントエンド開発徹底攻略』では,HTML/CSS/JavaScriptのはじめの一歩から,現場から学ぶUIデザイン,Altjsの本命CoffeeScript,CSSの使い勝手を格段に向上させるSaSS/Compass,セキュリティまで,フロントエンドエンジニアにとって必須のノウハウを一冊にギュッとまとめました。

特集1
HTML5/CSS3/JavaScriptの基礎知識
三大言語を体系的に身につける

本特集では初学者に向けて,HTML,CSS,JavaScriptというWeb開発で必須の技術を取り上げます。この3つはWeb開発をするうえで欠かせないものであり,スマートフォンの流行やHTML5やCSS3の登場などとともに,年々重要度が増していっています。これらは本当に重要で使わざるを得ないため,いつの間にか「なんとなく」使えるようになってしまうものです。しかしこれらの技術を体系立ててきっちり学ぶことは,これからプログラマとして生きていくうえでの大きな資産になります。ぜひ本特集をこれからのWeb開発に役立ててください。

特集2
実践UIデザイン
ユーザの満足度を高める設計,実装,検証方法

クックパッドで実際に行われている取り組みを通じて,UIデザインについての実践的な知識を解説する特集です。「仮説を立てる」「開発する」「効果を検証する」というプロセスに分け,クックパッドが作成したUIを例に挙げて,デザインの進め方や気をつけるべき点など,UIデザインをする際に必要な知識を現場のエンジニアが詳しく解説します。

特集3
CoffeeScript本格入門
コードを簡略化し,JavaScript開発を加速する

CoffeeScriptはコンパイルするとJavaScriptとして動作するスクリプト言語です。JavaScriptに比べて洗練された文法で記述できるため,Ruby on Railsにも採用されるなど,多くのプログラマから大変注目を浴びています。本特集では,CoffeeScriptのメリット・デメリットからアプリケーション設計のフレームワークであるBackbone.jsと組み合わせた本格的なWebアプリケーションの開発まで,CoffeeScriptの魅力を余すところなく紹介していきます。

特集4
詳解Sass/Compass
モダンなCSSを簡潔なコードで記述する

Sass(Syntactically Awesome Stylesheets)を利用すると,簡潔な記述で表現したコードをCSS(Cascading Style Sheets)に変換でき,CSSが持つさまざまな欠点を解消してくれます。本特集では,Sassとその機能を拡張するCompassの,基礎から実際のアプリケーションでの利用方法まで解説します。大規模なアプリケーション開発でもSassを活用できるよう,MVCSSというフレームワークを使った見通しの良いコードの書き方や,Sassを使っていて陥りがちな問題なども解説します。

特集5
安全・堅牢なWebサイトの作り方
HTML5時代に知っておきたい脅威と対策

HTML5とその関連技術が整備されつつあります。それにより実際にHTML5を利用したWebサービスも徐々に増えており,今後もより一層の普及が見込まれています。ブラウザ側でできることも増えましたが,それと同時に新しい脆弱性のリスクもまた生まれようとしています。単純なXSSやCSRF,SQLインジェクション脆弱性は10年以上前から対策が進んでいますが,HTML5の脆弱性に対してはまだ対策の知見が溜まっていない状況です。本特集ではHTML5時代に考えるべきセキュリティ脅威とその対策の最新状況を解説します。

こんな方におすすめ

  • HTML/CSS/JavaScriptの学習を本格的に始めたい人
  • HTML/CSS/JavaScriptの最新動向を押さえたい人
  • 開発現場でHTML/CSS/JavaScriptを使いこなしたい人

目次

特集1
HTML5/CSS3/JavaScriptの基礎知識
三大言語を体系的に身につける

  • 第1章:Web入門
    URL,クライアント/サーバ,HTTP……cho45(さとう)
  • 第2章:HTMLをちゃんと学ぶ
    文書構造をマークアップしよう……cho45(さとう)
  • 第3章:CSSをきちんと学ぶ
    見栄えを指定しよう……cho45(さとう)
  • 第4章:JavaScriptをしっかり学ぶ
    Web標準のプログラミング言語……cho45(さとう)
  • 第5章:お絵描きアプリケーションを作る
    ブラウザの機能だけで実現!……cho45(さとう)

特集2
実践UIデザイン
ユーザの満足度を高める設計,実装,検証方法

  • 第1章:開発者に求められるUIデザインの心構え
    ユーザに提供するゴールを明確にする……五十嵐 啓人
  • 第2章:UIデザインをするためのユーザ体験設計
    ユーザの達成したいゴールを知る……伊野 亘輝
  • 第3章:ブレずに高速実装! UIデザインの技術
    クックパッドのトップページに見るデザインプロセス……須藤 耕平
  • 第4章:UIデザインの成果を高める検証テクニック
    テスト手法の比較と検証結果の活用……片山 育美,五十嵐 啓人
  • 第5章:多様化する環境に対応したUIデザインの提供
    柔軟に考えるところと共通化すべきところを明確化する……池田 拓司

特集3
CoffeeScript本格入門
コードを簡略化し,JavaScript開発を加速する

  • 第1章:基礎知識
    メリット・デメリットを理解する……高津戸 壮
  • 第2章:基本文法
    JavaScriptとの違いを押さえておこう……高津戸 壮
  • 第3章:クラスの使い方
    機能を分割し,効率的な開発を実現する……高津戸 壮
  • 第4章:Webアプリケーション開発入門
    Backbone.jsを使った設計と実装……高津戸 壮

特集4
詳解Sass/Compass
モダンなCSSを簡潔なコードで記述する

  • 第1章:Sass/Compassとは
    CSSプリプロセッサと拡張フレームワーク登場の背景……石本 光司
  • 第2章:開発環境の構築
    インストール,基本操作,GUIアプリケーション……石本 光司
  • 第3章:Sassの基本文法とCompass
    ネスト,ミックスイン,継承,インポート,Compassモジュール……石本 光司
  • 第4章:モダンなCSSを書くために
    原則の理解とMVCSSフレームワークの活用……石本 光司
  • 第5章:現場でSass/Compassを使うには
    落とし穴,複数人開発,パフォーマンス……石本 光司

特集5
安全・堅牢なWebサイトの作り方
HTML5時代に知っておきたい脅威と対策

  • 第1章:HTML5でできること/できないこと
    ブラウザの進化とHTML5の標準化……竹迫 良範
  • 第2章:今さら聞けないAjaxの基本とセキュリティ
    クロスドメインによるアクセス制限……竹迫 良範
  • 第3章:CSS3とiframeのセキュリティ
    JavaScriptオフでも秘密情報が漏えいする……竹迫 良範
  • 第4章:HTTPSで実現するCookieのセキュリティ
    今日からできるセッションハイジャック対策……竹迫 良範
  • 第5章:Do Not Trackとプライバシー問題
    インターネット広告と行動追跡……竹迫 良範
  • 一般記事

    • Gruntによるフロントエンド開発作業の自動化
      コードが更新されたら,連結してコンパイルしてミニファイ……伊藤 直也
    • AngularJS入門
      コードをシンプルに書けるコンポーネント指向フレームワーク……若原 祥正

    Technology Flash

    • TypeScript入門
      大規模開発に適したJavaScript互換言語……沢渡 真雪