This is only a list of possible types of projects. Again, my primary expectation, is that your projects demonstrate an appropriate amount of technical breadth and depth, based on what we've already covered, and some instructional aspects.
- Create a webpage that, in and of itself, provides an instructional lesson. Technically speaking, something along the lines of Wealth shown to scale is a great example of a single webpage, instructional lesson. It only has three simple (if somewhat lengthy) files, one each: html, css, and javascript.
- Adding lesson to FreeCodeCamp, exercism, or any similar open source, interactive learning environment. Please note that you only have to submit an appropriate lesson (often called a "pull request", it does not need to have been accepted by the parent group (although, ideally it will be) —it does need to be appropriate and complete for the given environment.
- Fixing one or more bugs in, or adding a feature to, FreeCodeCamp, exercism, or any similar open source, interactive learning environment. Again, it does not need to be accepted by the parent group, but it does need to appropriate and complete for the given environment.
- Create new katas, exercises, challenges, levels, etc in https://www.codewars.com/, https://www.codechef.com/practice. (in either JS or NodeJS), or one of the games listed in your last regular assignment.
- Create new challenges in https://css-challenges.com
- Completing a web-based solution to one of the original http://codekata.com/
- https://github.com/practical-tutorials/project-based-learning#javascript and https://github.com/practical-tutorials/project-based-learning#html-and-css
For each specified topic, there are 3 depth levels:
Basic - Implementing something comparable to assignments from the first half of the course. I.e. this is using the knowledge and skills that we have already covered within a project, but without really learning anything beyond what has already been covered.
Intermediate - Implementing something that builds upon the knowledge and skills covered in previous assignments. E.g. this is comparable to taking the "next" several lessons for any of the topics that we've already covered, and incorporating what you learn into your project.
Advanced - Implementing something that clearly goes beyond the knowledge and skills covered in previous assignments. E.g. this is going well beyond any of the lessons that have been covered in this course.
If you think there is a missing topic on this list —whether through oversight, categorization, or that it's just something outside of what we've covered, but which is still within the realm of web design and development— please reach out to me! As you may have noticed, there is a lot of topical overlap in web design and development.
I care significantly more that your projects demonstrate an appropriate amount of breadth and depth, based on what we've covered, than I care about holding firm to a rubric.
- Semantic HTML
- Cascading Style Sheets
- Client-side JavaScript
- API
- Node.js
- Database
- git
- a minimum of 2 different topics
- a minimum of Intermediate level for 1 of those topics
- a focus on depth, via:
- a minimum of 3 different topics
- a minimum of Intermediate level for 3 topics or Advanced level for 2 of those topics
- a focus on breadth, via:
- a minimum of 4 different topics
- a minimum of Intermediate level for 2 topics or Advanced level for 1 of those topics
| Rubric table | Basic | Intermediate | Advanced |
|---|---|---|---|
| topic 1 | |||
| topic 2 | |||
| topic 3 | |||
| topic 4 |
| Rubric table | Basic | Intermediate | Advanced |
|---|---|---|---|
| HTML | x | ||
| CSS | x | ||
| JavaScript | X | ||
| Accessibility | X |