Phote-App

Masato Toyoda
OVERVIEW

技術力を確かめる為に作成したSNSアプリケーション

YEAR 2020 - 2020

■制作背景

今や多くの人が使用し楽しむ「Instagram」。

その仕組みや、機能に興味を持った私達はこの「Instagram」のようなアプリケーション開発に取り組んでまいりました。

こちらのアプリケーション開発では未だ触ったことのない機能や、技術を取り入れることに積極的に挑みました。
その例として、Dockerを導入し誰でもdockerイメージを共有可能にし、ActionCableを使用したWebSocket通信を使ったメッセージ機能等、知識が0だった私達は新たな技術も多く取り入れました。
その中で生まれるチームワークや、多くのスキルアップが表れるようなアプリケーションになっておりますので、ご紹介してまいりたいと思います。


■本番環境について

  • アプリケーションURL
  • ゲストログインするには？
    • ログインページのログインフォームにある"ゲストログイン"のボタンをクリック。
      ※ゲストログインしているユーザーはプロフィール編集とパスワード編集ができませんのでご注意下さい。


■アプリケーションについて

・InstagramのようなSNSアプリケーションです。

▶︎制作人数:2人/制作期間:2ヶ月

▶︎投稿：写真投稿や動画投稿では最大10枚の写真が投稿でき、

　　　　コメント・いいね等を通して他のユーザーの反応が見れます。

▶︎フォロー：ユーザーをフォローすることでいつでも友達の投稿が見れます。
▶︎ダイレクトメッセージ：一人一人と会話が可能です。

▶︎おすすめページ：いいねの多い投稿が見れます。



■アプリ機能一覧

  • アカウント認証機能（devise）
  • ゲストログイン機能
  • 写真・動画等の新規投稿機能(最大10枚投稿可能、写真、動画の同時投稿可能)
  • 投稿詳細機能(モーダルウィンドウでの表示あり)
  • 投稿コメント機能(ajax)
  • 投稿いいね機能(ajax)
  • ユーザーフォロー機能(ajax)
  • ユーザー一覧機能
  • ユーザー詳細機能
  • ユーザー検索機能(インクリメンタルサーチ)
  • ユーザーオンライン/オフライン表示機能
  • 非同期でのメッセージ機能(ActionCable, Websocket)
  • いいねの数順に投稿を表示するおすすめ機能
  • ハッシュタグ機能


■使用技術一覧

【フロントサイド】

  • HTML
  • CSS
  • Haml
  • Scss
  • JavaScript
  • jQuery
  • Bootstrap(モーダル表示のみ)
  • slick


【サーバサイド】

  • Ruby2.5.1
  • Ruby on Rails 5.2.4.3


【DB】

  • MySQL


【開発環境】

  • Docker
  • docker-compose
  • GitHub
  • GitHub Desktop
  • Visual Studio Code


【本番環境】

  • AWS
  • Nginx, unicorn
  • Capistrano(自動デプロイ)
WEBSITE