【Rails6 + Vue.js】ブックマーク個人管理SPA

Sho Utsuki
現在就職活動中（ITエンジニア志望）
OVERVIEW

ネット上のwebサイトのリンクをブックマークとして簡単にカテゴライズして保存し、速やかな検索を実現し作業効率の向上を目指して開発した、シングルページアプリケーションです。

YEAR 2021

アプリケーション概要

アプリケーションのGithubリポジトリは以下になります。

要件定義等の詳細はREADMEに記載しておりますのでそちらをご一読頂けますと幸いです。

また、当アプリケーションの開発手順についてQiitaに記事を投稿しております。そちらも是非ご一読頂けますと幸いです。

  • アプリケーションURL
    当アプリケーションのURLは以下になります。
    https://drawer-app-0213.herokuapp.com/

    ※アプリケーションのご利用にはユーザー登録またはログインが必要となっておりますが、個人情報等は登録しないようよろしくお願いいたします。
    ※挙動確認には以下のテストアカウントを使用して頂くようよろしくお願いいたします。
    【テストアカウント】
    メールアドレス：test01@test.com
    パスワード：test01test01

  • 開発環境の詳細
    【開発言語】 Vue.js / JavaScript / Ruby
    【FW】Ruby on Rails / Vuetify
    【RDB】MySQL
    【デプロイ】Heroku
    【バージョン管理】Git / Github
    【課題管理】Trello

  • バージョンについて
    Ruby : 2.6.5
    Ruby on Rails : 6.0.0
    webpacker : 4.0
    node : v14.16.0
    yarn : 1.22.5
    Vue.js : 2.6.12
    Vuetify : 2.4.7

機能詳細

アプリケーションには以下の機能を実装しております。

  • ブックマーク投稿機能
  • ブックマーク編集機能
  • ブックマーク削除機能
  • 投稿したURLへのアクセス機能
  • axios利用中におけるCSRFの対策
  • 非同期でのフリーワード検索・カテゴリー別絞り込み機能
  • ブックマーク並び替え機能
  • ページネーション（kaminari）
  • ユーザー管理機能（devise）
  • ローディング表示

【ブックマーク新規投稿機能のイメージ】


【ブックマーク編集機能のイメージ】


【カテゴリー別絞り込み機能のイメージ】

【フリーワード検索機能のイメージ（カテゴリー別絞り込みとの併用も可）】


WEBSITE