Linquiztics

Linquiztics — a play on linguistics and quiz — is a language learning web application that allows users to create their own quizzes and to answer those made by the community of users. It also features incentivization dynamics designed to gamify learning through customized quiz suggestions, experience points, streaks, leagues, and a global leaderboard.

💡 UPDATE (12/22/2022): With the shutting down of free Heroku services, we have migrated to Railway: https://linquiztics.up.railway.app/

Kindly enter a valid email address during the creation of an account. The web application will send an email to this registered email address after the account has been created and in the event of a password change.

Task

Linquiztics is the major course output in a web development class under Mr. Arren C. Antioquia of the Department of Software Technology, De La Salle University. The students are tasked to create a web application of their choice, provided that it satisfies the minimum requirement of supporting the following operations: log in, log out, register, CRUD (create, read, update, and delete), and search. The application development is divided into three phases:

Phase	Duration	Description
1	4 weeks	Implementation of the front-end view using HTML, CSS, and JavaScript (with hardcoded life-like data for each applicable feature)
2	7 weeks	Implementation of the back-end logic, including database operations (MongoDB), page rendering using a template engine (preferably Handlebars), and local server hosting (Node.js)
3	3 weeks, coinciding with the last weeks of Phase 2	Implementation of session management and password hashing, refactoring of the project following the MVC architectural pattern, and deployment of the application

This project consists of the following folders:

Folder	Description
controllers	Contains the JavaScript files that define callback functions for client-side requests
helpers	Contains the JavaScript files that define helper functions for front-end display and server-side validation
misc	Contains the JavaScript files for initial database population
models	Contains the JavaScript files for database modeling and access
public	Contains the static CSS and JavaScript files, as well as the project assets (images and audio files), for front-end display
routes	Contains the JavaScript file that defines the server response to each HTTP method request
views	Contains the Handlebars template files to be rendered and displayed upon request

It also includes the following files:

File	Description
package-lock.json and package.json	Store information on the project dependencies
index.js	Entry point of the web application

The complete project specifications can be found in the file Proposed Specifications.pdf.

Running the Application

Running on the Web

Open the following website: https://linquiztics.up.railway.app/

Running Locally

1. Before running the application locally, the following software have to be installed:

   Software	Description	Download Link	License
   Node.js	JavaScript runtime built on Chrome's V8 JavaScript engine	https://nodejs.org/en/download/	MIT License
   git (optional)	Distributed version control system	https://git-scm.com/downloads	GNU General Public License v2.0

2. Create a copy of this repository:

   • If git is installed, type the following command on the terminal:

     git clone https://github.com/memgonzales/linquiztics
     

   • If git is not installed, click the green Code button near the top right of the repository and choose Download ZIP. Once the zipped folder has been downloaded, extract its contents.

3. On the main project directory, run the following command to install the dependencies:

   npm install
   

   If the command is executed successfully, the dependencies will be installed into the folder node_modules following the dependency tree found in package-lock.json.

This project uses a pre-populated remote database. DO STEPS 4 TO 8 ONLY AFTER A DATABASE RESET OR MIGRATION TO A LOCAL DATABASE.

4. On the main project directory, run the following command to populate the database with user accounts:

   node misc/add_profile_data.js
   

   If the command is executed successfully, the following will be printed on the terminal (the assigned _id may vary):

   Added {
       displayLanguages: [ 'English', 'Filipino' ],
       quizzesCreated: [ 2, 6 ],
       _id: 60a32d4fafac3e1430152ae4,
       name: 'Gianina Yuchengco',
       picture: '../assets/doggo.jpg',
       username: 'gianinayuchengco',
       email: 'gianinayuchengco@gmail.com' 
       
   [... truncated ...]
   
   Database population complete! Press Ctrl + C to continue.
   

5. On the main project directory, run the following command to populate the database with quizzes:

   node misc/add_quiz_data.js
   

   If the command is executed successfully, the following will be printed on the terminal (the assigned _id may vary):

   Added {
       tags: [ 'animals', 'basic', 'German', 'introductory', 'vocabulary' ],
       subjectLanguages: [ 'German' ],
       ratings: [
           5, 5, 5, 5, 4,
           5, 5, 3, 1, 5
       ],
       accuracies: [
           100, 100, 86, 86, 71,
           71, 57, 43, 29
       ],
       _id: 60a9556188b8f82cdc92368d,
       idNum: 1,
       status: 'Published',
       title: 'Basic Animals',
       
   [... truncated ...]
   
   Database population complete! Press Ctrl + C to continue.
   

6. On the main project directory, run the following command to populate the database with reported users:

   node misc/add_userreport_data.js
   

   If the command is executed successfully, the following will be printed on the terminal (the assigned _id may vary):

   Added {
       _id: 60a959da39ac9f0c7cc6fa94,
       index: 1,
       name: 'Benny Terrier',
       username: 'bulljanai',
       reportDate: 2021-03-28T00:00:00.000Z,
       report: 'Hate speech',
       __v: 0
       
   [... truncated ...]
   
   Database population complete! Press Ctrl + C to continue.
   

7. On the main project directory, run the following command to populate the database with reported quizzes:

   node misc/add_quizreport_data.js
   

   If the command is executed successfully, the following will be printed on the terminal (the assigned _id may vary):

   Added {
       _id: 60a959f76ea1853bf06ced89,
       index: 1,
       quizNum: 3,
       title: 'Conyo 101',
       author: 'danccgabe',
       reportDate: 2021-03-31T00:00:00.000Z,
       report: 'Hate speech',
       __v: 0
       
   [... truncated ...]
   
   Database population complete! Press Ctrl + C to continue.
   

8. On the main project directory, run the following command to populate the database with reported comments:

   node misc/add_commentreport_data.js
   

   If the command is executed successfully, the following will be printed on the terminal:

   Added {
       _id: 60a960ec6bc1dc3340e1d967,
       index: 12,
       commentNum: 21001,
       quizNum: 2,
       comment: 'Not beginner-friendly, but very cool :)',
       author: 'japashiba',
       quiz: 'Anime Quotes',
       reportDate: 2021-05-22T19:52:12.556z,
       report: 'Inappropriate content',
       __v: 0
       
   [... truncated ...]
   
   Database population complete! Press Ctrl + C to continue.
   

9. On the main project directory, run the following command to run the server:

   node index.js
   

   If the command is executed successfully, the following will be displayed on the terminal:

   app listening at port 3000
   Connected to: mongodb+srv://admin:admin@linquiztics.k1zxp.mongodb.net/linquiztics?retryWrites=true&w=majority
   

10. Open the web application by accessing the following link on a browser:

    http://localhost:3000
    

    

Administrator Credentials

To log in as an administrator, go to the Login page and enter the following credentials:

• Username: linquizticsadmin
• Password: ASDFGHJKL123;

Login Credentials (For Testing)

To test the features of a (non-administrator) user account, it is recommended to log in using the following credentials:

• Username: gianinayuchengco
• Password: ASDFGHJKL123;

Note that there are 23 pre-registered user accounts; the usernames are found in the file misc/add_profile_data.js. The password to all these accounts is ASDFGHJKL123;. (The period is not included.)

Built Using

This project follows the Model-View-Controller (MVC) architectural pattern:

• Model: MongoDB as the database program and Mongoose as the object data modeling tool
• View: Handlebars as the template engine
• Controller: Node.js as the server environment

This web application is deployed on the cloud platform Heroku. Since Heroku has an ephemeral filesystem, GridFS is used for the persistent storage of image and audio files.

💡 UPDATE (12/22/2022): With the shutting down of free Heroku services, we have migrated to Railway, another cloud PaaS.

Dependencies

This project uses the following dependencies, which can be installed via the npm install command:

Package	Version	Description	License
bcrypt	5.0.1	Package for hashing passwords	Apache License 2.0
body-parser	1.19.0	Package for parsing incoming requests in a middleware before the handlers	MIT License
connect-mongo	3.2.0	MongoDB session store for Connect and Express	MIT License
dotenv	8.2.0	Package for loading environment variables from an .env file	BSD 2-Clause "Simplified" License
express	4.17.1	Unopinionated and minimalist framework for Node.js	MIT License
express-session	1.17.1	Session middleware for Express	MIT License
express-validator	6.10.1	Express middleware for validator, a library of string validators and sanitizers	MIT License
gridfs-stream	1.1.1	Package for streaming files to and from MongoDB GridFS	MIT License
hbs	4.1.1	Express view engine for Handlebars	MIT License
mongodb	3.6.6	Official MongoDB driver for Node.js	Apache License 2.0
mongoose	5.6.13	MongoDB object modeling tool designed to work in an asynchronous environment	MIT License
multer	1.4.2	Middleware for handling multipart/form-data, primarily used for file uploads	MIT License
multer-gridfs-storage	4.2.0	GridFS storage engine for Multer to store uploaded files directly to MongoDB	MIT License
nodemailer	6.6.0	Package for sending emails with Node.js	MIT License

The descriptions are taken from https://www.npmjs.com/.

Authors

• Mark Edward M. Gonzales
  mark_gonzales@dlsu.edu.ph
  gonzales.markedward@gmail.com
  

• Hylene Jules G. Lee
  hylene_jules_lee@dlsu.edu.ph
  lee.hylene@gmail.com

For queries or concerns related to the Linquiztics project, kindly email linquiztics.webmaster@gmail.com.

Assets (images and audio files) are properties of their respective owners. Attribution is found in the file public/assets/credits.txt and displayed publicly on the Credits page.