500
579

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【比較してみた】みんなが使っている個人開発(Webサービス)向けPaaS・ホスティングサービス

Last updated at Posted at 2018-10-28

#はじめに
199X年(2018年) 、 世界(Qiita) は 核の炎(「WEBサービス作ってみた」ブーム) に包まれた!
海は枯れ、地は裂け、全ての生物が死滅したかのように見えた。
だが、人類は死滅していなかった!

ということで、先人達のWEBサービスのPaaS/ホスティングサービス/技術要素を比較してみた。
(普段遊ぶときは、 Heroku×node.js くらいしか使わないので・・・)

※2018/10/29追記:比較記事追加しました!

※2018/11/4追記:結局、何を使えば良いの?に関してはこちら

#サマリ

ホスティングサービス・CDN・DB・ストレージは、「コストで選んでいる」という表現が多かった。
サーバサイド技術はあまりこだわりが見られず、慣れた技術を使っている様子。
一方で、フロントサイドの技術にはこだわる人が多かった。

※2018/10/29追記分の情報を踏まえてサマリに反映済み

比較項目 比較結果
ホスティングサービス AWS・Firebase・Heroku・Netlifyが多い。次いでConoHa。AWSでガッツリ構築してる人も居る。
CDN CloudflareもしくはCloudFront@AWS。
DB RDBMSのが多いけど、NoSQLも多い。ケースバイケース。
ストレージ S3@AWSが圧倒的
サーバサイド Ruby×Railsが強い。次いで、PHP×Laravel、Python。node.jsはそこまで多くない。
フロントサイド Vue.jsが強い、次いでReact.js。SCSSやSemanticUIなどのCSS系技術も強い。
コスト 無料〜700円/月くらいが多いけど、どこまで非機能面(性能、監視、運用など)にこだわるかで変わる。

#比較
##前提

  • 表の見方
    • ハイフンは、記載がない・判別がつかないなど。
    • インフラ(主):処理を担うサーバーが存在する環境
    • インフラ(他):ロードバランサとか
    • (だいたい)投稿日時順で並んでます。
  • その他注意事項
    • 人力判断なので、ミスあるかも。(プログラムで収集とかじゃない)
    • CSSやJavascriptはもちろん、BootstrapやjQueryなどは、もはや使われてないことが無いので、割愛。
    • SCSSもCSSの一種扱いして表現してません。1
    • ドメイン代は記載ない場合が多いので、割愛してます。だいたい100円〜1000円/年くらい。
    • 表が崩れるため、ページタイトルは省略してます・・・

##比較結果
###比較対象一覧

Qiitaの「個人開発」「Webサービス」タグが登録されている記事
いいねが100以上の記事が対象。(一部例外あり)
WEBサービスの個人開発が対象。モバイルとかは対象外。
あと、最近話題になった記事で覚えているものを個人的に追加。

2018/10/29追加
追加分は「2018年内に更新されている」かつ「[WEBサービス]で検索してヒットした」かつ「個人開発(WEBサービス)っぽい」記事です。

###インフラ構成
|記事|インフラ(主)|インフラ(他)|CDN|DB関連|ストレージ|費用|
|:--|:--|:--|:--|:--|:--|:--|:--|
|Rails初心者...|Sakura|-|-|-|-|-|
|WordPressで...|XSERVER|-|-|MySQL|-|サーバ代2376円/月|
|「中年の危機」...のオッサン...|Azure|-|-|SQLServer|BlobStorage@Azure|-|
|東大を出て...1年後に...|Heroku|-|-|PostgreSQL|S3@AWS|-|
|就活のためにWEBサービスを作ったら...|ロリポップ|-|-|-|-|サーバー代|
|開設後3週間で収益10万円...|Heroku|-|CloudFlare|Redis@Heroku/MongoDB/GraphQL|CloudStorage@GCP/S3@AWS|無料|
|10万pv/月達成...ソースコード...|AWS|-|-|MySQL@AWS|-|約6000円|
|...Semantic UIで...|Firebase|-|CloudFlare|RealTimeDatabase@Firebase|-|-|
|「ツイッターでつぶやけるボタン」...|ConoHa|-|CloudFlare|Redis|-|月額630円|
|MapAPI...でWebサービス...|-|-|-|-|-|-|
|...プログラマ向けニュース推薦アプリ...2|Heroku|AWS|CloudFront@AWS|MongoDB@mLab3|-|-|
|...技術ブログサービス「Qrunch(クランチ)」...|ConoHa|-|CloudFlare|MariaDB@ConoHA|-|-|
|初心者3人でwebサービス(webアプリ)を作った...|Netlify|AWS|-|DynamoDB@AWS|S3@AWS|無料|
|Qiitaで草...「QiitaHub」...|Netlify|-|-|-|-|-|
|...JAMstackな草を生やすサービス...|Now/Netlify|-|-|MongoDB@mLab3|-|無料|
|エンジニア向け...名言を集めたサイト...|Heroku/Netlify|-|-|GraphQL|-|無料|
|Qiita版TweetDeck...|ConoHa|-|-|-|-|630円/月|
|...Qiitaの殿堂...|GCP|-|-|sqlite3|-|無料|

2018/10/29追加

|記事|インフラ(主)|インフラ(他)|CDN|DB関連|ストレージ|費用|
|:--|:--|:--|:--|:--|:--|:--|:--|
|...RailsでWebサービス... |-|-|-|PostgreSQL/Redis|-|-|
|ブラウザを...楽器にしてみた |-|-|-|-|-|-|
|学生...!Webサービスの開発... |AWS|AWS|CloudFront@AWS|RDS@AWS|S3@AWS|-|
|...AIを...作れる「AIメーカー」... |AWS|AWS|-|RDS@AWS|EFS@AWS|-|
|...サーバーレスでJAMStackなECサイト...|Firebase|Firebase|-|FireStore|-|-|
|Vue.js + Firebase... |Firebase|Firebase|-|-|-|-|
|...コードレビューサービス... |-|-|-|-|-|-|
|保育園落ちたアラフォー... |Heroku|-|-|-|-|-|
|割り勘webサービス... |AWS|-|-|-|-|-|
|...自分の顔がジャニーズ系かどうか... |AWS|AWS|-|-|-|約2000円/月|
|Angular + Firebase... |Firebase|Firebase|-|-|-|-|
|新卒, Webサービス... |さくらVPS|-|-|-|-|月2000円|
|乃木坂46...ドラクエ風のパーティ... |Netlify/Heroku|-|-|-|Cloudinary|-|
|フロントエンド全然わからないマン... |-|-|-|-|-|-|
|...大学生が1週間でVue.js... |GitHub Pages|-|-|-|-|-|

###アプリ構成

記事 MW サーバサイド フロントサイド 補足
Rails初心者... nginx/unicorn Ruby×Rails - 2016年の記事
WordPressで... - WordPress(PHP) - WordPress
「中年の危機」...のオッサン... IIS C#×ASP.net - WindowsServer
東大を出て...1年後に... - Ruby×Rails - コメント欄が優しい世界
就活のためにWEBサービスを作ったら... - PHP×Laravel - マーケティング
開設後3週間で収益10万円... - Ruby×Rails React×Redux マネタイズ
10万pv/月達成...ソースコード... nginx/unicorn Ruby×Rails - OSS
...Semantic UIで... - - Vue.js SemanticUI
「ツイッターでつぶやけるボタン」... - PHP×Laravel Vue.js 好き
MapAPI...でWebサービス... - - - BingMaps
...プログラマ向けニュース推薦アプリ...2 - node.js Vue.js×Vuex キュレーションアルゴリズム
...技術ブログサービス「Qrunch(クランチ)」... nginx/unicorn Ruby×Rails - フロント自作
初心者3人でwebサービス(webアプリ)を作った... - - React×Redux チーム開発
Qiitaで草...「QiitaHub」... - - React デザイン重視
...JAMstackな草を生やすサービス... - node.js×express 独自FW JAMstack
エンジニア向け...名言...サイト... - Ruby×Rails - 面白さ
Qiita版TweetDeck... - Ruby×Rails - UX重視
...Qiitaの殿堂... - python×Flask - 低学習コスト

2018/10/29追加

記事 MW サーバサイド フロントサイド 補足
...RailsでWebサービス... Docker/nginx×Supervisor Ruby×Rails - バッチ処理もある!
ブラウザを...楽器にしてみた - Ruby×Rails SPA(React)×bulma 音楽な世界
学生...!Webサービスの開発... Docker/Nginx Ruby×Rails Webpack インフラが丁寧
...AIを...作れる「AIメーカー」... - PHP×ZendFramework Python×Flask/Caffe AI
...サーバーレスでJAMStackなECサイト... - FirebaseFunction Nuxt.js JAMstack
Vue.js + Firebase... - - Vue.js ポートフォリオ
...コードレビューサービス... - - - コメント欄が活況
保育園落ちたアラフォー... - PHP×Laravel - コメント欄が活況
割り勘webサービス... - Python×Flask Vue.js 開発ツール活用
...自分の顔がジャニーズ系かどうか... Nginx Python×Flask jinja2 肉厚な記事
Angular + Firebase... - - Angular.js Angular解説が丁寧
新卒, Webサービス... apache Ruby×Rails - 機械学習(TF-IDF)
乃木坂46...ドラクエ風のパーティ... - Java×SpringWebFlux - S3じゃない
フロントエンド全然わからないマン... - Ruby×Rails/Slim Vue.js/Materialize UIへのこだわり
...大学生が1週間でVue.js... - - Vue.js フォントのこだわり

##技術情報補足

インフラ系

記事に無いサービスも紹介してます。

サーバ

  • 大手クラウドサービス: エンタープライズ利用の時に使うイメージがあったが、無償枠を上手く使って個人開発している人が多い。
    • AWS:Amazonさん。ここで改めていうことは無い。
    • Azure:Microsoftさん。ここで改めていうことは無い。
    • GCP:Googleさん。ここで改めていうことは無い。
    • OpenShift:RedHatさん。ここで改めていうことは無い。
  • VPS: 仮想OSサービスなので、OSレイヤーから知識が必要だが、安いサービスが多い。
    • ConoHa: 最近よく聞く。安価で使いやすいらしい。
    • さくらインターネット:昔からあるので、実績面で安心感がある。
    • vultr:激安らしい。よく知らない。
  • PaaS: OSレイヤーは気にしなくていいサービスが多い。手軽にリリースしたいときはこっち。ただ、スリープするのに悩まされることが多い。
    • heroku:安定と信頼のheroku。いろんな人が開発してるので、情報が多くて嬉しい。
    • △Now:新しめのサービス?最近聞くようになってきた。JavaScript (Node.js)もしくはDockerに特化。
    • netlify:新しめのサービス?最近聞くようになってきた。日本向けCNDがあったり、性能面も意識されている点は強み。
    • ロリポップ:2018年12月31日まで無料キャンペーン実施中らしい。
  • BaaS: 基本的には、モバイルアプリ用のサーバ処理を提供するサービス。WEBサービスにも転用可能。
    • firebase:BaaSといえば、これ。ってイメージ。他にもあるけど、今回のメインターゲットではないので、これだけ紹介。
  • その他
    • dokku:VPSとかにインストールすることで、擬似Heroku環境が作れるらしい。とても便利そう。PaaSでも、サービスによっては使えるので、活用していきたい。

メール

  • Mailgun : APIベースのメールシステム・・・紹介記事

ツール系

ちょっと目に止まったツール類を軽く紹介。

デプロイツール

  • Capistrano :Railsのデプロイツール・・・紹介記事

デザインツール

データ収集

ビジネス系

ドメイン

クラウドソーシング

  • Lancers:サービス名称の募集に使っている人がいた

その他

アーキテクチャー

  • DDD:ドメイン駆動開発。プロセスの定義ではなく、考え方についての定義なのでちょっと難しい。・・・紹介記事
  • JAMstack:「サーバとのやり取りはAPIのみとし、HTML側でそれを受け取って表示するような感じ」って理解している。2017からキーワードとしては上がっているけど、作りやすそうだし、流行りそうな気がする。・・・紹介記事1紹介記事2

個人開発に役立ちそうな記事

役立ちそうな書籍

さいごに

気まぐれに比較して見ましたが、だいぶ情報が整理されて個人的にはスッキリしました。

基本的に、みんな急に新しい技術に手を出したというよりは、少しずつ取り入れて行って、いまの形に落ち着いたって人が多いっぽい。
「プログラミング始めて〜ヶ月で」みたいな人には当てはまらないだろうけど、歴史あるぽい方々は、そんな感じで、ある程度似た技術でWEBサービスを作っていた。

自分は幸いにもherokuで遊んだり、AWSのいくつかは触ったことあるので、近い技術から模倣してみようかな。(無償枠の範囲で)
あと、ネットワーク周りの情報が少ないので、そこらへんを意識しながら構築してみたい。

あ、記事内の間違い or こういうサービスもあるよ的な話あれば教えてください。

以上です。

2018/10/31追記

(たぶん一盛り上がり終わったと思うので、反響を追記)
エゴサしてると、GCPのサービスであるGCE推しの人がちらほらいるので、今のトレンドはそっちに移りつつあるのかな?

  1. ちょっとフロントエンド界隈には疎いので、どれくらい市民権を得ているのか知らないのですが、なんとなく使っている人が多い空気感を感じました。

  2. プログラマ向けニュースキュレーションサービスを作ってみた話が前日譚としてあります。 2

  3. mlab は MongoDB, Inc. に買収されました。今後は MongoDB Atlas という mlab と類似のサービスに統合されていくようです。 2

500
579
10

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
500
579

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?