（※この記事はJS初級〜中級の方向けの記事です）
チャットとか、ボットとか、
「何に使うんじゃい！」
...いやいや、今後使われるらしいですよ？
2021年にチャットボット市場は31.7億ドルまでになる予想があります。
国内での関連情報**「AI市場、年73％増の急成長続く」**では、
**「システム市場規模をユーザー支出額ベースで158億8400万円と推定」**と言っています。（※国内コグニティブAIに関する市場規模）
もう目的なんかなくても、とりあえず作り方マスターしましょう！
そんなわけで、業務で使えるレベルの本格的なチャットの作り方を、連載でまとめたいと思います。
わたくし仕事でWebチャット部品を作ってきた者ですが、
会社のみんなに「フロント側なら公開していいよー」て言ってもらえたので公開します。
この記事の概要
サンプル程度のレベルではなく、本番のサービスで組み込めるレベルのWebチャットが開発できるようになる記事（にしたい）
※なおFirebaseは使います。
必要となる知識
- HTML/CSS
- Javascript
- JQuery
得られるモノ
- チームで開発するレベルの基本的なJavascriptの使い方（オブジェクト思考やMVCなど）
- 業務で使えるレベルのWebチャットのソースコード
作るものの最終的なイメージはこの様な感じです。
機能としてはこんな感じです
- リアルタイムなメッセージ送受信
- 機能追加が可能なメニューUI
- ステータス表示
- 書き込み中アニメーション
- 既読表示
- 日付の区切れの表示
実はまだ途中なので、全部書き切れるか不明ですが、
僕が飽きなければ全部書き切れると思います！
- 1コマ目： 無料でカンタンにWebサイトを作る方法(2018)（←チャットを設置するためのサイト準備）
- 2コマ目： ゼロから作る、簡単WebチャットUIの作り方
- 3コマ目： （ハンズオン用）HTMLをJavaScriptで効率よく組み立てる方法
- 4コマ目： 作ってわかる！はじめてのFirebase（データベースの基礎）
- 5コマ目： 素のJavascriptでMVCを意識して作る
- 6コマ目： Javascriptでクラス継承してみる
↑いまこの辺までしか書いてない
- 7コマ目： Javascriptで書き込み中アニメーションを作ってみた
- 8コマ目： textareaの高さを動的に変更する
- 9コマ目： チャットの既読表示や日付表示（Web）
おぉ...目次にしてみたら、かなりの量の記事になる気がする...
それでは次回「1コマ目： 無料でカンタンにWebサイトを作る方法(2018)」からやっていきたいと思いますー