1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

VueCLIとfirebaseで匿名掲示板を制作した際に、参考にした記事とエラー解決記事

Posted at

#はじめに
この記事を書く目的は、VueCLIとFirebaseで匿名掲示板を制作した際に、参考にした記事とエラー解決記事をまとめておきたいと考えたからです。
そして、僕がエラーでかなり苦しんだので、解決策の一つとして力になれば幸いです。

##「$ firebase list」のエラー解決
参考記事:「$ firebase list」のエラーに関して

$ firebase list → $ firebase projects:list

コマンドが変更されたみたいです。
僕はfirebaseのHosting機能を使用する際に、この問題が起きました。

##TimeStampで時刻を表示させたい

参考記事:Firebaseで取得したUnixTimestampを文字列に変換する
【Firebase】知らなくて損した時間の取得方法【1行だったのに…】
firebase公式ドキュメント

ここで一番苦労したのは、書き方がわかっても自分の場合どの箇所に書いたらよいかわからず苦労しました。また、短くする記述もわからず、結局、長々となってしまいました。

   <ul>
      <li v-for="(todo,key) in todos" :key="key" class="loop_lisy">
        {{todo.name}}
        <button @click="removeTodo(key)" class="delete_btn">削除</button>
        <div class="date_display">
          {{todo.timastamp.toDate().getFullYear()}}-{{todo.timastamp.toDate().getMonth()+1}}-{{todo.timastamp.toDate().getDate()}}
          {{todo.timastamp.toDate().getHours()}}:{{todo.timastamp.toDate().getMinutes()}}
        </div>
      </li>
    </ul>

##掲示板を制作する際に参考にしたもの
ToDoリストを作りながら学習しよう!
VueJS入門その30「VueJSとFirestoreでTODOリストを作る(1)」
他にもドットインストールやUdemyを参考にしました。

僕が制作した掲示板は、todoアプリを制作する記事を参考にして、派生させました。
なぜ、todoアプリから派生させたかというと、Qiitaなどで掲示板を制作する記事はたくさんあったのですが、firebaseのバージョンが変わったせいかルールの記述方法が違ったり、router,vuexを同時に使用していて複雑過ぎる記述があったりと、難しすぎて参考にならなかったからです。

#さいごに
これらの記事以外にもエラーや参考にした記事がたくさんありましたが、記事にまとめようと考えたことが遅かったためこの分量しか残っていませんでした。この記事が参考になれば幸いです。

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?