チンケなアプリを作って実感した、「個人開発って、物凄い事なんじゃないのか?」という事。

development2 個人開発

個人開発に興味があるものの、フロントエンドが苦手なんで何とか克服しておきたかった。
そんで、まずはチンケなアプリをサクッと作ってみようかと思って、ちょこちょこ手を動かしてみました。

作ったの、こんな感じ。

異名ジェネレータ

ランダムに言葉を生成して、適当な異名を探す。英語/日本語。
https://another-name-generator.netlify.com/

CSV to TABLE

CSV をテキストエリアに入力したら、ちょっといい感じにテーブル化する。
DLして遊ぼうと思ってたデータがCSV形式だったんで、その過程で作ってみた。
https://csv-to-table.netlify.com/

「うっわ! ショボ!」
って思ったかもしれないが、まぁ、その通り。否定する気は全くありません。
正直、練習という要素が強いんで、こんな問題を解決しようとか、世の中にどんなインパクトを与えようとかは、ほぼ考えずに作りました。

多分、「こんなの、素人でも作るのに3日もいらないんじゃね?」という印象を持った人も居るんじゃないかと思う。
ってか自分も、そのぐらいでサクっと作れるボリュームを考えていたつもりだ。

しかし、実際に手を動かしてみると、こんな有様だ。
手を動かしている間、日誌というか雑多な記録をつけるようにしていたんで、その経緯が以下のような感じになりました。
(クソ長いです。リンク先をクリックせず、そのままスクロールしてもらってOKです。)

Part 1. 異名ジェネレータ:公開までの振り返り

土台構築期1(レベルが低すぎて倒される期)

【Vue.js】vue-element-adminで遊んでる。
【Vue.js】vue-element-admin遊びの続き
【Vue.js】vue-element-admin遊びの続き2
【Vue.js】vue-element-admin遊びの続き3

土台構築期2(起き上って進む期)

【Vue.js】次の遊び(todo-backend-golang-mc)
【Vue.js】次の遊び(Vue-Bootstrap-with-Material-Design)
【Vue.js】vuetifyjs/theme-blog
【Vue.js】vuetifyjs/theme-freelancer
【Vue.js】Vue-Bootstrap-with-Material-Design その2
haikunator で遊ぶ
haikunator で遊ぶ その2
【Vue.js】Vue-Bootstrap-with-Material-Design その3
【Vue.js】Vue-Bootstrap-with-Material-Design その4
【Vue.js】v-bind と v-model
【Vue.js】Vue-Bootstrap-with-Material-Design その5
【Vue.js】「:is」が理解できなかったのでサンプルを書いた。
【Vue.js】Vue-Bootstrap-with-Material-Design その6

「Vue.js わからーん!」と言いながら、突き進んでる期

【Vue.js】data とか data(/) とか、使い分けがよく分かんない。
【Vue.js】Vue-Bootstrap-with-Material-Design その7
【Vue.js】通常の for文って?
【Vue.js】created と mounted の使い分けがよく分かんない。
【Vue.js】v-model がよく分かんなかったんで調べた。

Ver1 リリース

【自作アプリ】Vue.js:何か作った

Ver2 意外と簡単に行けそうなので、機能追加にやってみる期

【自作アプリ】異名ジェネレータ:機能追加

Ver2 エラー遭遇期

【自作アプリ】異名ジェネレータ:追加機能作成中
【自作アプリ】異名ジェネレータ:追加機能作成中 その2
【自作アプリ】異名ジェネレータ:追加機能作成中 その3 エラー遭遇中
【自作アプリ】異名ジェネレータ:追加機能作成中 その4 エラー遭遇中
【自作アプリ】異名ジェネレータ:追加機能作成中 その5 エラー遭遇中

Ver2 方法転換期

【自作アプリ】異名ジェネレータ:追加機能作成中 その6 作戦変更(ダメな方向に)
【 Node.js 】csv → json 変換ライブラリを色々試した。

Ver2 リリース

【自作アプリ】異名ジェネレータ:日本語訳機能追加

Part 2. CSV to TABLE:公開までの振り返り

次のアプリ作成中:その1
【Vue.Js】「@Click.Native.Prevent」の意味がわからなかったから調べてみた。
【Vue.Js】CSVファイル読ませてそれを画面上に反映させたかっただけなのに、何か遠回りしてる。
【Vue.Js】Vue Router で出来る範囲のことがいまいちよく分からない
【JavaScript】CSV から JSON に変換してくれるライブラリとか
【Vue.Js】Json-2-Csv 使ってみたけど、上手くいかない。
【Node.Js】csv(というライブラリ)の使い方がよく分からない。
【JavaScript】Import XXX と、Import { XXX } って、どう違うの?
【自作アプリ】CSV to TABLE を公開してみた。


要約すると、
『「わからーん!」と「全然うまくいかねー!」を繰り返しつつ、妥協に妥協を重ねた上にブチかっこ悪い着地をした挙句、一部はハリボテで出来てます♪』
という事が書かれています。
あと、読んでもらえれば分かるかと思いますが、完全に理解しないまま使ってる所も多いです。

ちなみに書き手は、システム開発についてズブの素人という訳ではありません。(フロントは得意じゃないけど)
得意なのは .NET、PHP、Java あたりで、フロントはぜいぜい jQueryを使うレベル。
どっちかというとWindows デスクトップアプリを作るエンプラ案件のが得意だけど、徐々にスキルセットを Web系に寄せていこうかとフロントにも手を出している。
(というかフロントは興味があって触ってる。)

実務で触ったことあるフロントエンドフレームワークは Vue.js の 1系のみで、jQuery と素の JavaScript がキメラの如く混ざり合った Chaos☆な感じで、まぁまぁパンチが効いた体験をさせてもらった。普段 Vue.js を触っている人が見ても、「分かりづらっ!」と言ってくれたシステム。

ドットインストールの Vue.js を全クリし、「基礎から学ぶ Vue.js」を読みながら手を動かしている。(全部の内容が理解できている訳では無いので、「読了」とは書かないことにした。)

そのぐらいの人間ですが、冒頭でご紹介させて頂いたアレを作るのに、上記のような大変な経路を辿りました。
作り手の能力に問題がある事を差し引いたとしても、あの程度のチンケなアプリ作るだけでも、まぁまぁな苦労がある事が伝わってくれればと思います。
 
わかった事は、
『個人開発者って、すげえ。』

あんな小さいアプリ作るだけでも、これだけの苦労をしたんだ。
個人でまっとうなプロダクトを世に送り出すなんて、どれだけ凄いんだよ。
個人開発者の方々の凄さを実感すると同時に、自分のエンジニアとしての力量の低さを嫌でも実感していまう。

という感じで、個人開発に興味があって、色々な構想を練っている方も多いと思いますが、まずは上記のようなチンケなアプリを作ってみるところから始めてみてはどうでしょう?

多分、想像している以上に多かった障壁に愕然として、計画を練り直すいいきっかけになるんじゃないかと思う。

小規模なアプリであれば、人によってはもっとサクっと作れると思う。ってか、もっと上手くできる人の方が多いんじゃないかという気がしている。
その時は、
「よーし! こいつよりは上手くいったぞー!」
と、遠慮なく足蹴にしてくれれば幸いだ。それが他のエンジニアの勇気になるのなら。

まぁ、手を動かす事をやめるつもりは無いんで、こんな事を言っている人間が何を作れるようになってるかは、1年後ぐらいに振り返ってみようかと思います。

コメント

タイトルとURLをコピーしました