【個人開発】iOSショートカットアプリのレシピ共有サービス『ShortcutPlus』を作りました

## はじめに
iPhoneには**ショートカット**という便利なアプリがあります。
**レシピ**と呼ばれる操作手順書を登録しておけば、その機能を簡単に呼び出せるというもの。

忙しい日々をちょっとだけ効率化してくれるような、そんなレシピをもっと使いたいという思いからこのサービスを開発しました。

## サービス概要
レシピを検索して探したり、自分が作ったおすすめレシピを投稿してシェアできるサービスです。

・アプリURL：https://www.shortcutplus.com/
・GitHubリポジトリ：https://github.com/TYIRI/shortcut_plus

### 作った背景

ショートカットを使っている中で下記の問題を感じており、これらを解決したいと考えました。

* レシピがあちこちに散らばっており、ブログやYouTubeなどを一つずつ見ていく形で探しにくい。
* 自作した凄いレシピを教えたいけど、気軽に言う場所がない。

## 使い方

### 1. レシピを探す
**カテゴリ（未選択可）×キーワード**で検索ができます。
また、**カテゴリ・タグ・投稿ユーザー**ごとにもレシピを一覧表示できるので、趣向が似たものを探すことが可能です。

これといってキーワードは無いけど、どんなことができるか見たい人もいると思うので、アクセスの多い**「人気のレシピ」**やランダムで抽出する**「ピックアップ」**をトップページに表示しています。

これらの閲覧の際にユーザー登録は不要です。

![スクリーンショット 2021-05-15 14.44.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1182523/21219d93-f926-45ce-b3bf-9d6d74998b08.png)

![スクリーンショット 2021-05-15 14.43.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1182523/b3161552-11bc-da31-201f-390e90eb427e.png)

![スクリーンショット 2021-05-15 16.00.07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1182523/98d3a9ef-8034-a5d2-d9d1-4dfa91e2c65f.png)


### 2. レシピを投稿する
ユーザー登録をしたら自分で作ったレシピが投稿できます。
本文の入力は、誰でも難しさを感じずに使えてかつ完成形が分かりやすいものにしたかったので、WYSIWYGエディタ（Action Text）にしました。

![スクリーンショット 2021-05-15 15.38.53.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1182523/ce349a2d-c89c-5b45-0caf-52aa8278b104.png)

ショートカットアプリでiCloudリンクを作成して共有するときに使える、ショートカットIDの入力スペースもあります。

## 使用技術

* Ruby 2.7.2
* Rails 6.1.3.1
* Bootstrap
* tag-it
* jQuery-Validation-Engine
* AWS

### 主要なGem

* sorcery
* aws-sdk-rails
* aws-sdk-s3
* impressionist
* meta-tags
* config
* rspec-rails

### ER図

![スクリーンショット 2021-05-15 20.00.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1182523/aff3558c-e3fb-02dc-943f-a7c0c924871e.png)

### インフラ構成図

![スクリーンショット 2021-05-16 13.29.12.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1182523/470f4ec7-63e7-dbe1-fc80-d69c6ab38dc6.png)

## 開発期間

デプロイまで2ヶ月（300h〜）ほどかかりました。

## 苦労した点

### Action Textの導入
比較的新しいこともあって調べても情報が少なかったことと、slimが未対応で正しく表示されないなど互換性の部分で考慮が必要だと学びました。これについては、Action Textを呼び出す部分をパーシャルにしてerbで作成することで、対処することができました。

### 本番デプロイ
AWSについては知識がほぼない状態だったので、ひたすらググりながら手探りでの作業でした。
特にログの見方が分かるまでは、エラーが発生しても問題の切り分けができずに何度かやり直ししています。
またこのタイミングで、Railsの依存していたmimemagic gemの0.3.5以下が削除されてbundle installできなくなっていることを知り、Railsが依存しないバージョンにアップデートする形で対応。更新内容を確認して実装箇所に影響がないことや、テストを実行して問題が発生しないかを改めてチェックしました。テストのありがたさをこのとき一番感じました...

## 工夫した点

### 通知機能
ユーザー登録をしていると、ヘッダーに通知が表示されます。
通知の内容は以下を設定しました。

* マイレシピにいいね
* コメントにいいね
* マイレシピに新しいコメント
* コメントしたレシピに新しいコメント

投稿する側は反応が返ってくる嬉しさを感じられ、閲覧する側は感想や意見を伝えやすく、コミュニケーションを取りやすいものにしたかったからです。
ちなみに、それぞれの通知項目についてON/OFFの切り替えができるので、欲しい情報だけを得ることができます。

### レスポンシブデザイン
iPhoneやiPadでの利用が多いことを想定して、見やすいデザインにするのはもちろん、各端末の解像度を調べて一番使いやすい画面の表示を心掛けました。
iCloudリンクからはすぐにショートカットが入手できるため、レシピの作成が難しい人でも簡単に試せる形にしました。

## 望む未来
今でこそ当たり前にショートカットを使ってますが、最初はとっつきにくさを感じたり、難しいイメージがありました。
レシピがシェアされて広まっていくことで、ショートカットがもっと手軽なものになれば使う人も増えると思います。

忙しい日常のちょっとしたことがスムーズになり、ルーティンから解放されることで、みなさんが自分の好きなことに使える時間が増えればいいなと願っています。

## おわりに
あったらいいなと思うものを1から形にでき、そしてそれを実際に使ってもらえて、サービス作りの楽しさを改めて感じました。
他にも作ってみたいなと思うアイデアがあるので、世の中に便利さや楽しさを与えられるようなサービスを開発していきたいです。

以上、ご覧いただきありがとうございました！