firebaseを使ってサーバを介さずにデータをやりとりする方法を学びました。本来webアプリでは、ユーザー側からデータを受け取ってそれによってユーザーが期待しているページを返す際にサーバーがまずデータを受け取り、そのサーバーがデータベースとやりとりをしてその返答をユーザーに渡すという工程を踏みます。しかしfirebaseを使うとjavascriptファイルの中で直接データベースに保存しているデータを受け取ることができるのでサーバーが必要ありません。具体的にはfirebase上にプロジェクトを作成とrealtimedatabaseを作成し、webアプリを登録すればfirebase上で自動で作成してくれるapiキーなどが書かれたファイルをプロジェクトのファイルに記述することによってやりとりが可能になります。
Hooks
Hooksというreactでデータを格納できる仕組みを学びました。reactではサーバーとデータのやりとりをしない代わりにreactのプログラムの中でユーザーから受け取るデータを保存しておきます。そのデータはページをリロードするたびに一回一回消えてしまうのですが、reactのreduxというライブラリを使えばこちらが指示を出さないかぎりデータを消さずに保って置いてくれます。これと同じ仕組みがHooksで今回はuseStateとuseEffectを使いました。これらを使う場合はimportでreactファイルからプログラムを受け取ることで使うことができるようになります。const [name, setName] = useState(”);で使うのですが、これはuseStateに格納されているデータをnameという定数に代入して使い、このデータを変更するときにはsetName(新しいデータ)で変更します。useEffectは第二引数で与えられたデータに変更が合った場合に第一引数で指定するアクションを行います。第二引数で指定するものは動的なデータを記述します。