Knode Your Code

RU-SOM-FSF-FT-06-2019-U-C | Group Project #2

Project Proposal Writeup | Project Mark Up Documentation | Project PowerPoint Presentation | See the Code on Github |

---

Motivation

We wanted to design a free resource where other individuals learning how to code can practice their coding terminology. Our website uses study materials such as flashcards and quizzes in order for users to hone their skills.

Technologies used and why

Built with:

• Bootstrap:
• Font Awesome:
• JQuery:
• Node: An environment that allows developers to use Javascript to interact with the user without front-end coding.
• MySQL2: Open source database that allows developers to create databases.
• DotEnv: Set environment variables to the global process.env object in node.
• Sequelize:
• Sequelize-cli:

Features

Our website features different levels of difficulties for two functionalities which the user can choose from: (Note: more functionalities will be added later)

1. Flashcards
2. Drag & Drop Quiz

Flashcards

• The user is routed to a page to select the different topics they want to review.
• After the user's selection, the user has 10 minutes to study through pre-made questions.
• When the user is ready to study, they can hit the start button and will have 10 minutes to loop through the set of flashcards or shuffle through all the cards
• When the 10 minutes are up, the user will be routed to the quiz page in order to test their knowledge in the topics of their choosing.

Drag & Drop Quiz

• If the user chooses the quiz from the front page, the user will be routed to the quiz page with 10 questions of different topics pretaining to the skill level of their choice.
• The user will be able to drag and drop the question to the answer area to determine if their choice was correct.
• At the end of the quiz, the user will be prompted their results.

Screenshots

Include logo/demo screenshot etc.

Code Example

Show what your project does as concisely as possible, developers should be able to figure out how your project solves their problem by looking at the code example. Make sure the API you are showing off is obvious, and that your code is short and concise.

Installation

Provide step by step series of examples and explanations about how to get a development env running.

Credits

• jQuery Drag & Drop: Used for flash-card selections & drag and drop quiz
• Glitch Animation Tutorial: Used for the index page logo
• Bootstrap carousel: Used for the flashcards
• Flip Cards: Used for the flashcards

License

A short snippet describing the license (MIT, Apache etc)

MIT © Will Stark, Hetal Patel, Dealan Diongzon, Darius McPhatter, Alex Lo,