プログラミング未経験からWebサービスをリリースするまでの365日
こんにちは。タイトルの通りプログラミング未経験者がプログラミングを勉強し、チームをつくり、Webサービスを立ち上げた話について、その舞台裏を公開したいと思います。結論から言うとプログラミングの学習から約1年でWebサービスをつくれるようになりました！
お前は誰だ
@i_am_34といいます。
普段はリブセンスという会社でマーケティングやらなんやらをしています。経歴としてはSEO会社で営業→広告代理店でリスティング広告の運用→リブセンスでマーケティング全般という感じで、インターネッツ関連の仕事をずっとしてきましたが、プログラミングは未経験でした。
何をつくったのか
つくったのはこちら
自分が知らない素晴らしいモノが集まるプラットフォームICHIOSHI
ひとことでいうと実名制のモノレビューサイトです。ユーザー登録をして検索窓に商品名を打ち込むと、Amazonからその商品を探してきて、レビューを投稿できます。
また、他の人が投稿したレビューにはいいねやコメントをつけることができます。実名制を担保するためにユーザー登録はFacebook連携のみ可能にしています。
見た目はこんな感じ
ICHIOSHIは僕個人の「いいモノを探すのが難しくなっている」という課題感からつくったサービスです。Googleの検索結果はアフィリエイトに汚染されているし、Amazonのレビューも捏造されていたりする状況だと、何を信じていいかわかりませんよね。特に自分が普段触れていないような分野だとなおさら。
例えば、母の日って毎回何買っていいか迷うんですが、ありきたりなモノをあげたくないっていう気持ちもあります。解決策として、数年前から職場の女性陣や女友達に最近のおすすめを聞くようにしているのですが、それと同じことをWeb上で完結できないかと思ったのが始まりです。
普段の生活パターンや思考では選ばないようなモノでも、素晴らしいモノって世の中に溢れてると思うんです。そんな自分が知らない素晴らしいモノが集まるプラットフォームがあったらいいなと思ってつくりました。
技術
Ruby on Railsを使用して構築し、サーバーはHerokuのHobbyプラン（7$/月）です。もう少し具体的な技術の話はいつかQiitaにでもまとめようと思います。
はじまり
Web業界で仕事をする中で、自分でもサービス開発をしてみたいと思うようになったのがきっかけです。サービスをつくるためにはプログラミングができるようにならないといけないと思い、独学でRailsチュートリアルを進めたり（環境構築で挫折）、Progateをやってみたりしましたがまったく進捗しなかったので、一念発起してプログラミングスクールへの入学を決めました。
プログラミングスクールへ通う
いくつか候補に挙がったスクールの中で最終的にDIVE INTO CODEへの入学を決めました。
決めた理由はいくつかあります
・授業があったこと（顔を合わせないと友達ができないと思ったので）
・受講期間が長かったこと
・卒業後も自習室が使い放題だったこと
などです。
結論としてはDIVE INTO CODEを選んで正解でした。なぜならICHIOSHIを一緒に開発することになる@tamamushi_2と@yutacaparisonを始めたくさんの仲間と出会うことができたからです。2人はDIVE INTO CODEの2017年12月期の同期です。チーム名はDIVE INTO CODEのある道玄坂をレペゼンしてチーム道玄坂です。
2017年の12月からプログラミングの学習をスタートさせました。カリキュラムは半年間でHTML,CSS,JavaScript,jQuery,Ruby,Ruby on Railsなどを学んでオリジナルアプリケーションを作成するというものです。
プログラミングスクールに通っていたころは平日1時間〜2時間程度、休日は3時間〜4時間程度勉強にあてていた気がします。ただ、これはあくまで平均で最初の方はほとんど勉強しておらず、卒業直前になってラストスパートをかけるアンチパターンの生徒でしたw
そして、半年後の2018年の5月になんとか卒業することができました。卒業するためにはオリジナルアプリケーションを作成して合格をもらわないといけません。卒業時につくったアプリはこちら。（半年かけてこれかよって言わないで）
卒業してからの1ヶ月間くらいは放心状態でほとんどコードを書いてなかったと記憶しています。
着手
あれ、せっかく勉強したのにWebサービスつくってない！やばい！となり、2人に声をかけました。
「一緒にDEMODAYに出ませんか？」
DEMODAYとは、DIVE INTO CODEが半年に1回主催する、スクール受講生と卒業生向けのピッチコンテストです。渋谷ヒカリエに企業のCTOや起業家を審査員として迎え、100名近くのオーディエンスの前で発表できる一大イベントです。
このDEMODAYをマイルストーンとして設定することでサービス開発を前に進めることにしました。
アイディア出し
2018年7月。DEMODAYに出ることが決まったものの、何をつくるかは全く決まっていませんでした。この時は週に1回集まってずっとアイディア出しをしていました。Startup Hub Tokyoの主催するピッチコンテストを見に行ったりもしました。
ここで当時考えていたアイディアを少しだけご紹介します。
空き時間で簡単にバイトができるサービス
現地在住の日本人がアドバイスしてくれるサービス
現地でしか買えないものを買い物代行してくれるサービス
すべらない話を集めたサイト
荷物を変わりに受け取ってくれるサービス
名前を覚えれるサービス
チャリで来たカメラみたいな何か
観光プランを作ってくれるサービス
包丁の砥石
全国の顔パネルを集めたサイト
食べログの逆番
滑らない話はスクロールが重いサイト
セレクトショップのプラットホーム
インスタ映えスポットだけ集まってるサイト
落し物が見つかるサービス
バックの中身を公開するサービス
今では何を意味するのかわからないものもあります。包丁の砥石とかなんでしょうかw
でもこの時間は本当に楽しかったです。喧々諤々の議論を重ね、自分が知らない素晴らしいモノが集まるプラットフォーム「ICHIOSHI」を開発することになりました。
リーンキャンバスというフレームワークに沿って、ICHIOSHIのコンセプトを落とし込んだりもしました
チーム開発
つくるものが決まったらさっそく開発に着手していきます。初めてのチーム開発。最初はわからないことばかりでした。GitHubの使い方もわからないし、どうやって情報共有やタスク管理をしたらいいかも手探り。
職場の開発体制を真似して、開発に関する連絡事項はSlackをメインに使いました。情報共有についてはConfluenceを採用し、タスク管理はJIRAを使うことにしました。
Confluence、JIRA、GitHubはすべてSlackと連携をして、開発に関する通知はSlackに流し込むようにしました。ConfluenceやJIRAを使い倒したわけではないですし、段々と更新頻度も下がっていきましたが月2,000円程度の出費なので契約しておいてよかったなと思っています。Confluenceはあとから見返すと自分たちの初期の熱量に触れられて、なんだかアルバムを見てるような感覚になりました。もちろんうまく使いこなせば開発を加速させることができますし、人数の多いチームであればより使う機会は増えるかと思います。
開発合宿
2018年8月に入ってから2泊3日で開発合宿をしました。場所は色々と悩みましたが、あまりに近すぎるとテンションが上がらないということ、夏だし海の近くでやりたいということで神奈川県は真鶴に決めました。
宿泊は潮騒会館という宿に決め、昼は真鶴テックラボというコワーキングスペースで開発しました。宿を予約してから私物のWiMAXだと電波が入らない可能性があると気づき、直前でYmobileのWi-Fiをレンタルしたのはいい思い出です。Ymobileの電波最強。
タイムスケジュールは下記のような感じです。
1日目
20:00 集合
21:00 開発スタート
0:00 就寝
2日目
7:00 起床・ランニング
8:00 開発スタート・適宜真鶴テックラボに移動
12:00 昼食
13:00 開発再開
18:00 夕食
20:00 風呂（旅館から徒歩3分）
21:00 開発再開
0:00 就寝
3日目
7:00 起床・ランニング
8:00 開発スタート・適宜真鶴テックラボに移動（〜10:00チェックアウト）
12:00 昼食
13:00 開発再開
19:00 夕食
21:00 帰京
この開発合宿でなんとか原型と呼べるものはつくれましたし、GitやGitHubの使い方にも慣れることができました。開発合宿楽しい。
高台から見下ろす真鶴港はどこか懐かしさがあって趣深かった
真鶴に行った際はぜひ宵にいってほしい。
1日目の夜にちょうど花火大会が開かれていて、開発の合間に見ることができました。
ひたすらコードを書く
開発合宿が終わってからの2ヶ月はひたすらコードを書いていました。DIVE INTO CODEのカリキュラムには載っていなかったフォロー機能の追加やいいね機能、コメント機能などを追加しました。
ここでは、フロントの開発にとにかく時間がかかりました。デザインの知識がないのに加え、CSSの理解が中途半端だったのが原因です。CSSを共有しているサイトなどからコピペすることで、ひとまず思い通りのレイアウトにはなるのですが、しばらくするとやり方を忘れてしまい、またCSSの例を探すことから始めるという非効率な方法で進めてしまいました。
DEMODAY
2018年10月4日、ついにDEMODAY当日を迎えました。前日の3時か4時ごろまで、テストレビューを投稿し、プレゼンの直前までバグの修正をしていました。
そしていよいよプレゼンです。各ブロックに20名ほどのオーディエンスが集まった6つブロックを順番に回りながらプレゼンをしていきます。予想外の質問が飛んできたり、こちらが当然伝わるだろうと思っていたことがなかなか伝わらなかったりと、冷や汗をかきながらのプレゼンでした。
最優秀賞と審査員4名の各審査員賞があるのですが、チーム道玄坂はメドピア株式会社CTOの福村さんから審査員賞を授与していただきました！
受賞理由は発表したアプリの中で、唯一エラーらしいエラーを吐かなかったこと。正直、最優秀を狙っていたので悔しかったですが、3ヶ月間一生懸命つくってきたものが評価されたことは、すごく嬉しかったです。
真ん中でさも優勝したかのように写っているのが私です
DEMODAYから今日まで
DEMODAY後は予想通り燃え尽き症候群になりましたが、せっかくここまでつくったサービスを世に出さないのはもったいない！と思い、少しづつですが、ICHIOSHIの改善をしていました。
UIをタイムラインに変更したり、投稿してもらうハードルを下げるためにAmazonのAPIから商品を検索して投稿できるようにしました。あとは自分の投稿にいいねやコメントがついた時に通知されるようにしたり。
でも誰にも使ってもらっていない状態だと少々のバグがあっても気にならないし、開発スピードも全然上がらないということに気づき、このnoteの投稿をもって正式公開とすることに決めました。
今後について
上で書いたとおり、この記事の公開をもってICHIOSHIの正式リリースとします。ここからフィードバックを参考にしつつ改善を進めていきたいと思っています（SEOとかなんもやってないし）。なので皆さん使ってみて、コメントでもTwitterでもなんでもいいのでフィードバックをください！
あと、もしこの記事を見て一緒に開発してみたいとか、話を聞いてみたいという方が入ればお気軽に連絡ください。
あとがき
ここからは蛇足かもしれませんが、これからプログラミングを始めようと思っている方や、サービス開発をしてみたいと思ってる方に少しでも参考になればと思うことを書いていきます。
どうやって時間を捻出したのか
私自身はフルタイムで働いていますので、どうやってプログラミングを勉強する時間や開発する時間を捻出するかは悩みました。（確かスクールに入学する前に、週20時間勉強する必要があると言われました）
そんなわけで、ひとまず残業をしないことに決めました。もともとそれほど残業をしていたわけではないのですが、少しでも残業をしてしまうと生活リズムが定まらず開発に集中できないと考えたからです。幸い残業を推奨するような環境ではないので周りの目などは気にならなかったのですが、残業をしないことで、パフォーマンスが落ちることが唯一の懸念でした。
パフォーマンスが落ちてしまうことには恐怖感を感じましたが、残業なしで同じかそれ以上のパフォーマンスを出せばいいや、と開き直って一切残業はやめました。
残業なしで同等以上のパフォーマンスを発揮するには時間の密度を濃くするしかありませんので下記のことを実践しました。
・次の日にやることを30分単位でリスト化しておく
・勤務時間フルに使った予定を立てない（勤務時間マイナス1時間で立てる）
・一人で作業する時は基本的に耳栓をつけて集中する
・やらなくていいことはやらない（残業できないので自然とやらなくなる）
結構精神論っぽいところもあるのですが、無事に残業をせずにパフォーマンスを発揮できるようになりました！イエーイ！
場所
チーム開発で重要になるのが場所の確保でした。特に僕たちのチームは全員が駆け出しエンジニア（厳密にはエンジニアではないですが）でチーム開発の経験もなかったため、顔を合わせて作業する場所が必要でした。DIVE INTO CODEは卒業生であれば無料で自習室を利用しても良いので、DIVE INTO CODEに集まって作業したりしました。最高です。
あと、六本木ヒルズの49階にあるアカデミーヒルズを契約しました。こちらは月額一万円で朝の7時〜24時までいつでも利用できるコワーキングスペースです。また平日であれば1,000円でゲストも利用できます。週に1回は仕事が終わってから集合して開発の進捗を確認していました。
チームで集まらない日も、DEMODAY前などのは仕事が終わったらその足で六本木ヒルズまで移動して24時までコードを書いていました。ガンバッタ。
壁
体調
体調を崩しまくりました。月に1回は体調を崩していた気がします。やる気はあっても体は騙せないものです。適度に休んで、継続することが大事だと思いました。
フロント
フロントというかほぼほぼCSSですね。プログラミングスクールで基礎は学んだものの、付け焼き刃の学習では思ったようにレイアウトが組めず、色々苦しみました。先人たちのQiitaにはほんと助けてもらいました。
モチベーション
プログラミングを初めた当初はDBに情報を保存できた、保存した情報を表示できた、というひとつひとつに喜びを感じていました。お気に入り機能ができた時は嬉しかったなあ。ですが、開発を進めていくと、自分がつくっているものがどんどん価値がないものに思えてきてモチベーションを保つのが難しかったです。
人に見せたところで、世に出ているサービスと比較されてダメ出しをもらいます。誰も褒めてくれる人なんていません。そういう意味では思い切って社内のエンジニアに見せて見た時は、非エンジニアがつくったという前提で見てくれて、いいところを褒めてくれてすごく嬉しかったです。
感想
チーム開発めちゃくちゃ楽しいです。こんなに楽しいことがあるのかっていうくらい楽しいです。
もちろん仕事としてやっていないし、プログラミングを学び始めたばかりで新しい発見が日々あるというのもあるでしょう。
でも、仕事以外でひとつの目標に向かって夢中になれる機会ってなかなかないと思うんです。
この楽しさをどうやって表現したらいいのか、ずっと考えていたんですが例えていうなら、夏休みに友達の家に集まってスマブラをやってる感覚です。楽しそうだと思いませんか？
少しでもチーム開発に興味ある方はぜひトライしてみてください！
この記事が気に入ったらサポートをしてみませんか？