こんにちは。今回は私が読んだ本、「いまから始めるWebフロントエンド開発」について書いていきます。

Overview : 概要

タイトル いまから始める Webフロントエンド開発
著者 松田 承一
監修 柴田 和祈
販売  Amazon Kindle
ページ数 93


そんなわけで上記が概要です。Kindleでのみ発売されているので個人出版という形になるかと思います。Kindle Unlimitedで読むことができるので、Kindle Unlimitedを契約している方はそちらからチェックしてみてください。上記のリンクからもアクセスできます。
ページ数が少ないのでさっくり読むことができますが、Webフロントエンドの流れをざっくりと学ぶのには必要十分なんじゃないかなと思います。Amazonレビューも星4とわりかし高めです。何よりさっきも書いたKindle Unlimitedに加入していれば読み放題なので気軽の読むことができます。自分もその口で読んでみました。

対象読者、読者(私)の読書時のレベル

この本を読んだ際の私のスキルはだいたい以下のような感じです。

  • プログラミング言語として、C/C++, Java, Python, Luaには触ったことがある。
  • 特にPythonはよく書いた
  • HTML, CSS, JavaScriptも少しは触ったことがある
  • Unixコマンドはある程度は理解している(つもり)

といった感じです。個人的には、ある程度プログラミングの基礎を知っている方、つまり、初級者〜中級者くらいの方がWebフロントエンド開発に手を出すのに丁度いいのではないかな〜と思います。なのでUnixコマンドと、プログラムをコンパイルして実行した、ifやfor文がわかる程度であれば十分この本の内容を理解して吸収できるのではないでしょうか。

本書の構成

第1章:Webフロントエンド開発が歩んできた道

ここで現在のモダンなフロントエンド開発に至るまでの経緯が説明されます。いわゆる歴史です。歴史と聞いてうわっと思う方もいるかも知れませんが、この本は短いのでさらっと終わります。そんなに気負いしなくても大丈夫です。

第2章:TODOアプリを開発してみよう

第1章で説明されたモダンな開発環境のうち、reduxとReact.jsを使って、簡単なTODOアプリを作成します。お手本はGithubに上がっているのでそこからクローンしてきてもいいと思います。ところどころ、コマンドライン操作があるのでUnixコマンドの使い方くらいは理解していないと厳しいと思います。私はmacOSでVScodeを使って学習しました。

第3章:これからのWebフロントエンド開発

この本のまとめです。「第3章」と書いていますが、ほんの数ページ程度ですぐに読み終わります。

途中つまずいた点

本書が若干古いのでnpmでインストールするモジュールに注意

本書では

bash
1
npm install --save-dev babel

といった感じで、npmを使ってモジュールをインストールするのですが、本書のバージョンが古いので、新しいバージョンを使う際には注意が必要です。この記事を書いている段階でbabelのバージョンが7に上がっているので何も考えずに上記を入れると、本書通り進めてもエラーが起こります。

1
Error: Plugin/Preset files are not allowed to export objects, only functions.

上記がエラーコード

というわけで本書の内容からちょいちょい変える必要があります。

変更前

bash
1
npm install --save-dev babel

変更後

bash
1
npm install --save-dev @babel/core @babel/preset-env @babel/preset-react

こんな感じでbabelの前に@をつけて、新しいバージョンをインストールしていきます。
そして.babelrcの内容を以下に変更します。

json
1
{ "presets": ["@babel/preset-env", "@babel/preset-react"] }

こうすることで、本書の内容に合わせて動かすことができます。

ReactのPropTypesのimport

本書ではPropTypeのインストールは各.jsファイルで

javascript
1
import React,{ PropTypes } from 'react';

といった記述になっているのですが、PropTypesの場所が変更されているので以下のように記述する必要があります。

javascript
1
2
import React from "react"; 
import PropTypes from "prop-types";

これで動くはずです。

まとめ

この「いまから始めるWebフロントエンド」では、ある程度プログラミングを行ってきた方がフロントエンドに進むためのはじめの一歩として、軽く読むには大変良いのではないかと思いました。逆に、本書のタイトルに引き寄せられて、プログラミング初心者の方が読むと厳しいものがあるのではないかと考えられます。個人的には近年のウェブフロントエンドの学習の入門として大変わかりやすかったです。この本を踏み台にして次の参考書を読むといった形で間に挟むのが、本書のもっともらしい活用法なのではないかなと思います。そして何より、Kindle Unlimitedで読むことができるのでこれも大変ありがたいです。

以上です。お読みいただきありがとうございます。またよろしくお願いします。


2019.12.20 03:00  2020.04.08 02:14