https://a3-andrewhand.glitch.me/
This is a simple application designed for a user to log in and edit there own deck list for the card game Magic the Gathering. The site requires you to log in before use.
One of the biggest challenges for me when completing this assignment was understanding the documentation for the variety of express middlewares. I felt as if I constantly choose to read different sources/examples other than the docuemntation provided to full grasp the scope of the middleware because many of them are simply constructers that work behind the scenes. Stepping though those interactions played out with the help of a debugger was also of great help.
For the authentication middleware, I choose to use passport.js seeing as it was covered in class and I did not feel I had the time to learn another service on my own.
The middlewares I choose:
- express-session - Used in class this was a easy solution to session based web servicing.
- cookie-parser - Required for passport as authentication is sent via cookies.
- body-parser - Simplfied request parsing for incoming JSON strings
- helmet - 2 lines, extra security, enough said. Protect your site and protect your users.
- passport - Authentication service covered in class, again a simple solution to a complex problem
- SQLite - I need a database that would support read/writes from multiple users at the same time. This was the easiest solution.
- lowdb - I needed something to store (Username, Password) combinations and I wanted to try it out and see if it was easier than SQLite.
For this assignment, I choose to use Bootstrap as my CSS framework because I have used it for other websites and feel confident in its application. I also appreciate Bootstraps simple designs, where as other frameworks are too focused on adding in addtion elements that are not needed for the page to be function AND elegant.
- Click
Addto add the information from theQuantityCard NameandSet NameFields. - Click
Updateto change the information in theQuantityfield for a givenCard NameandSet Name.
NOTE: TheCard NameandSet Namefields may not change for this. - Click
UpdatethenDeleteto delete the a entry entirely. - Click
Loginin the nav bar to log into your account.
Currently the only user is:
Username: Andrew
Password: Password
To create a new user:
- Click the
Sign Upbutton. - Enter a new
(username, password). - Then click
Sign Inand you should be directed to the Login page.
To log out of your account:
- Click
Sign Out
- Use of Bootstrap in place of traditonal CSS styling to simplify the design of the website.
- Use of a enviromental variables to create a secure session secret.
- Implementation of SQLite to store persistent data to be displayed in the deck list table.
- Use of automatic redirects for the sign in/out pages that vary for success and failure cases.
- Users decklist will only appear for that user, and no other user.