The Trip Tip

自身の転職活動用に作成した、ポートフォリオアプリです。
Ruby on Rails(ver.6.0.2)を用いて、旅行好きな方々のための SNS を作成いたしました。
ユーザビリティを考慮した UI/UX に取組み、ユーザーにとって使いやすいサービスとなるよう工夫いたしました。

制作の背景

旅の思い出を簡単に残し、それを他の旅行好きな方と共有して情報交換ができるようなサービスがあったらいいなと思い、作成することといたしました。

本番環境 URL

https://the-trip-tip.com/

閲覧の際は、通常のユーザー登録・ログイン機能によるご確認のほか、ログインページの「簡単ログイン」ボタンから、テストユーザーアカウントによるご確認もご利用いただけます。
ただし、テストユーザーはユーザー情報の更新機能及びアカウント削除機能に、制限がかけられております。
本ポートフォリオは、タブレット・スマートフォンからもご覧いただけます。

使用技術

• バックエンド

  • Ruby 2.6.5
  • Rails 6.0.2
  • MySQL 5.7.29

• フロントエンド

  • html
  • Sass
  • JavaScript
  • jQuery
  • Vue.js 2.6.11

• インフラストラクチャー

  • ローカル開発環境

    • Docker 19.03.8
    • docker-compose 1.25.4

  • CircleCI/CD

    • github 上の master 以外のブランチ への push→CI 実行（Rspec,rubocop)
    • github 上の master ブランチ へのプルリクエストのマージ →CD 実行（Capistrano)

  • AWS

    • VPC
    • EC2
    • RDS
    • ELB
    • Route53
    • ACM
    • S3
    • Nginx, unicorn

アプリケーション構成図

機能一覧

• ユーザーアカウント作成

  • 認証メールの有効化によるユーザー登録方式
  • 認証メールについて再送機能あり
  • SNS(Twitter, Facebook) 認証によるユーザー登録可能
  • ユーザーのプロフィール画像については Vue.js を用いた画像トリミング機能あり
  • SNS 連携によるユーザー登録の場合は、ユーザープロフィール画像に、該当する SNS のものを初期登録

• ユーザーログイン

  • 登録済メールアドレスとパスワードによるログイン方式
  • SNS 認証アカウントについては、該当する SNS ログインボタンを 1 クリックでログイン可能
  • ポートフォリオ閲覧用に簡単ログイン機能あり
  • Remember me 機能あり
  • パスワードの入力を一定回数間違えることによる、アカウントロック機能あり
  • ロックされたアカウントやパスワードを忘れたユーザーに向けて、パスワードのリセット機能あり

• ユーザー情報

  • メールアドレス等のユーザー情報を更新可能
  • アカウント削除機能あり
  • ログイン後は、全ユーザー,フォロー,フォロワーの一覧をそれぞれ表示可能。
  • ユーザー詳細表示機能あり。詳細表示時は、そのユーザーの投稿一覧や、フォロー・フォロワー数などを表示。

• つぶやき

  • Vue.js を用いた画像トリミング機能を使った、画像の添付が可能
  • いいね機能あり
  • ログイン前のユーザーは、作成順にソートした全ユーザーの投稿一覧を閲覧可能
    ※ただし、詳細をクリックするとログインページへリダイレクト
  • ログイン後は、自分及びフォローユーザーの投稿一覧を、タイムラインで確認

• その他

  • フォロー機能あり
  • ページネーション機能あり
  • ローディングアニメーション機能あり
  • オリジナルエラーページ(404,500)あり