個人開発者の知見を集めたい！「開発会議」を作りました

![ogp.png](https://qiita-image-store.s3.amazonaws.com/0/116375/c6ac5cd3-c8d5-e98d-7ca5-51740161aa72.png)

開発会議（[https://devtalk.jp/](https://devtalk.jp/)）をローンチしました。


<blockquote class="twitter-tweet" data-lang="ja"><p lang="ja" dir="ltr">【「開発会議」をローンチしました！】個人開発で4年間失敗し続けたからこそ、そこで得た経験やノウハウを集めれればなと思い作ってみました🙌 頑張って界隈を盛り上げたいので、エンジニアに限らずモノづくりをしてる人ぜひ！<a href="https://t.co/kd5uueSMzv">https://t.co/kd5uueSMzv</a> <a href="https://twitter.com/hashtag/%E9%96%8B%E7%99%BA%E4%BC%9A%E8%AD%B0?src=hash&amp;ref_src=twsrc%5Etfw">#開発会議</a></p>&mdash; シリコンバレーのFREERIDER (@svfreerider) <a href="https://twitter.com/svfreerider/status/1106011370728841217?ref_src=twsrc%5Etfw">2019年3月14日</a></blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

開発会議は、プロダクト開発のノウハウや経験を共有できるコミュニティです。プロダクトを開発するということは、単にコードを書くだけでなく、ユーザーを増やし、また売上を計上していくことが必要になります。

私自身、これまで4年間のあいだプロダクトを出しては、閉じてを繰り返してきたなかで、得られた学びを共有したり、あるいは今開発しているプロダクトの進捗を報告し合えるような場があればいいなと思い、このサイトを作ってみました。

## 何ができるの？

### アップデート共有
![top_2.png](https://qiita-image-store.s3.amazonaws.com/0/116375/e6103da5-f698-df5f-9dec-ceff40fd65fc.png)
開発中のプロダクトを登録して、アップデートを投稿します。
「コードを書き始めました」、「○万PV達成しました」、「メディアに取り上げられました」などポジティブな報告から、「サービスをクローズしました」などネガティブなものまで。テキスト入力部分では、開発者に馴染みのあるマークアップ に対応しています。

### フォーラムへの投稿
![top_3.png](https://qiita-image-store.s3.amazonaws.com/0/116375/d5c07d64-7279-acde-be7c-343038bf7e71.png)
個人開発に関する相談や、募集を投稿します。
「テスター募集」、「共同創業者を探しています」、「こんなアイデアはどうか？」など様々なフェーズに出てくる一人では解決できないような話題を自由に投稿することができるような場を目指しています。こちらもマークアップ対応済み。

## 開発環境
 - Rails
 - Heroku
 - CloudFlare
 - s3
 - Amazon SES
 
## 使用した主なライブラリ

- Devise  

認証の実装に便利なgemです。今回、Facebook認証する際、本番環境のみ上手くいかないというエラーが発生しました。その時の解消法はこちらに書きました。  
[DeviseのFacebook認証でハマった（解決済み）](https://qiita.com/freerider/items/e12e91663d5cad877eff)

抜粋すると、 `Devise.rb` にCallbackURLを追記しなければいけなくなりました。これは、FacebookがHTTPSじゃなければサイトを承認してくれなくなったことが原因で、このサイトはCloudFlareで表面上HTTPSにしているだけだったのでダメだったぽいです。

```ruby:config/initializers/devise.rb
  config.omniauth :facebook,
    Rails.application.credentials[Rails.env.to_sym][:facebook][:app_id],
    Rails.application.credentials[Rails.env.to_sym][:facebook][:app_secret],
    provider_ignores_state: true,
    # このCallbackURLを指定する必要がありました
    callback_url: 'https://devtalk.jp/users/auth/facebook/callback'
```

- Cocoon  

親モデルに紐づく子モデルを複数一括登録したい場合に使えるgemです。今回の場合だと、プロダクトを登録する際、「一緒に開発している共同創業者を追加したい」、「イメージ写真を複数追加したい」という実装をする際に仕込んでみました。

```erb:apps/views/products/new.html.erb
      <div class="formItem">
        <h3>共同創業者</h3>
        <%= f.fields_for :user_products do |m| %>
          <%= render 'maker', f: m %>
          <div id="links">
            <%= link_to_add_association "メンバーを追加", f, :user_products, partial: 'maker' %> / 
            <%= link_to_remove_association "メンバーを削除", f %>
          </div>
        <% end %>
      </div>
```

```erb:apps/views/products/_maker.html.erb
<div class="nested-fields">
  <div class="formField">
    <%= f.collection_select :user_id, @cofounder, :id, :username, {}, class: "founderSelect", prompt: "他に創業者がいる場合選択してください" %>
    <%= link_to_remove_association "メンバーを削除", f %>
  </div>
</div>
```

```ruby:apps/controllers/products_controller.rb
def new
    @cofounder = User.where.not(id: current_user.id).select(:id, :username)
end
```

- ActionPack Variants  

ライブラリではありませんが、コントローラーに追加するとデバイスごとにViewを切り替えてくれます。レスポンシブがあんまり好きになれなくて、いつもpc/spで別々に作るようにしています。今までは `jpmobile`を使ってたのですが、今回ActionPack Variantsでできるとのことだったので使ってみました。   
   
ViewによってはHTMLが同じだったりするので、そういう時は何もしなければ自動で一つしかないファイルを読み込んでくれるのが便利でした。

```ruby:apps/controllers/application_controller.rb

class ApplicationController < ActionController::Base
    include UserAgent
    before_action :detect_device_variant

    private

    def detect_device_variant
      request.variant = :sp if is_mobile?
    end
end
```

```ruby:apps/controllers/concerns/user_agent.rb
module UserAgent
  extend ActiveSupport::Concern

  def is_mobile?
    request.user_agent =~ /iPhone|iPad|Android/
  end
end
```

`application.css`でディレクトリごとに読み込むような設定にしてスタイルシートもpcとspで分ければ、簡単に別々のサイトを作ることができました。

## 今後やってみたい実装

- Google Analytics API  
https://developers.google.com/analytics/

現状のサイトだと、定性的な情報しか集められないので定量的なものも集めていきたいと思っています。具体的には、Google Analyticsと連携して、登録しているプロダクトのPVを表示したりする仕様を考えています。売上があるプロダクトは、決済系のAPIと連携するのもありかなと。

## さいごに
個人開発を続けていく上で一番大事なのって「モチベーション」じゃないかなと思います。「多くの人に使ってもらいたい」、「お金を稼ぎたい」というゴールはありつつも、そこまでの過程を険しく、挫折してしまうこともあるのではないでしょうか。  
開発会議は、個人開発者のプロダクトにおける一番最初の被リンクとなり、切磋琢磨できるような空気感を作っていきたいなと願っています。  
 
アップデート頑張るので、ぜひ使ってみてください！