技術書典7 で「はじめてのWeb Components入門」を初出版します!
この度、初めて書籍を出版することになりました! 「はじめての Web Components 入門」本を技術書典 7 で販売します。
技術書典 7 って?
コミックマーケットのエンジニア向けみたいなものです。 詳しくは、下記のリンクを参照下さい。
https://techbookfest.org/event/tbf07
あなたは誰?
詳しくは、私のポートフォリオを参照下さい。
https://silverbirder.github.io/
Web アプリケーションが大好きなエンジニアです。 今は、EC サイトのフロントエンドエンジニアをしています。
どんな本?
Web Components について 何も知らない方向けの書籍になります。 書籍の内容の大きな流れは、下記のとおりです。どれもサンプルコードを用意しています。
- Web Components の基礎
- ★ 実際に Web Components を作成
- 関連ライブラリの紹介
「実際に Web Components を作成 」について紹介
お題として Todo Components を作ることになります。作る流れは順序立てて紹介しています。
- 最小限のコンポーネントを作成
- レンダリングの工夫
- コンポーネント間のデータ連携
上記のステップを踏むことで Todo Components が完成します。もちろん、サンプルコードがあるので動作確認できます。
また、カバレッジ 100%テストコードの実装も紹介していますので、TDD も実現できます。Web Components のテストコードは、あまりネット上に紹介されていない印象があったので、折角なので混ぜてみました。
最後に、(実際はしていませんが)Web Components を公開する手順も紹介しています。
コラムネタ
コラムネタとして下記のようなもの(全てではない)を書いています。
- cloneNode vs innerHTML
- html-imports
- WAI-ARIA
- slot
- :host
目次
-
第一章 フロントエンド開発
- フロントエンド開発の苦労
- コンポーネントベースの JS フレームワーク
- JS フレームワーク非依存
- まとめ
-
第二章 Web Components
- 概要
- Web Components 4 つの基本機能
- ライフサイクルメソッド
- まとめ
-
第三章 Web Components を作ってみよう
- 作って学ぶ
- TodoComponents を作ってみる
- [実践] TodoItem と TodoInput を作る
- [実践] render を工夫してみよう
- [実践] MyTodo を作る
- [実践] 各コンポーネントを連携する その 1
- [実践] 各コンポーネントを連携する その 2
- [実践] 各コンポーネントを連携する その 3
- [実践] テストコードを書く
- [補足] slot
- Web Components の公開
- まとめ
-
第四章 Web Components の関連ライブラリ
- Polymer
- LitElement
- Material Web Components
- その他の周辺ライブラリ
- まとめ
なぜ書いたの?
主に下記のとおりです。
- Web Components を学習したかったから
- ポートフォリオとして残したいから
- エンジニアと交流したいから
特に、1 番が大きかったです。 Web が大好きな私にとっては、Web Components という技術に興味がありました。 けれど、実際に試したことがなかったので、これをきっかけにして使ってみたい!という欲求が大きくありました。
いつ、どこで販売されるの?
2019 年 09 月 22 日で、「池袋サンシャインシティ 展示ホール C/D」で販売します。 弊サークル「silverbirder」の配置は「う 03C」です。
販売形態は?
本と電子本の 2 つにするつもりです。 本は日光企画様より製本して頂いたもののみの販売となります。 電子本は BOOTH で販売する予定です。
本を購入された方は、電子本を無料で差し上げます。
終わりに
今回、初物が多すぎました(笑)。
そのせいで、プライベートの時間がほぼなくなりました(笑)。
- 初技術書典参加
- 初製本
- 初 Web Components 勉強
- 初クリスタ(イラスト用)
技術書典では、エンジニアそれぞれの今書きたいものをアウトプットしています。 そうすると、新鮮な情報をキャッチアップしやすくなるため、非常に情報収集するのが効率的だと思います。 技術書典を参加したことがありませんが、執筆してみて思います。
「どの本も絶対面白い!」はずです。
だって、好きなこと書けるんですから(笑)。私も含まれます。
技術書典 7 当日は、是非とも「う 03C」にお越し下さい〜〜!
(他のサークルさんの本買いに行きたい...!!!)
関連リンク
見本誌
技術書典 7
https://techbookfest.org/event/tbf07/circle/5117648689954816
Twitter 宣伝
Tags
2022-05-28
Micro Frontends(以降、MFE)で組成するフラグメントを Web Components で定義して Module Federation で共有する方法を、ざっくり紹介します。...
2022-04-11
次の 2 つの Web Components を作成しました。背景 自分のブログで、埋め込みコンテンツを表示したいな〜って思ってました。iframely というサービスを使っていましたが、自前で作りたいなというモチベーションが生まれました。そこで、OEmbed と OGP の表示ができるように、Web Components を独自に作成しました。...
2022-03-25
WebComponents で、oEmbed ぼコンポーネントを開発し、公開しました。開発していく上で、学んだことを列挙しようと思います。...
2022-03-01
Web Components を人にお勧めしたいんです。メリット・デメリットをかんたんにまとめたいと思います。Web Components is 何https://www.webcomponents.org/specs より引用します。...
2021-12-24
Markdownでブログやドキュメントを書いていますか?執筆活動に集中したいのに、Markdownだけだとかゆいところに手が届かないもどかしさ、感じたことありませんか?そんな方に、MarkdownとWebComponentsがシームレスに統合できる静的サイトジェネレータ(以降、SSGと呼ぶ)、Rocketをおすすめします。...