Difference between revisions of "Module 7"
From CSE330 Wiki
Jump to navigationJump to search| (20 intermediate revisions by 5 users not shown) | |||
| Line 1: | Line 1: | ||
__NOTOC__ | __NOTOC__ | ||
| − | + | The goal of the creative project is for you to learn a new framework or language that you may be interested in. This is a good opportunity to get a head start on learning the frameworks/languages your employer/potential employer uses. | |
| + | You’re free to choose which frameworks/languages you’ll use, and you’ll earn more points for learning more or harder frameworks, but '''you’re required to learn at least one new framework/technology.''' | ||
| − | + | '''As an example''': | |
| − | |||
| − | |||
| − | |||
| − | + | You cannot use the combination of Plain HTML/JavaScript (frontend), PHP (backend), and MySQL (Database) because we've covered those extensively in class. | |
| − | |||
| − | + | You could, however, use React.JS (frontend), PHP, and MySQL, because your React front end would be new. | |
| − | === | + | == Creating Your Rubric == |
| − | |||
| − | + | Before creating a rubric, you should come up with an idea for a site you want to build. From there, check [https://classes.engineering.wustl.edu/cse330/index.php?title=Web_Frameworks here] for guidance on which frameworks/languages to learn for your project and for links on how to get started with each. | |
| − | + | As a general structure, your project will consist of: | |
| + | *Front-end | ||
| + | *Back-end | ||
| + | *Database | ||
| + | *Styling | ||
| + | *Best practices | ||
| + | (Though note that using all may not be necessary for your project! Reallocate as you need) | ||
| − | + | ==== General Rubric Guidelines ==== | |
| + | Your rubric will add up to '''100 points''' (including the 5 points earned for submitting your rubric on time). For each component of your stack, you can allocate the following numbers of points: | ||
| + | *5 points for creating a rubric and uploading it to Github on time (yes, we will be checking your commit timestamps!). Please make sure you check your rubric out with a TA, or else it would not be considered submitted. | ||
| + | *[10 - 40] points: Learning and implementing new framework(s). | ||
| + | *Functionality | ||
| + | **Think about what's happening in your front end, backend, and database that creates functionality. See example rubric. | ||
| + | *5 points: Best Practices | ||
| + | **Code well formatted | ||
| + | **HTML output passes the validator | ||
| + | *[0 - 20] points: Creative Portion | ||
| + | *[0 - 5] points: Styling. "Looks really cool" or "Used Bootstrap" would '''not''' earn any points. Learning and implementing SCSS/SASS, animations, or making your page responsive/mobile-friendly would. | ||
| − | + | ''Note that exceptions can be made to these guidelines, but make sure to get approval from a TA.'' | |
| − | + | ===== Points you can allocate for frameworks ===== | |
| + | Because some stacks have a higher learning curve, more points will be earned for using them. Use the following as a guide: | ||
| + | *React, Vue, Angular, and other frontend frameworks : 10 | ||
| + | *Express (Node.js framework), Laravel, Bottle, Flask, other back-end micro frameworks: 10 | ||
| + | *Full stack frameworks like Django (python): 20 | ||
| + | *Learning a new database system: | ||
| + | **Mongo DB: 10 | ||
| + | **Firebase: 5 (lower learning curve) | ||
| + | **Other SQL Databases (Postgres, MariaDB): 5 | ||
| − | + | == Example Rubric == | |
| + | Say your project idea is to re-create Bitly (the URL shortener), where shortened URLs expire after 1 week, but users can purchase the shortened URL (using stripe) for it to work forever. You decide you want to use Vue for your frontend, Laravel for your backend, and a MySQL database. | ||
| + | Your rubric could look like the following: | ||
| + | ======Rubric turned in on time (5 points)====== | ||
| + | Remember to get it checked out by a TA! | ||
| − | + | ======Languages/Frameworks used (20 points)====== | |
| − | + | *10 - Learned/Used Vue.js frontend | |
| − | + | *10 - Learned/Used PHP Laravel backend | |
| − | + | *0 - MySQL Database | |
| − | === | + | ======Functionality (60 points)====== |
| − | + | *5 Users can input a url and receive a shortened url that redirects to it. | |
| − | + | *10 Url redirect lasts 1 week before the shortened link doesn't work | |
| − | + | *10 Users can register, login, and logout | |
| − | + | *10 Logged in users can edit and delete their shortened URLs | |
| − | + | *15 Logged in users can purchase a shortened URL via Stripe integration | |
| − | + | *10 Database contains Users, Links, and Purchases with the necessary columns and column types to maintain the above functionality | |
| − | + | ======Best Practices (5 points)====== | |
| − | + | *3 Code is readable and well formatted | |
| − | + | *2 All pages pass the html validator | |
| − | + | ======Creative Portion (10 points)====== | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | === | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
== Grading == | == Grading == | ||
| + | '''Assignments must be committed to Github by the end of class on the due date (commit early and often). Failing to commit by the end of class on the due date will result in a 0.''' | ||
| − | + | ___________ | |
| − | + | Your project will be graded '''in person''' during the last week of classes, using the rubric you create. | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
___________ | ___________ | ||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
[[Category:Module 7]] | [[Category:Module 7]] | ||
[[Category:Modules]] | [[Category:Modules]] | ||
Latest revision as of 20:33, 20 August 2019
The goal of the creative project is for you to learn a new framework or language that you may be interested in. This is a good opportunity to get a head start on learning the frameworks/languages your employer/potential employer uses.
You’re free to choose which frameworks/languages you’ll use, and you’ll earn more points for learning more or harder frameworks, but you’re required to learn at least one new framework/technology.
As an example:
You cannot use the combination of Plain HTML/JavaScript (frontend), PHP (backend), and MySQL (Database) because we've covered those extensively in class.
You could, however, use React.JS (frontend), PHP, and MySQL, because your React front end would be new.
Creating Your Rubric
Before creating a rubric, you should come up with an idea for a site you want to build. From there, check here for guidance on which frameworks/languages to learn for your project and for links on how to get started with each.
As a general structure, your project will consist of:
- Front-end
- Back-end
- Database
- Styling
- Best practices
(Though note that using all may not be necessary for your project! Reallocate as you need)
General Rubric Guidelines
Your rubric will add up to 100 points (including the 5 points earned for submitting your rubric on time). For each component of your stack, you can allocate the following numbers of points:
- 5 points for creating a rubric and uploading it to Github on time (yes, we will be checking your commit timestamps!). Please make sure you check your rubric out with a TA, or else it would not be considered submitted.
- [10 - 40] points: Learning and implementing new framework(s).
- Functionality
- Think about what's happening in your front end, backend, and database that creates functionality. See example rubric.
- 5 points: Best Practices
- Code well formatted
- HTML output passes the validator
- [0 - 20] points: Creative Portion
- [0 - 5] points: Styling. "Looks really cool" or "Used Bootstrap" would not earn any points. Learning and implementing SCSS/SASS, animations, or making your page responsive/mobile-friendly would.
Note that exceptions can be made to these guidelines, but make sure to get approval from a TA.
Points you can allocate for frameworks
Because some stacks have a higher learning curve, more points will be earned for using them. Use the following as a guide:
- React, Vue, Angular, and other frontend frameworks : 10
- Express (Node.js framework), Laravel, Bottle, Flask, other back-end micro frameworks: 10
- Full stack frameworks like Django (python): 20
- Learning a new database system:
- Mongo DB: 10
- Firebase: 5 (lower learning curve)
- Other SQL Databases (Postgres, MariaDB): 5
Example Rubric
Say your project idea is to re-create Bitly (the URL shortener), where shortened URLs expire after 1 week, but users can purchase the shortened URL (using stripe) for it to work forever. You decide you want to use Vue for your frontend, Laravel for your backend, and a MySQL database. Your rubric could look like the following:
Rubric turned in on time (5 points)
Remember to get it checked out by a TA!
Languages/Frameworks used (20 points)
- 10 - Learned/Used Vue.js frontend
- 10 - Learned/Used PHP Laravel backend
- 0 - MySQL Database
Functionality (60 points)
- 5 Users can input a url and receive a shortened url that redirects to it.
- 10 Url redirect lasts 1 week before the shortened link doesn't work
- 10 Users can register, login, and logout
- 10 Logged in users can edit and delete their shortened URLs
- 15 Logged in users can purchase a shortened URL via Stripe integration
- 10 Database contains Users, Links, and Purchases with the necessary columns and column types to maintain the above functionality
Best Practices (5 points)
- 3 Code is readable and well formatted
- 2 All pages pass the html validator
Creative Portion (10 points)
Grading
Assignments must be committed to Github by the end of class on the due date (commit early and often). Failing to commit by the end of class on the due date will result in a 0.
___________
Your project will be graded in person during the last week of classes, using the rubric you create.
___________
