みんなの「作ってみた」

微々たる爪痕を残したいという動機でサイトを作った話

2019/02/14

koukonko
koukonko
プログラミングします Java/PHP/javascript/C#/C++/Python/競プロなどの記事を書きたい

はじめに

初めてWEBサイトを公開してみたので、やったことや動機、感想など色々と書いていこうかと思います。
モチベーションの低い人間がチャレンジ精神で開発したものですので、優しい目で見てください。お願いします。

前段階

動機

自分用のアプリ開発はちょこちょことしていて開発ライフをエンジョイしていたのですが、先日漠然と自分の将来について感じた不安に対して思ったのです。

「このまま自分の存在がなくなったら何が残るのだろう」

何にもないなら何か作ってしまえ。と勢いで開発の下準備を始めることにしました。
自分がこのコンピュータの世界で生きていた爪痕をどこかに残しておきたかったのです。

とりあえず勉強

何か開発すると決めたはいいけど、何の言語で開発をするか決めていなかったので、ネットで面白そうな技術書を探していたら、PHPの面白そうな本を見つけたので、すぐ本屋へ。(PHPは少し勉強していて業務でも短いですが開発経験があったので)
この本屋に行ったのが去年の10月ごろ。

本を買ってその日から約1か月の間、近所の公園に散歩したついでに読み耽っていました。
PHPの基礎からフレームワークの見本など色々書いてある本で、勉強になりました。

アイデア

勉強しながら、ついでに空いた時間でどんなサイトを立ち上げるかアイデアを出していました。
あれもいい、これもいいと思いながらも、開発中に必ずモチベーションが無くなる時期があると思っていたので、つまづいて転んでしまうことを一番に嫌い、技術的難易度の高いものはドンドン排除することにしていました。

出したアイデアとしては、

  • ランダムマッチングチャット
  • 文字で遊ぶブログ
  • 何か一つのグッズだけの画像を収集する
  • 人を苦しめるお金

などなどをテーマに。

この中で「ほどよく難しくて」「ほどよく時間がかかりそうで」「ほどよく自分が楽しめる」「ほどよく継続できそうな」ものを選ぶことにしました。

悩んだ挙句、選んだものとしては「文字で遊ぶブログ」ということに。単純に自分がやりたいを重視した
初めてにしては、ちょっと難易度高いのかとざっくりイメージしていました。

メイン

設計

アイデアも決まって次は全体的なイメージを決めるために、設計をすることに。

簡単な要件定義や概要を箇条書きにして、さらに事細かくアイデアを出すことにしました。
合わせて、画面の洗い出しと画面設計、テーブル設計も。

ですが、10日ほどで時間かかりすぎ!となってしまって「細かく」を撤廃することにしました。
画面設計は抽象的に一部を決めて、それを元に他のページを作成することにしました。
テーブル設計も開発中にカラムの追加、変更することは、常だと思うぐらいガバガバなので現時点で必要なもののみに。

画面を基に工数を計算もしましたが、だいだい3~4かげ...
ちょっと絶望したので見て見ぬふりをしました。

開発

基本的には、フレームワークを元に開発を行いましたが、JSやCSSで使用したものについて記述しようかと思います。

フレームワーク

フレームワークの選定をすることに。
某フレームワークのようにセキュリティの問題が発覚した時が怖いので、のせないことにしたいと思います。

選定基準で一番大きかったのは、仕事関係でとあるフレームワークを扱う案件を見聞きする機会が多かったということです。

入れたもの

CSSには自信がないので、CSSのフレームワークを導入することにしました。
単刀直入に、bootstrapです。
これも初体験なのでよく分からず、調べながら感覚を頼りに。

JSは、jQuery、popper、code-prettify、js.cookieを使っています。

  • jQuery
    • よく知られているJSを書きやすくするためのライブラリだと思いますが、これは頻繁に使ってるので多少なりとも。
  • popper
    • bootstrapで必要になるため入れました。
  • code-prettify
    • コードを綺麗に見せてくれるライブラリで入れています。
  • js.cookie
    • JSでクッキーを操作しやすくなるために入れています。

結果

開発には、2か月ほどかかりました。
環境周りの構築は、2週間近く。

勉強期間を含めると3ヵ月以上のめりこむ結果となりました(まだ終わったわけではないですが)

人に使ってもらうということに多少恥ずかしいという感情があるので、集客はのんびりと、これからしようと思っています。SEO分からないので勉強します笑

現時点の自己評価としては、50点ぐらいです。CSSはまだ改善したいですし、機能もまだまだ追加したいです。

感想

Twitterでご存知の方もいらっしゃいますが、体調があまり良い方ではないので、ゆっくりまったりマイペースを意識していました。ですが、のめり込みすぎてほとんどSNSなどはしていなかったですし、生活のいろんなことが疎かになってしまう開発期間でした。私の性格が関係してますがこれは良くない。

よく個人開発の問題点となるモチベーション。色々ブログ拝見しました。
ブログを読んでいると、モチベーションを維持するためにドメインやサーバーなどお金がかかるものは、開発すぐにやってしまえというのが多かったですが、私は公開する直前にすることに決めていました。気持ちで焦りたくなかったですし、そこまで追い詰めるつもりもなかったです。人それぞれによるところだと割り切りました。

これをしておいて良かったというのは、紙に設計、アイデア、開発期間の目標などをメモとして書いていたことだと思います。○○したい、○○の方がいいなども、適当に書いてます。人に見せられるものではないです笑
このメモは常にPCの前に置いてて、少しの時間があるとすぐ追記できますし、必ず目に入るのでモチベーションの継続に大きな役割を果たしました。

作るサービスに名前を初期段階からつけておくというのもすごくいい効果があるとも思えました。口癖のように名前を呼んでました笑

開発を続けていたら、キリがないのでどこかで公開すると決めて置くことも必要なのかなと学べました。完成から公開ということを考えているとかなり後になると思うので、個人開発だとモチベーションが付いてこない気がします。

それとまだまだ技術的に拙いことは、痛感しました。開発の半分以上は分からなくて調べるが多かったです。特につまづいたのは、画像をJSで小さくしてサーバーに送信するという機能は大変でした。あってもなくても良かったのかなと思いましたが、チャレンジの気持ちで挑むことに。

これからもまだ開発をする予定ですが、とりあえず公開できるまで来たので、一区切りということでここでお話を公開することにしました。

ここまで読んでくださってありがとうございました。

開発したサイト

https://watatsuku.com