前書き
皆さんはこれまで、食べログやぐるなびといったグルメサイトにレビューを投稿したことはあるだろうか。
勝手な推測だが、恐らく投稿したことが無い人の方が少ないという印象を抱いている。
私もその内の一人だ。
私はよく餃子を食べに街に躍り出るのだが、別にレビューを投稿することが苦手なわけではないし、本当に美味しいと感じたお店に対しては、投稿したい気持ちの方が強い時だってある。
ではなぜレビューを投稿しないのか。
「会員登録」 があるからだ。
伏見稲荷大社の鳥居の如く立ち並ぶ入力欄を目にしてからは、会員登録をすることをひどくためらうようになってしまった。
時間を削って氏名やメールアドレスなどの数多ある項目が待ち受けているのだと思うと、そこまでして投稿することは合理的ではないと感じてしまうのだ。
それならば誰でも気軽に投稿できるレビューの場を設ければいいではないか。
手始めに私が愛して止まない餃子に特化したWebアプリを制作することとする。
制作したWebアプリ
制作したアプリは、下記に掲載されている通りである。
https://sunny-dusk-a6b6eb.netlify.app
添付した通り、日にち 、店名、最寄り駅、コメントを入力して「レビュー投稿」ボタンを押下すると、レビューが掲載されるというシンプルな作りである。
(レビュークリアボタンは、便宜上設定したまでである。)
Webアプリのため会員登録など面倒なステップを踏むことなくレビューを投稿することができる。
使用したもの
- CodePen
- Netlify
- Vie.js
- iTyped.js
codepenのソースコード
See the Pen 餃子専用レビューページ by Yuki Tamura (@Yuki-Tamura) on CodePen.
制作を通じて感じたこと
第一にWebアプリの開発は一筋縄ではいかないということだ。
htmlやjavascriptなど、本格的に学習してこなかったことはもちろんだが、基礎となるサンプルのコードを少し書き換えれば完成するような代物ではなく、完成させたい形にするまでにかなりの時間を要した。
今回で言えば、入力欄を追加することで出力されるデータが1つのレビューとしてまとめる方法は、学んだ基礎だけでは望むように機能しないということが分かった。
また、Webアプリだけあって参考となる文書が数多く存在する。
学習の助けになることはもちろんだが、それぞれの筆者ごとにサンプルの書き方が微妙に異なるため、むやみやたらに取り入れようとするとかえってまとまりが無くなってしまう。
自身が作成しているコードを都度見返し、無駄な部分、また追加するべき部分はないかを確認する癖をつけることが重要であると学ぶことができた。
後書き
記念すべき初めてのWebアプリ開発は、非常に骨を折る作業だった。
血眼になりながら参考となるサンプルを探し、それをもとにしか作りたいものを作れない私は、やはりシステムのシの字も知らないエンジニアである(エンジニアと言えるのかどうかもまだ怪しい)。
ただ、Webアプリを制作することは、難しいと思うと同時にとても楽しいものであった。
普段スマートフォンで何気なく見ているWebページも、SNS上に添付されている人気餃子店のリンク先も、すべてこのようなコードから生成されているものだと考えると、非常に興味深いものだと感じることができた。
そういった何気なく見ることができる魅力的なWebページを作り上げることができるよう、日々学び続けていきたい。