crea7dossantos / sweep Goto Github PK

refresh_token の期限が切れたときはユーザーの再認証をサインインの部分から行わせて refresh_token を新しくするために、サインアウトさせる。

Tableを create_all をするのでなくて、Migrationしてスキーマの状態管理などを行う。
参照- Flask + SQLAlchemyプロジェクトを始める手順
https://qiita.com/shirakiya/items/0114d51e9c189658002e

良さげなデザインのWebアプリケーションを見ていると、サインインとサインアップの画面はどちらもモーダルウィンドウで表示していて、かっこいいのでデザイン力も考えて変更する。

• 参考
  airbnb
  dribbble

Todosのtitleの文字列チェックを行う必要がある。

アプリケーションが落ちた時などにログを解析できる様にする。したい。

Sentryでイベントログ収集をしよう！ - Vue.js編 -

SQLAlchemyを使ってデータの更新などを行う。
主な目的としてはSQLインジェクション対策など。

セッターからモーダルが非表示になった場合のストアデータの処理と、 mounted 部分で返り値を v-text-field にセット。 save 時に validation をかけてルールの部分にエラーが発生しない場合のみ、/update のエンドポイントを叩き、プロフィールを変更できるようにする。

ユーザーがアカウントを作成していなく、ログインしていない時には、Todoアプリのトップ画面を表示してユーザーにアカウント作成とログインを推奨する。

• login画面の作成
• signup画面の作成

監視プロパティでTodoを追加した後に空文字を入れてしまうとdangerクラスが走ってしまうバグを防ぐ。

Flaskでの認証機能がどのようになるかは分からないが認証機能を追加する

signup.vue と signin.vue の画面で作成していた入力フォームをVuetifyに移行する。
移行理由としては、Validataionが効いたフォームをコンポーネントで提供しているぽくこれを使えば簡単にバリデーションが効いた良い感じのフォームが使えそうな気がした。

プロフィールが二回立て続けに更新されずにモーダルが閉じたときなどに前の前の画像が設定されるなどのバグが発生する

状態管理をVuexに移行してHome画面のファイルを綺麗にする。

タイトル通り、いつTodoを追加したかが分からないので、追加した日付をトップで表示させる。

ユーザー別のデータなどのAPIを実装する

ユーザーがTodoを追加した時にいい感じのアクションを作成する

SPAで構成したいのと、今後の拡張性も含めてフロント部分をNuxtで実装する。

DBへの接続情報など、ハードコーディングしてはいけない部分もハードコーディングしてしまっているので、 .env ファイルを作成して避ける

現在ステータスコードでエラーだけを区別しているので、エラーの内容も v-snackbar で表示できるようにする。

レイアウトに関してまだ適当な部分が存在するので、いい感じに修正したい

sign inの処理をした時に、トークンの確認をしてトークンがあったらsign inやsign upのボタンをページから非表示にしたいのだが、読み込まれないので認証の状態に密接してレイアウトが変更されない。
この辺も状態管理の部分でどうにかなりそうな部分ではあるが。

サーバーサイド側で保存したUTC時刻のデータを、JSTに変換してからバインディングする。

ここでの問題は、画面サイズが900px以上の時はモーダルで表示したい画面はモーダルで表示し、画面サイズが小さい時は通常の用意しているページに飛ばす処理をしたい。
この辺を考慮する必要がある。

トークンが切れていてCookieに期限が切れていない refresh_token が存在したら、トークンを新しく発行してCookieにセットする。

可能性あり。sortした時に上手くいかなかったし、なんか変。
ってかこれは日付のフォーマットした時にも感じたが、DBに格納する時に、サーバー側の日付が変わってない感じする。

axiosの処理でbaseのURLを作成する時に、通常の呼び出しと、アクセストークンをHTTPヘッダに付属する呼び出しと、リフレッシュトークンをHTTPヘッダに付属する3種類が存在するので、プラグインにそれぞれを記述し、そこから参照する。

LoginとSignInの機能を追加するためのNavigation Bar・Headerを上部に作成する。

createdの部分で、DOMがMountされる前にローカル変数に取得した user_idを格納して、 mounted の部分でその変数を読み込みたいのだが、 user_id を取得する前にDOMの処理が始まってしまう。
状態管理の部分で、signinしたタイミングでどっかにユーザーの情報を格納しとかないとつらみが出てくる。

ナビゲーションバーをBulmaで作成していて、レスポンシブデザインに対応できていないので、移行する。

トークンが古くなった時と、トークンがCookieで保存されていない時の差分をJWTのデコレーターで出せるのかなど確認する。

アーリーリターンして簡潔に書ける部分があるので、Do

現在DB側で保存したデータをそのまま表示させているので、Filterのjsファイルを plugins の中に作成し、 nuxt.config.js で読み込み、データをバインディングする前にフォーマットにかける。

昨今のWebアプリは左側に常にメニューが表示されているものが多いので、左側にメニューを表示させる。

フォームに値が入ったままで、ページを create がURLに付いたままリロードすると同じ値が複製されてしまう。

configファイルをルートに置いて、Migrationした結果ルートに置かれるsqliteのdbファイルを読み取れるようにする。
現在は手動で flask_todo の配下にdbファイルを置いて読み取っているので、修正する

投稿をモーダルからも可能にする時に、非同期でPOSTされた要素の変更を行うには、一律な状態管理を行い、View側でセッターを通して変更させる必要があるので、実装する

現在Vuexでの処理をする前にエラーハンドリングを何も行っていないので、もし処理が実行されなかった時のハンドリングをする。

このアプリケーションを読み込んだ時に、ルーティングで index.vue を読み込むようになっていて、 index.vue で表示するコンテンツとしてデコレーターをつけたTodoページを表示させたくないので、 index.vue で表示するコンテンツをこのアプリケーションのトップページとする。

パッケージ構成を修正して、ディレクトリに関連するファイルだけを格納し、実行ファイルを分ける

非同期で行なっているため、処理フローが煩雑になり、バグ発生の恐れが多いコードがある。

投稿一覧から特定の投稿をタップした時に、モーダルで特定の投稿を表示する。