Individual project: Web Development notebook

This notebook is an outcome of the Primer and Primer Pro sequence, but needs to go a little further.

Web foundations students will be encouraged to transfer their work to the common template. However, they can try to upgrade their notebook with the backend database javascript if they are advanced students.

#Template

Is it possible to provide students with a template site that they can fork with the following characteristics:

• Based on HTML5 Boilerplate
• little or no styling but uses CSS
• Basic navigation to major sections: HTML, CSS, JS, glossary
• Stores glossary and cards in a free-plan Apigee backend
• able to add new glossary terms with a simple, ugly form
• able to add new cards with a simple ugly form - no image uploads, pre-hosted URLs only.
• includes basic Selenium tests for glossary term and card creation
• Would it use a templating system like handlebars?

Could this be based on Stephanie's work for the class and extended by Al?

Each week, students would add to the notebook

1. Week 1: convert old styles to SASS using material design design language; add hover effects to cards
2. week 2: Create flip cards with CSS transitions and animations; run pre-existing Selenium tests
3. week 3: improve form usability without breaking functionality
4. week 4: Nothing

Each of these exercises should reinforce thematic work and should take 2-5 hours to accomplish for the average student.

Data model:

glossary:
    word: string
    definition: paragraph

card:
    front title: string
    front icon URL: string
    front background image URL: string
    front content: html [note 1]
    back title: string
    back content: html
    back background image URL: string

[Note 1] start out with text to avoid security problems? Provide a WYSIWYG tiny editor?