これは N予備校プログラミングコース Advent Calender 2021 の 23 日目の記事です。
みなさん、こんにちは！
私は大学で物理学を専攻しながら、株式会社ドワンゴのアルバイトとして N 予備校プログラミングコースの各種教材開発に携わっています。
この記事では、私が趣味として開発している 数式が書けるチャットアプリ について、開発の経緯を交えながら紹介します。
目次
=== 紹介編 ===
00 ... 数式が書けるリアルタイムチャット「ChatZEMI」
01 ... 基本的な機能の紹介
=== 経緯編 ===
02 ... 知識ゼロから
03 ... 独学で突き進む
04 ... 数式が書けるチャットアプリの開発へ
=== 技術編 ===
05 ... 構成 / Web アプリケーション
06 ... 環境構築 / Docker
07 ... 言語 / TypeScript
08 ... Web フレームワーク / React と Next.js
09 ... スタイリング / TailwindCSS
10 ... データベース / MongoDB
11 ... リアルタイム通信 / WebSocket
12 ... 表現 / Markdown
13 ... 数式 / TeX と KaTeX
14 ... 絵文字リアクション / アルゴリズム
15 ... 認証・認可 / Firebase Authentication
16 ... モバイルアプリ / Progressive Web Apps
17 ... デプロイ / Google Cloud Platform
18 ... 今後の開発
紹介編
00 ... 数式が書けるリアルタイムチャット「ChatZEMI」
今回紹介する、私が個人で開発しているチャットアプリはこちらです。
ぜひ自由に利用してみてください。
投稿練習ルームはこちらです ↓
https://chatzemi.app/rooms/public/614a6ee16cfb1899a2e2de96
なお、この Web アプリは現在も開発中のため、正常に動作しないことがあります。
仕様にある機能の一部は未実装です。
01 ... 基本的な機能の紹介
数式やソースコード、太字、見出し、表、画像などの多彩な表現ができるリアルタイムチャットです。
ページを再読み込みしなくても、リアルタイムにやりとりが反映されます。
誰でも公開ルームに参加して会話したり、ルームを作成したりできます。
プライベートルームは、許可されたメンバーしか閲覧・投稿できません。
様々な数式が、ボタン操作や TeX 形式で入力できます。
経緯編
この記事は N 予備校のアドベントカレンダーの 1 記事ですから、受講生の方や、プログラミング初心者の方が読むかもしれません。
そこで、私がプログラミングを始めてから、個人開発を行うまでの流れを簡単に紹介したいと思います。
先が見えないで悩んでいる方にヒントが与えられれば幸いです。
02 ... 知識ゼロから
私は現在 N 予備校プログラミングコースの教材開発に携わっていますが、私自身も N 予備校でプログラミングを学び始めました。
先述のとおり、私の大学での専攻は情報系ではないので、ソフトウェア開発に関する内容を学ぶ機会はほぼありませんでした。
大学以前の経験も当然なく、プログラミングの知識はゼロでした。
そのような状態の中で、N 予備校のプログラミングコースを発見し、勉強を始めたのです。
N 予備校には「機械学習コース」や「iOS アプリコース」、「Unity ゲーム開発コース」など、さまざまな分野のコースがあります。
その中で、すべての基本となるプログラミング技術を習得できるのが、いわゆる「入門コース」です。
入門コースでは、Web アプリケーションの開発を題材にして、ソフトウェア開発の実務に必要不可欠なスキルと常識を身につけます。
03 ... 独学で突き進む
その後は、発展的な内容のコースを学んでみたり、入門コースで習得していたスキルをもとに企業のインターンシップで開発をしたりしました。
また、新しい知識や体系的な知識を学ぶ必要性が出てきたときは、次のように独学で勉強をしたのが、その後の役に立ったと思います。
独学するときに重要なのは、全体像をつかみ、何が必要かを知ることです。
私は、よく大学の情報系学科のシラバスを参考にして、情報系分野の全体像を掴み、知識の関連性を俯瞰するようにしました。
すると、今の自分に何の理解が不足していて、どの分野の本や解説を読めば良いかがわかるわけです。
04 ... 数式が書けるチャットアプリの開発へ
私は、物理学の専攻であること、また N 予備校のフォーラムで数式を使った質問に回答する機会があることなどから、「数式を使ったコミュニケーションが取りたいが、機能がない」と思うことが頻繁にありました。
現在、私の知る限りでは、柔軟な数式表現を用いたコミュニケーションが取れる Web サービスは、質問サイトや情報共有サイトの一部のみだけです。
そこで私は、数式が書けるチャットアプリを自分で作ってしまおうと思ったのです。
なお、「実際に使われるサービスになるか？」というのは気にしないことにしました。
少なくとも今回の場合は、「困っていた自分が使える」、「開発の途中で身につけた知識が今後に役立つ」 というだけで十分だったからです。
幸い、数式が書けるチャットアプリの開発は、汎用的で有用な技術の習得につながりました。
技術編
技術編では、このアプリで使用している技術を簡単に紹介していきます。
N 予備校プログラミングコースで扱っている技術も多く含まれていますので、その関連性も紹介します。
↓↓↓すみません、今リアルタイムで書いています🙏↓↓↓
05 ... 構成 / Web アプリケーション
06 ... 環境構築 / Docker
07 ... 言語 / TypeScript
08 ... Web フレームワーク / React と Next.js
09 ... スタイリング / TailwindCSS
10 ... データベース / MongoDB
11 ... リアルタイム通信 / WebSocket
12 ... 表現 / Markdown
13 ... 数式 / TeX と KaTeX
14 ... 絵文字リアクション / アルゴリズム
15 ... 認証・認可 / Firebase Authentication
16 ... モバイルアプリ / Progressive Web Apps
17 ... デプロイ / Google Cloud Platform
18 ... 今後の開発
↧