【小説風】プログラミング未経験の大学職員が本気になってから、2ヶ月でwebアプリを開発した話
皆さん、こんにちは。2020年8月ついに私はサービスをリリースしましたよ!!ドヤ!!と言っても、かなり簡単なwebアプリで誰でも作ることができるようなものです笑
個人的にログを残しておきたいというのもあるし、これからプログラミングを始める人にも、参考になればいいなと思い、ニヤニヤしながらnoteを書いています。なぜ、ニヤニヤしているかって?自分の書いたコードが世の中に出た時に人は皆そうなります。
はい。
※個人の見解です。
あと、単純に書いてもこういう初心者が〜みたいなブログって世の中に溢れているし、専門用語出まくりで初心者からするととにかく読みにくいので、僕はノンフィクション小説風に書いていきたいと思います!笑
それでは、いってらっしゃ〜い!
■プログラミングを学ぼうと思った経緯
「僕の名前は中沢惇平です。とにかく頑張ります!」
と、ありきたりな別に自分じゃなくても、できるしょうもない自己紹介をしてから、僕はまだ一言も話していない。
おいおい。ヤバイぞ。今日は大事な新卒社員での、ご飯会だ。ここで、自分の実力をアピールしないと今後の社会人生活に響くぞ!!!
心の中のもう一人の僕が注意してくる。でも、仕方ないんだ。話せないのには、理由があるんだ。そうだ。同じテーブルに座っているメンバーが全員、エンジニアなんだ。。。半分以上がメガネをかけているような気がするぜ。
俺はエンジニアには弱いんだ。だって、こっちがわからない謎の言葉を駆使して、コミュニケーションを取ろうとしてくる。基本的に情熱だけで世の中を渡り歩いてきた俺には眩し過ぎるんだ。
あとは・・・
とにかく、こいつら。かっこいいんだよ。だって、そうだろ。聞いたこともない謎のカタカナを駆使して、まだ世の中にないサービスを創りあげる。AppleもFacebookもGoogleも全部。この人たちが創ったんだ。そう思うと、「俺もやってみたいんだ!教えてくれ!」なんて言葉を口に出すことはできないだよ・・・
そんなことをトイレで鏡の前の自分と考えていると、人事のTさんの声が聞こえた。
「じゃあ、そろそろ席替えをしましょう!」
よっしゃああああああああああああああ。あの席は俺には眩しすぎた!次のテーブルは確率的に営業やマーケティングの話ができるだろう!ククク・・・そのあたりの分野は俺の得意分野だ。そこらの学生には負けねえぞ・・・ククク・・・
そんなことを考えて、獲物を見つけたライオンばりの迫力で席に戻った僕に一人の男が話しかけてきた。
「初めまして!Sです!データサイエンティストです!宜しく!」
お。なんだ。全ての語尾にびっくりマークがついている。ってことはエンジニアではないな。ただ、一つ気になるな。で〜たさいえんてぃんととかいうのはなんだ。
「おお!宜しく!中沢です!趣味は野球!職種は総合職!」
全ての文字にびっくりマークを入れることで共鳴を狙うという僕の高度な自己紹介テクニックはトラップカード「聖なるバリアミラーフォース」が発動されたのかと錯覚するくらい一瞬で掻き消された。
Sくんは言う
「総合職なんだ!僕はエンジニア職だから関わりがないから、あまりわからないけど宜しくね!」
ガビーーーーーーーーーーーン!!
え。。。エンジニーあ!で〜たさいえんてぃんぬはエンジニアなのか!
ヤバイ、さっき全部の語尾にびっくりマークをつけたことにより、そのテンションは維持しないといけない・・・!ええい!ここは秘儀!「おうむ返し」だ!
「あはは・・・いやー、エンジニアの方がわからないよ・・・あはは・・プログラミングって難しそうだしさ!・・・あはは・・・」
苦笑いで当たり障りのない文章を挟む、この世で最も不味いサンドイッチの完成だ。
「いやいや、プログラミングは難しくないよー!世の中には頭のいいひとがたくさん居て、その人たちがたくさんの便利なコードを公開してくれているから、それをコピペするだけで簡単にできるよ!」
へ・・・コピペでできるの?まじ?
プログラマーに憧れを持っていた僕はその言葉にすぐに騙された。
僕は、プログラミングの世界への招待券を握りしめ、獲物を捕まえて家族のもとに戻るライオンばりに意気揚々と自宅の玄関を開けた。
「僕の名前は中沢惇平です。とにかく頑張ります!」
と、ありきたりな別に自分じゃなくてもできる、しょうもない自己紹介をProgateの謎の羊にしていた。
ここから僕が得た教訓
【プログラミングはProgateから!】
■いや!むず過ぎ!!!編
HTML・・・CSS・・・ジャバスクリプトン・・・ジャバ
いや・・・難しいですけど。いやいや、プログラミングは簡単とか完全に嘘じゃん。流石にh1とかh2とかわかるよ。これにCSSでcolorをredにするんだよね。うん。わかる。
「え・・・これサービス創れるまで何時間かかるん?俺、食べログみたいなかっこいいの創りたんだけど。」とSiriに聞く。
「すみません。よくわかりません」
Siriにわからないことは僕にもわからない。あの、ご飯会のあとに僕は「プログラミング 初心者」で検索してみた。すると、「Progate」をやれと命令文で書かれていたので、とりあえずやってみた。確かに、それは楽しかった。CSSを書いたら文字が変わる。確かに変わる。でも、先がものすごく長く見えた。そんなことを考えながらも、とりあえず、HTML・CSS・Javascript・Pythonのコースを終了した。特にPythonは楽しくて、書籍を買って、とにかく読んだ。しかし、どうしてもわからないことがあった。
これ・・・どうやったら実際の画面に表示されるの?
ずっと、Progateの謎の猫や仙人と遊んでいても、進まないことはわかっていた。
開発環境の構築とググってもAWSやAtom、heroku、Gitなど訳のわからない言葉が多すぎて、何がなんだかわからなかった。
追い詰められた僕は思った。
「プログラミングスクールに通おう!!!」
行動だけは早い、僕はプログラミングスクールに何十万円を支払った。
最初は楽しかった。流石に、スクールということもあり、Progateで学んでいる時よりは成長している実感もあった。週に一回、講師とのオンラインでの打ち合わせがあるので、そこで疑問点が解消できた。しかし、徐々にモチベーションが下がっていった。
理由は簡単だった。教科書に書いてあることを黒い画面に書けば確かに、動く。でも、それはもう結果の知っているボクシングの試合を見ているようで、全く面白くなかった。
僕のプログラミングスクール生活は完全にテクニカルノックアウトだった。タオルが投げ込まれるのを見届けて、少しの知識と引き換えに、プログラミングへのやる気を失った僕はこう思った。
「諦めよう」
ここから僕が得た教訓
【プログラミングスクールに入ればいいという訳ではない!】
■ジーズアカデミーとの出会い
プログラマーの道を完全に諦めてから1年、僕は最終的に選んだ大学職員という仕事を謳歌していた。元々、仕事は大好きな方なので、とにかく毎日が楽しかった。
「そろそろ、起業したいって本気で思ってきた」
とインターン時代の先輩のKさんが言った。Kさんは一つ上の先輩で名前も何故か、一緒のジュンペイだ。インターン時代からいつか起業するとは言っているが、遂に本気でやると考え出したようだ。僕もKさんも学生時代からインターンという形でIT企業で働いていたりしたこともあり、起業は身近な存在だったし、僕は祖母が社長なこともあり、起業はいつかしたいと考えていた。そんな僕らはすぐに意見が一致した。起業の準備をはじめようと。起業の準備にはいくつかあるが、その一つにはプロダクトを創ることがある。しかし、僕はプログラミングは諦めているし、Kさんもビジネスサイドの人間だ。優秀なエンジニアの知り合いはいるにはいるが、仲間になってくれるとは限らない。
どうしようかな。そう僕が呟いた時。Kさんが言った。
「ジーズアカデミーいかん?」九州出身のKさんが少しの方言を交えながら言った。
「なんですかそれ?」僕はキョトンとした顔で返す。
「ジーズアカデミーっていうプログラミングスクールがあるんよ。これ二人でいかん?なんか、半年間で最終的に自分のプロダクト開発するところまでいくらしいよ。助太刀とかここ出身なんだってさ」
早速、ジーズアカデミーのHPを見てみた。なるほど、半年間で自分のプロダクトを本気で創るのか。なかなか、面白そうだし。Kさんと二人ならできるかもしれないし、何より、自分のプロダクトを開発できることに心が踊った。自分たちのプロダクトを創りたい。まだ、僕の心の中にあったプログラマーへの憧れは消えてなかったようだ。
「どう?やめとく?」
もう、データサイエンティストもkaggleのことも知っていた僕は思った。
『自分にはたぶんできない』
でも、プロダクトの創り方も世界の変え方も知らなかった僕はこう答えた。
「二人で世界変えちゃいましょう!」
2020年6月初旬 ジーズアカデミーの入学試験に僕らは合格した。
入学式は8月1日。そこまでの2ヶ月が大切なことは
今までのプログラミングの勉強でわかっていた。
なぜなら、プログラミングは誰かに教わって伸びるものではないんだと、出来ないなりになんとなく感じていたからだ。
どんなに優秀な教科書や動画があっても、勉強する側の僕が自分から行動しない限り絶対に力はつかない。
今までは、誰かに与えられたものを創っていただけだと。
僕はこの時にプログラミングの神様(誰か知らないけど)にこう誓いました。
入学までの2ヶ月で絶対に自分で創ったサービスを世の中に公開すると。
まだ、この時の僕は知らない。
この誓いが自分の想像を遥かに超える、
辛さと楽しさをくれることを。
ここから僕が得た教訓
【主体的に動け!プログラミングの方から寄ってきてくれることはない!】
■師匠登場
ジーズアカデミー入学までの間に自分の創ったサービスをの世の中に公開しようと決めた僕の眉間にはこれでもかとシワが寄っていた。
まったく。わからない。。。
そもそも、どうやってプロダクトを開発するんだ?
プログラミングスクールでやったRubyとか言うのは、どこで使うんだ??
APIってなんだ?フレームワークとかライブラリってなんだ?オブジェクトってなんだ?関数?
わからん。わからなすぎる。やめたろかな。
やっぱり無理なんじゃないか。そんな気持ちになった。とにかく、僕は1日かけて色々と調べた。その結果、僕が見つけた答えがあった。
【とにかく全部覚える!】
これだった。そうに違いない。そう思った僕はスクールで少しやっていたRubyからやろうとした。でも、この考えは大きく間違っていた。Rubyができても、データベースがわからない。データベースができても、サーバーがわからないとやればやるほどわからないことが増えていった。それを全部覚えるのは至難の技だった。
「あーあ、お前がエンジニアで俺がわからないこととか聞けたらいいのになー師匠みたいな感じで笑」
と唯一の同居人のジェシーというキリンの人形に話しかけた。ジェシー師匠は教える気はさらさらなく、いつも通り、眠そうな顔をしている。そんなジェシーに話しかけていると、ふとある考えが浮かんだ。
師匠…か。。。
僕はプログラミングの質問ができる師匠的な存在の人がいればいいんじゃないかと考えた。
たしかに、そうだ。今まではとにかくわからないことがあるとそこから先に進めないからすぐに辛くなるんだ。答えのない問いと戦い続けることが一番きついんだ。これが解消できれば、なんとかなるかも知れない。
すぐに僕はビジネスマッチングサービスにある投稿をした。
【急募】プログラミングを教えてくれる人!!
なんてざっくりとした募集だ。なにが、急募だ。
でも、これ以外知識がなさ過ぎて書けなかった。どうせ誰も来ないだろうなと思っていた。
でも、世の中はいい人が多いみたいだ。3人から応募が来た。
コロナウイルスで自粛期間だったので、3人とzoomで話をしてみた。
1人目の人はフロントエンドを主にやっているエンジニアの方だった。
2人目の人は自称フルスタックエンジニアでなんでもできるとのことだった。
最高だが、最悪だ。
人としては申し分ない。でも、2人の要求は簡単だった。2ヶ月で30万。これだった。いやきつい。誰かわからん人に30万。それはきついなしだ!
でも、よく考えたら当たり前だよな。普通マンツーマンで教えてくれるってなったら、もっと高くなるよなー。やっぱり無理だよな。。スクール通い直そうかな。
なんでことを考えていた時に、マッチングサービスの通知音と共に僕の人生の歯車が回りだした。
3人目のYさんだ。
何を隠そう、2020年度6月6日より、私、中沢惇平の師匠に就任する人だ。
Yさんは大手IT系企業でエンジニアをされているスーパー優秀な方だった。しかし、まったく偉そうでない。そんな方がなぜか、無料でやると言ってくれている。これは夢か?夢なのか?
だって、この人が教えるってなったら、めっちゃお金取れるやん!見ただけでわかるやん!すごいやつやん!
2年前に貰ったはずのプログラミングの世界への招待券はYさんが持っていた。
そう思わせてくれるような出会いだった。
感動している僕にYさんは淡々と次回までの課題を伝えてきた。
「では、フローチャートとガントチャートを書いてきてください。」Yさんは言った。
???????????
え?プログラミング の勉強なのに、
コード書かないの???????????
この人ほんとに大丈夫????????
ヒントはないのおぉぉぉぉぉ???
わけわからなかった。
でも、誰かと会話しながらやるプログラミングは
一人で悶々とやるプログラミングよりも数倍楽しかった。
ここから僕が得た教訓
【一人でやるより、みんなでやろう。そっちの方が楽しいよ。】
■プログラミングの学び方を知る
運命の出会いを果たし、プログラミングの世界へ脚を踏み入れた僕はYさんからの課題に戸惑っていた。
Yさんの課題はこれだ。
・創りたいプロダクトは?
・それのフローチャート
・それの機能一覧
・それのガントチャート
「あのー、言語とかはなんでもいいんですか?」
恐る恐る聞いてみる。
「なんでもいいです。」
「あのー、エディタはなにがいいんでしょうか?」
「なんでもいいです。」
「あのー、パソコンはやはりMacですか?」
「Windowsでもいいです。」
と、基本的な回答は全部「なんでもいい」だった。
僕は愕然とした。僕が今まで拘っていた言語はなんでもよかったのか。。
嘘だろ。
「では、来週までに課題をやってきてくださいね!」
と言い残し、Yさんはzoomの画面から消えた。
正直、僕は思った。
これはおかしいと。
僕はプログラミングを学びたいのに、フローチャートだと??
そんなのビジネスサイドでも書けるわ!
とりあえず早く終わらして、書き方を教えてもらおうと考えた僕は早速、フローチャートの作成に取り掛かった。
「書けない…」
そう、書けなかった。このボタンを押したら、こういう挙動をするというのを書こうとすると多すぎるし、複雑過ぎる。いつも僕が使っているサービスはこんなに複雑なのか。
結局、徹夜で作ったフローチャートやガントチャートはまったく納得できるものでなく、Yさんの一言で詰んだ。
「じゃあ、このボタンを押したら、コメントが書けるようになる機能ありますけど、これってどうやって実装するんですか??」
いや、そんなのわからんよ。
Yさんは続けて言う。
「どう実装するかわからないことをやろうとしても無理なので、頑張って調べて来てください!」
「は。。。はい。」
僕は漫画のような返事をして、zoomを切り、課題に取り掛かった。
早速、コメント HTML 書き方 で検索した。
大量の情報が出てくる。
ここで、僕は大きな変化に気がつく。
今までなら、出てこなかった具体的な実装方法がどのページにも書かれていたのだ。
さっそく、僕は見様見真似でコードを書いてみた。
「動いた…」
衝撃だった。僕はすぐにフローチャートやガントチャートを作り直した。
より、詳細に細かく分解して、どう調べたら答えが出そうかも考えた。
こんな機能も欲しいな。でも、どうやって実装するんだろう?調べてみるか。なるほどー、Laravelってこう言う時に使うのね。
なんか、データを取得したいんだよなー。調べてみよう。なるほど、Ajaxってこういう時に使うのね!
今までは理解できなかったことがスラスラと理解できた。僕はうれしかった。だから、とにかく調べた。エラーとも戦った。でも、頑張れば自分が創りたい機能を作れるんだと思えば、頑張れた。
僕はこの時に気がついた。
プログラミングの1番の上達方は作りたいものを作ることなんだと。土台を固めてからやるんじゃないんだ。やりながら、固めるんだ。
そこから勉強するときは、まず自分の創りたい機能を考えてから調べた。そうすると、よりピンポイントな情報が出てきた。Yさんはこれを伝えたかったんだなとやっと分かった。
僕はこう思った。
Yさんは最強だ。
そして、自分の創りたいものを作る時間は最高だ。
ここから僕が得た教訓
【自分の創りたいサービスを作ることでしか学べないことがたくさんある】
■やっぱりできないじゃん!
Yさんの教えもあって、楽しくプログラミングを学びだした僕は保護者と先生がインスタグラムのように簡単に写真や動画を共有できて、いいねやコメントを送ることで子どもの成長日記がつけれるサービスを開発しようとしていた。
Yさんもそれでいきましょう。とのことで、ジーズアカデミーへの入学式から逆算して、スケジュールも決めた。
よし!あとは作るだけだ!
そうやって、色々と調べた。
あれ、おかしいな。作れない。
たしかに、一つ一つの機能の作り方は調べたんだけどな。
手が動かない。
とりあえず、出来そうなところから書いていこう。
あれ、書けない。
いったん、調べよう。
そんなことを繰り返していると、時間はあっという間に過ぎていた。
僕が自分のミスに気がついたのは、入学式まで残り3週間になった時だった。
僕がしていた重大なミス。
それは、階段を飛ばして成長しようとしていたことだ。
たしかに、創りたいものを作ることが一番成長することは間違いないと思う。でも、それが難し過ぎちゃダメなんだ。自転車に乗れないのに、車を運転するようなもんなんだ。
それに気がついた僕は正直悔しかった。自分の創りたいものを作れない自分がいることが、悔しかった。
仕方なく、僕は方向転換をした。
まずは、自分が頑張れば創れそうなものを作ることにした。
Yさんにこれを伝えた。
「頑張りましょう」とだけ帰ってきた。
頑張ろう。ここで辞めたら前と一緒だから。
そう思った。
また、こうも思った。
結局、難しいじゃねぇかよ。プログラミング 。
ここから僕が得た教訓
【プログラミング学習に飛び級制度はない】
■GASがくれたプログラミングの楽しさ
プログラミングに再び挫折しかけていた僕に、楽しさとプログラミングの魅力を教えてくれた出来事があった。
この頃、簡単なコードであればググって書けるようになっていた僕は社内の課題をGASを使って解決したのだ。
その課題は単純で大勢に文面変えて、メールを送りたいという課題だった。
Google先生に聞いたみたところ、GASでサクッと作れるよ!とのことだった。それは僕レベルでも1時間かからずできるものだったので、作って、実際に使ってみたら普通に動いたので、他のメンバーにも共有した。
それを見たメンバーの感想に僕は衝撃を受けた。
「中沢って天才だね」
自分が書いて作ったモノが人に使われ、感謝されることはこんなにも嬉しいのか。そう思った。本当に嬉しかった。
やはり、プログラミングの本質はこれなんだと。プログラミングという能力と使って、誰かに笑顔を届けることなんだ。そう感じた僕はもっとできるようになりたい。そうすれば、もっと多くの人に感謝される。そして、もっと多くの人の課題を自分の手で解決することができる。
早速、家に帰り方向転換したサービスを創り出した。その時に新たな気付きがあった。
「うーん。この見た目だと使いにくいなあ」
使われる時のことを想像したのは、これは初めてだった。
早く、使って欲しい。早く、自分のサービスを世の中に公開したい。
そう思って寝た。
ここから僕が得た教訓
【最重要項目はユーザーが笑顔になるか】
■深夜3時までの戦い
方向転換をした僕はかなり順調にサービスを作っていった。入学式までに残された時間は2週間もないが、HTML・CSSは書けていた。しかし、ここで大きな壁が僕の目の前に現れた。
axiosだ。
詳しい内容は省略するが、簡単に話すとデータを取ってきたり、渡したり的なあれだ。これの実装方法がどんなに調べてもちんぷんかんぶんのぷんだったのだ。
とにかく、調べた。タブが20個以上。開いていた。
どうすることもできなくなった、僕はYさんに助けを求めた。Yさんは仕事が忙しいのにも関わらず、19時からいけますと返事をくれた。
19時からYさんとのzoomが開始された。僕はてっきり、axiosの攻略法を教えてくれるものだと思っていた。でも、違った。
Yさんからは「どうしてだと思います?」、「どうして動かないんでしょうね。」とあくまで、自分で考えさせるというスタンスは変わりなかった。
「いや、もう教えてくれ。頭がパンクする。」
時間はもう23時。流石に、教えてくれるかと思いきや、教えてくれない。
とにかく、自分で自分で調べる。たまに、Yさんからヒントがくる。そこから、なんとか答えを導き出して、を繰り返した。
「あのー。Yさん明日仕事は??」
「ありますよ」
それが何か?みたいな顔をしている。
もう、僕は諦めてaxiosと本気で向き合うことにした。
結局、試合終了の合図が鳴ったのは、朝の3時だった。
延長15回再試合を戦った高校球児の気持ちが少しわかった気がした。
正直、辛かった。
でも、自分の意図した文字が画面に表示された時、涙が出るほど嬉しかった。
全く、意図していなかったが、その時の画面には
「がんばって」、「泣かないで」
と表示されていた。
プログラミングは熱闘甲子園か!というくらい僕の涙腺を刺激してくる。
ここから僕が得た教訓
【とにかく、自分の頭で考える。答えはその先にしかない】
■あいつらと友達になろう
ここまで頑張ってきた僕はあと少しで、サービスを世に出せる状況まで来ていた。残る壁は二つだ。VueCLIとデプロイだ。
この壁に登る前は富士山に登山未経験者が登るくらいの覚悟をしていた。
だって、そうだVueCLIもデプロイもしたことがないんだ。未経験だからだ。
でも、今回は今までの僕とは明らかに違った。
確かに、エラーはこれでもかというくらい出る。少年野球でも、そんなにエラーしないというくらい僕のMacはエラーをする。トレードにでも、出してやろうかと思うが、これは全て監督である僕の責任だから、とにかく必死で調べた。
今までであれば、ここからググり地獄に入るが、今回はそんなことがなかった。まず、違ったのは公式ドキュメントがスラスラ読めたのだ。今までは、なんかよくわからないことを書いている謎の書物としか思っておらず、申告敬遠していた。そして、もう一つ違ったことがあった。それは、英語が読めるのだ。もちろん、細かい単語は調べながらではあるが、以前よりも読める!
すげええええええええええええええええええええええええ
俺
すげええええええええええええええええええええええええ
こんな気持ちになった。
確かに、Yさんに公式を読め、英語を読めとずっと言われてきた。その教えを聞いて、移動中の電車などで泣きそうになりながら公式ドキュメントを読んでいただた。
その努力?が身を結び、この大きな壁はすぐに乗り越えることができた。
ここから僕が得た教訓
【英語と公式ドキュメントはお友達!】
■ついにサービス公開
僕は僕とジェシーしか居ない部屋で小さく、ガッツポーズした。
世の中に自分のサービスが公開された。確かに見れる。
スマホからもPCからも。今まで自分が使用してきたサービスと同じように見れる。
そこには、言葉にできない感動があった。子どもが産まれたらこんな気持ちになるのかな?
そんな気持ちになり、母親に連絡した。
「見て!俺が作った初めてのサービス!」
母親からの返事は「あら、お疲れ様ですー」という感情のない文章と一枚の画像だった。
その画像には
「がんばって」、「泣かないで」
とpタグで表示されていた。
ここから僕が得た教訓
【開発者は偉大。それを支えてくれる人はもっと偉大】
完
■後書き
皆さん、最後までお読みいただき誠にありがとうございます。
また、Yさん本当にありがとうございました。
今回、私が公開したサービスは見ての通り、かなりしょぼいですし、まだまだ学ばないといけないことがたくさんあります。
https://yellyell.herokuapp.com
しかし、プログラミング開発における本当に大切なことはこの2ヶ月で学べた気がします。
これから、プログラミングを始める私より2ヶ月後輩の皆さん!
偉そうなことは言えません!一緒に世界変えましょう!