Nuxt.js×Firebase Hosting×PWAでQiita記事共有時に、TwitterIDを取得して作者にメンションで感謝を伝えられるTweetサービスを作った🎉🎉

Nuxt.js×Firebase HostingでPWAを作った🎉🎉🎉

こちらからアクセス→ thanks-mentions

開発コンセプトや想いはnoteにも書きました🙏🙏
作り手と受け手の新しい関係性を作るWebサービスを作った
https://note.mu/watuyo_2/n/nb47f9fa3fe81

サービス名

使用技術

  • Nuxt.js
  • Firebase Hositing
  • Firebase Cloud Storage
  • Stylus
  • QiitaAPI

技術的な詳細は別記事で投稿予定。

概要

見返りが欲しいだけで記事を書いたり、ナレッジをシェアする訳ではありませんが、記事を共有する時にただ共有するのではなく、せめて感謝を伝えられたらと思いました。

自分の投稿した記事に対してメンション付きでお言葉をいただけるのめちゃくちゃ嬉しいし、共感してくださった方が可視化されることでそこで新たな関係性が生まれるのではないかと思い、今回のサービス作成に当たりました。

PWAの使い方&ユーザーフロー

  1. thanks-mentionsにアクセスします。
  2. アクセスすると画面下部に ホーム画面にthanks-mentionsを追加というポップアップが出るのでタップしてホーム画面に追加します。
    ※推奨環境はAndroidのGoogle Chromeです。
    smartmockups_k2jzfghb.jpg

  3. 共有したいQiitaの記事のページにある共有ボタンorChromeの共有からthanks-mentionsのアイコンを選択します。下記の画像でいうと左下のアイコンになります。
    smartmockups_k2jzq8eb.jpg

  4. そうすると下記のような画面に遷移し、記事のタイトルとURL、作者のTwitterIDを取得し表示されます。
    本ページでも内容を編集できます。内容を確認したら共有ボタンをタップします。
    share.jpg

  5. 共有メニューからTwiiterアプリを選択し、Tweet画面に遷移します。あとはTweetをして、作者にメンションを飛ばすだけです!
    smartmockups_k2jzk7z0.jpg

技術的な話

別記事で投稿予定です!

終わりに

たくさんのQiitaユーザーの方に使っていただけたら嬉しいです。
いいね!、コメントをお待ちしてます🙏🏻🙏🏻
Twitter: @watsutyo_2でも受け付けてます🙏🏻🙏🏻

Why do not you register as a user and use Qiita more conveniently?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away