BEN2の単語帳Webアプリについて
- 「BEN2の単語帳Webアプリ」
- URL: 現在は非公開にしています
- GitHub
使い方
単語帳を作って、単語を追加して、覚えたかどうかを記録・更新できる Web アプリ。単語帳の URL を教えて、他の人にも単語帳を使ってもらうことができます。
下の画像は、トップページ。自分が作成した単語帳とブックマークした単語帳が表示されます。単語帳を作成できます。
下の画像は、自分が作った単語帳の画面。単語を追加・削除、単語帳を削除、覚えたかどうかの更新ができます。
下の画像は、他の人が作った単語帳の画面。ブックマーク登録・解除、覚えたかどうかの更新ができます。
実装されている要件
- Twitter 認証を利用したログイン / ログアウト機能
- 単語帳を作れる。作成した単語帳は一覧表示される
- 単語帳を削除できる
- 単語帳に単語を追加できる。追加されている単語は一覧表示される
- 単語帳から単語を削除できる
- 単語単位で覚えたかどうかを表示・更新でき、保存される
- URL を知っていれば、他ユーザーが作成した単語帳を閲覧できる
- 他ユーザーの単語帳をブックマークできる。ブックマークした単語帳は一覧表示される
- 他ユーザーの単語帳についても、単語単位で自分が覚えているかどうかを表示・更新でき、保存される
使用している技術・モジュール等
- サーバーサイドプラットフォーム … Node.js
- パッケージマネージャー … npm
- Web フレームワーク … Express.js
- テスティングフレームワーク … mocha
- DOM 操作フレームワーク … jQuery
- クライアント側フレームワーク … webpack
- 開発用データベース … PostgreSQL
- 本番環境 … Heroku
- 本番用データベース … Heroku Postgres
- OAuth2.0 による外部認証 … passport、passport-twitter
- セッション管理 … express-session
- テスト … supertest、passport-stub
- データベース利用 … Sequelize
- トランスコンパイラ … babel、babel-loader
- デザイン … Bootstrap
- X-Powered-By ヘッダの除去 … helmet
- CSRF 脆弱性対策 … csurf
