IPOまとめサイトの見た目を調整 実績の金額を表示
IPOまとめサイトで上場後企業の実績を利益金額で表示する
自由を追い求めるWEBエンジニアこと、TOWです。私は製造業の社内SEをやっていますが、はやいことお金を貯めて不労所得を構築し、好きなシステム開発だけをしながら生きていきたいと思っています。
そのために色々なWEBアプリを構築していっている最中なのですが、その関係で先日作成したIPOまとめサイトの見た目を調整していこうと思います。
IPOまとめサイトはこちらのURLIPOまとめサイト (ipomatome.web.app)から飛べるのですが、なんでかブラウザにインデックスされないんですよね。設定が足りないんですかね・・・。Firebaseの利用経験が少なくて分かりません。
とりあえず画面はこんな感じなのですが、過去実績100件のテーブル一番右端の「全体評価」に初値が上昇したか、下落したかを表示しています。
ただ、これだとどの程度の利益もしくは損失が出たか分からないのでこれを変動値(売り出し値と初値の差分)を表示するようにプログラムを改修します。
見た目の調整
まず、仮にIPOの抽選に当たり、購入した株を初値で売った場合の利益もしくは損益を単純に表示してみます。
右端の全体評価が1株あたりの利益を出しています。これも悪くはないのですが・・・本当に知りたいのは1口当たりの利益かも知れませんね。IPOは基本的に100株1口で購入するので、1口当たりの利益を表示してみましょう。
そうすると以下の画像のようになります。
ちょっと見にくいな・・・。桁数が多くて、1万の桁なのか10万の桁なのかが分かりません。これは優れたシステムとは言えませんね。
○○万××円のような表示にするか・・・もしくは先ほどの1株当たりの金額にすべきか・・・悩みますね。まぁとりあえずはこの表示でいきましょうか。
私の最大の弱点はデザインなので、こういった美的感覚を磨かないといけないんですよね。昔はデザインとかちょっとなめてたんですけど、WEB分野に来てから考えが変わりましたね。めっちゃ重要です。
後は各会社の名称をクリックすると詳細情報を見れるなどの機能を追加したいですね。それはまた別の記事で追加しましょう。
また、このIPOまとめサイトはNext.jsというフレームワークで自作しておりますが、作成するまでの流れをすべて私のサイトで公開しております。Webアプリを作るためのプログラミングなどに興味がある方は是非こちらの記事も見て行ってください。
