2014-08-01

一発当てた個人開発者をまとめるWebサービス作った

http://individualist.link/ (←ドメインかっこいいでしょ)

居酒屋にて 〜

A「やっぱり若者が稼ぐにはアプリ作るしかないと思うんですよ」

B「あー分かる」

B「スマートフォンアプリWebアプリでもいいの?」

C「ゲームは当たると大きくていいよね」

A「Webアプリでもいいです」

B「当ててそれで暮らしてる人見ますね。羨ましい。」

A「いいですよね」

A「そういう人の話聞いてみたいんですけどなかなか出てこないですね」

B「当てた人が人前で自慢するメリットないからねえ…」

B「どういう人がどういうサービスで当てたのかまとめたい」

A「いいですねえ。Wiki 的な」

B「Google Docs とかでやってみる?」

A「おお、やりましょう」

B「Webサービスにしてもいいかも」

帰宅 & 1時間後 〜

B「できた」

B「ドメイン取ろう」

B「http://individualist.link/

アルコール入ってるから話のディティールうろ覚えだけどこんな流れで作りました

やっぱり若者が稼ぐにはアプリ作るしかないと思う。

当てたいなら先例を見るのが一番参考になるはずだし、僕は個人で作ったもの流行っているのを見るのが好きだし、そういうのとても興味ある。

このサイトを見ていると、どういう人がこのサービス作ったんだとか、これ個人で作ってたんだという発見があっておもしろいと思います

時間で出来た

時間で出来たというのはほとんど誇張ではなくて、デザインに拘る時間サーバーに設置する時間を抜かせば本当に1時間でできます

せっかくなのでちょっと開発について書きます

このサイトコーディングに使う大まかな作業をまとめると

データベース接続

Twitterアカウントユーザー登録

画像保存

タグ付け

JavaScriptで動き付ける

CSS整える

HTMLマークアップ

デザイン

というような感じになる。これらを実直にいちいち実装してたら1日で終わるか分かりません。

本を読む一番はやい方法は、文字を読まないことです。

コーディングせずにライブラリを使いましょう。

ちょっとコードが書けると実装する道筋が思いついちゃうからライブラリを探す考えに及ばず実装しちゃう事があると思います

そういう事は避けて、アプリを書くならアプリ本体を最小に済ませるか、ライブラリ自体を作ることに力を入れましょう。

こちらのサイトではRailsのレールに乗っかって開発しました。

以下の例はRailsを使った方法ですが、モダンフレームワークを使っているのであればだいたい似たような話になると思う。

ライブラリで組み立てよう

Rails

手に馴染んだフレームワークがあるならなんでもいい。

クソ小さなロジックと数ページしかないならPHPでもいいけど、

とにかくはやく作ることがしたいなら何かしらフレームワーク使ったほうがいい。

秘伝の Rails Application Template を用意しておくのも良い。

データベース接続

モダンフレームワークなら何も考えずにデータベース接続できるはず。

Rails なら config/database.yml に接続情報書いて rake db:create && rails g model User name:string です。

scaffold 使うと更に早くできます

Twitterアカウントユーザー登録

OmniAuth gem を使います

ソーシャルアカウントログインする要件が出たら、何も考えずに「あ、OmniAuth」となりましょう。

Device gem を使うと更に早くできます

画像保存

Paperclip gem を使います

画像保存が必要になったら反射的に「Paperclip か CarrierWave どっにしよう」となりましょう。

ファイル保存とか変換をいちいち実装してたら朝が来ます

タグ付け

ActsAsTaggableOn を使います

has_many :through のめんどくさいタグの実装ですが

これ入れて rake acts_as_taggable_on_engine:install:migrations && rake db:migrate を打てば一発で完成します。

JavaScript で動き付ける

早くつくりたいんなら JavaScript は捨てましょう。

少なくとも生の JavaScript 書く時代ではないので CoffeeScript 使うと良いです。

CSS 整える

とりあえず Bootstrap 入れましょう。

クラスの付け方を覚えちゃうCSS 弄って HTML リロードして確認なんてことしなくても形は整います

Bourbon gem 使って mixin ライブラリ組み込んじゃうのもいいですね。

HTML マークアップ

HTML 書くのやめましょう。

Haml や Slim のようなテンプレートエンジンを使います

Slim が一番タイプ量少なくておすすめ

Zen Coding でもいいけど、結局出力されるのが HTML じゃ見通し悪くて辛いと思う。

Web Components の時代になったらもっと簡単になるんだろうな。

デザイン

こればかりプロっぽいものつくる自信はない…

ただ、Webページやアプリというのはだいたい決まったパターンがあるので、いろいろな事例を見るとよいでしょう。

正直レイアウト自体は他のサイト真似るのは悪くない判断だと思います

しろその方がユーザーにとって慣れ親しんだ分かりやすサイトでもあります

http://individualist.link/場合http://www.producthunt.com/ を異常なほど参考にしました。

まあここまで書いてなんだけど、前提知識として Rails が使えるようになってないといけないのは敷居高くて悪かったと思う。

僕も最初アプリ作るのに途方も無い時間かかってた。

慣れればはやくなるから、たくさんアプリ作って一発当てよう。

思いついたときにすぐ作れるようになれるといろいろ捗るぞ。

なお、今回つくったこのサイト、ぜひともみなさんにも投稿していただきたいのですが現在投稿者承認制としております

質を保ちたいので、捨て垢に荒らされても困りますからね。

私本当に個人が作って運営しているというアプリサイトというのが好きでして、

こちらのサイトリストアップする行為に儲けやがってといった悪意は一切ありません。

私にとっては好きな人達をまとめるサイトなので質はしっかりしておきたいのです。

トラックバック - http://anond.hatelabo.jp/20140801103805
  • http://anond.hatelabo.jp/20140801103805

    利己主義リストおつw

  • http://anond.hatelabo.jp/20140801103805

    これならテキストエディタでHTML1枚書いて終わるんちゃうの。

  • HTMLでいいだろとか言う君達へ

    http://anond.hatelabo.jp/20140801103805 元増田じゃないけどコメントやらブコメでHTMLでいいだろとかWikiでいいだろっていってる輩は何なの? 作ることが何よりも大事であってサービスのデザイン...

    • http://anond.hatelabo.jp/20140801180159

      業界人から言えば、HTMLを書くことも「コードを書く」だけどなw

    • http://anond.hatelabo.jp/20140801180159

      益田で違反行為を行ってる人間なんだから、 ただただ批判されるだけでもありがたいと思うところだろ。。。 本来速攻消されるべきものなのに。 馬鹿なのお前?

    • http://anond.hatelabo.jp/20140801180159

      目的はリストを作る事で、システムを組むことじゃないだろ コードなんか書かなくて済むならその方がいい 元増田の目的がシステムを一通り組みたいってのなら、ここまでやる理由も良...

    • http://anond.hatelabo.jp/20140801180159

      うーん、元増田もライブラリとか使っていかにコードを書かないかって話をしてる気がしたんだけど。 個人的にもこの方向性には賛成で、課題解決が目的でコードは負債だからなるべく...

  • http://anond.hatelabo.jp/20140801103805

    箇条書きは構造化してくれよ。まぁでもはてな記法だるいよね jsが遅いっていうのは表示速度的に?CoffeeScriptの話を踏まえると書く速度なんだろか というのも、これリストの受け渡...

記事への反応(ブックマークコメント)