テックアカデミー

テックアカデミーWebアプリケーションコースのモノリストを作った!

Pocket
LINEで送る

どーも、テックアカデミー受講生、つーさん(@tu_san005)です!

テックアカデミーのWebアプリケーションコースで作ったモノリストについて紹介したいと思います。

モノリストってどんなの?

これはトップページになります。

モノリストは楽天APIの練習用のためのWEBアプリケーションです。

ログインした後、楽天にある商品を検索して自分が欲しいもの、持っているものををリストに入れることができます。

そして、ユーザたちの中で持っているもの、欲しいものをランキングにすることができます。

モノリストの機能

ログイン機能

名前、メールアドレスパスワードを入力して新規登録します。

上の画像は新規登録画面です。

この画面に登録したメールアドレスとパスワードを入力してログインすることができます。

アイテムを検索する

アイテムを追加するというバーを押すと、この画面に遷移します。

キーワードを入力すると、楽天の商品を調べて表示することができます。

そして、調べた商品をwant(欲しい)/have(既に持っている)というボタンを押してマイページの一覧に追加することができます。

want/have一覧

こんな感じで、wantボタンを押したものとhaveボタンを押したものを一覧表示することができます。

ランキング機能

ランキングバーをクリックすると、wantランキングとhaveランキングのページに遷移します。

それぞれのユーザが登録した個数を計測して上位から順番に表示させるというものです。

感想

ログイン機能はツイッタークローンの方でやっていたので、改めてやることでどうやって作ったかの復習になりました。

ここでは楽天APIの使い方を主に学ぶことができました。

APIってなに?ってところから入る人もいると思いますが、そこも含めて使い方までわかるのでよかったと思います。