1.3 電卓を作る

本項では、Codex を使って、JavaScriptで動く電卓を段階的に開発する手順を学ぶ。
最初に四則演算ができる基本電卓を作り、消費税計算ボタンを追加する。次に Git を使ったバージョン管理を導入し、変更履歴を記録する方法を学ぶ。さらに、平方根・二乗などの算術関数、三角関数・対数関数などの科学関数、メモリ機能と、段階的に機能を拡張していく。また、プログラムの版管理（バージョン管理）の方法も学ぶ。
すべての操作は日本語の指示だけで完結し、コードを書く必要は一切ない。

基本電卓を作る

Codex のプロジェクト（ここでは「プログラム開発」）を開き、プロンプトに次のように入力して送信する。

プロンプト

JavaScriptで電卓を作って下さい。

四則演算・%演算・小数点入力に対応した基本電卓

数十秒ほどで "calculator.html" が作成される。
リンクをブラウザーにコピペすると電卓が開く。数字の入力、四則演算（+、-、×、÷）、%演算、小数点入力、[AC] でリセット、[DEL] で1文字削除、[=] または Enter キーで計算という基本機能が揃っている。また、ディスプレイ上段に入力中の式、下段に計算結果が大きく表示される。

消費税計算ボタンを追加する

基本電卓ができたら、次に消費税を計算するボタンを追加してみよう。
プロンプトに次のように入力して送信する。

プロンプト

税込8%と税込10%のボタンを追加して下さい。

税込8%・税込10%ボタンを追加した電卓

Codex は "calculator.html" を自動で書き換え、電卓の上部に「税込8％」「税込10％」ボタンを追加する。たとえば「1200」を入力してから「税込10%」を押すと、「1200 + tax 10% =」という式を計算して「1320」と表示する。入力中の式を計算したうえで税率をかける仕組みになっている。なお、「1000 + 500」のように式を入力してから押すこともでき、合計額に税率をかけた結果が得られる。

Gitでバージョン管理する

プログラム作りも文書作成と同じで、版数管理をしておいた方がいい。
Codex を使うと、簡単にいろいろな機能を追加していくことができるが、どこかで複雑になりすぎたり、矛盾が生じてしまうこともある。
そこで、最初のプログラムを第1版（バージョン1）、次に改良した者を第2版（バージョン2）‥‥というように版管理（バージョン管理）を行い、問題が出たら、前の版（バージョン）に戻せるようにする。
プログラム開発では、このために Git （ギット）というオープンソースのプログラムを使うことがよくある。ネット上の GitHub は Git をベースにしたシステムで、多くの開発者が多くのプログラムを投稿している。利用した方もいるかもしれない。

Codex にも Git を利用できる仕組みが搭載されている。そして、Git で使う命令（コマンド）を覚えなくても、日本語でプロンプト入力すればバージョン管理ができる。さらに、プログラムや管理情報はパソコン上のストレージに格納されるので、これらがネット上に漏洩するリスクも低い。

では、次のようにプロンプト入力してみよう。

プロンプト

gitでプログラムを管理できるようにして下さい。

Codex はGitリポジトリの状態を確認したうえで、「calculator.html をGit管理下に置いてよいか」という承認ダイアログを表示する。「はい」を選ぶと、Codex が `git add .\calculator.html` を実行してファイルをステージングする。

初回コミットの承認を求めるダイアログ

次に、最初に作ったプログラムをバージョン1として登録するために、Codex にプログラムを巻き戻して Git に登録してもらう。

プロンプト

最初に作った税率を含まない電卓プログラムを最初のプログラムとしてください。

最初に作ったプログラムと、消費税機能を追加したプログラムが登録されているか確認してみよう。

プロンプト

gitにある電卓プログラムのバージョンと機能一覧を表示してください。

v1・v2のコミット一覧

算術関数を追加する

次に、よく使う算術関数のボタンを追加した関数電卓を作る。
関数電卓に消費税機能は必要無いと考え、プロンプトに次のように入力して送信する。

プロンプト

v1に、sqrt（平方根）、x^2（二乗）、1/x（逆数）、+/-（符号反転）ボタンを追加して下さい。

sqrt・x^2・1/x・+/-ボタンを追加した電卓（v3）

Codex は "calculator.html" に4つのボタンを追加した。このプログラムはv3として自動的にコミットされる。
「3」を入力して「sqrt」を押すと、「sqrt(3) = 1.7320508076」のように表示される。

プロンプト

sqrt（平方根）、x^2（二乗）、1/x（逆数）、+/-（符号反転）ボタンを追加して下さい。

科学関数を追加する

さらに、三角関数・指数関数・対数関数のボタンを追加する。プロンプトに次のように入力して送信する。

プロンプト

sin、cos、tan、exp（指数関数）、ln（自然対数）、log10（常用対数）ボタンを追加して下さい。

三角関数・指数・対数ボタンを追加した電卓（v4）

Codex は科学関数ボタン（sin、cos、tan、exp、ln、log10）を追加する。このプログラムは自動的にコミットされる。これで理工系の計算にも対応できる電卓になった。

ここで、やはりよく使う算術計算だけで十分なので、前のバージョンに戻そうということになったら、次のプロンプトを入力すればいい。

プロンプト

v3のプログラムに戻してください。

メモリ機能を追加する

最後に、計算途中の値を一時的に保存するメモリ機能を追加しよう。プロンプトに次のように入力して送信する。

プロンプト

MC（メモリクリア）、MR（メモリ呼び出し）、M+（メモリ加算）、M-（メモリ減算）ボタンを追加して下さい。

MC・MR・M+・M-ボタンを追加した電卓（v5）

Codex はメモリ操作ボタン（MC、MR、M+、M-）を追加する。これで途中結果を記憶させながら複数ステップの計算ができるようになった。このプログラムも自動的にコミットされる。

ここで、バージョン管理の一覧を見ておこう。

プロンプト

電卓プログラムのバージョンと機能一覧を表示してください。

電卓プログラムのバージョンと機能一覧
バージョン	コミット	内容	機能一覧
v1	31295f7	基本電卓	数字入力、小数点入力、四則演算、%、AC、DEL、=、キーボード入力
v2	f6dd607	消費税計算を追加	v1の機能、税込8%、税込10%
v3	561802a	よく使う算術関数を追加	v1の機能、sqrt、x^2、1/x、+/-
v4	d936df9	科学関数を追加	v3の機能、sin、cos、tan、exp、ln、log10
v5	36027b3	メモリ機能を追加	v4の機能、MC、MR、M+、M-

Gitのまとめ

ここで、Git について整理しておこう。

大きな写真

（1672×941 ピクセル, 97 Kbyte）

Git （ギット）とは、プログラムを含むファイルの変更履歴を記録し、必要に応じて過去の状態に戻せる仕組みである。
たとえば、文章を作っているときに、「最初の版」「修正版」「最終版」「最終版その2」のように、ファイル名を変えて保存することがある。これは、あとから前の状態に戻したり、どこを直したのかを確認したりするためである。Gitは、この作業を人間が手作業で行う代わりに、きちんと整理して記録してくれる道具である。

Git は、ファイルを変更したあと、その時点の状態を「記録」として保存する。この記録を積み重ねていくことで、いつ、誰が、どのファイルを、どのように変更したのかが分かるようになる。写真のアルバムのように、作業の途中経過を節目ごとに残していくイメージである。

Git の大きな特徴は、過去の状態に戻せることだ。作業中に内容を壊してしまった場合でも、以前に記録しておいた状態に戻せる。また、どの変更によって問題が起きたのかを調べることもできる。

Git は、プログラムを書くためだけの道具ではない。文書、設定ファイル、Webページなど、変更を重ねて作っていくものなら何にでも使える。Gitの本質は、「変更の履歴を安全に残し、必要なときに確認・復元できるようにする仕組み」である。

なお、本来の Git は、複数人で同じファイル群を編集するときにも役立つ。それぞれの人が行った変更を記録し、あとから一つにまとめることができる。誰がどの部分を直したのかが残るため、共同作業の管理がしやすくなる。
ただ、 Git を共同作業で使うには、サーバやクラウドにファイルを置かなくてはならない。本講座の範囲外となるので、ここでは解説しない。興味をお持ちの方は、下記の「参考サイト」を読んだり、ChatGPT に構築方法を聞いてみるといいだろう。