CSE104 Project
Objective
Develop a dynamic, interactive, standard compliant, website using client based programming (html, css, js).Required points
- General structure defined clearly in valid current HTML.
- General design/appearance defined in valid CSS.
- Interaction with the user, based on JavaScript
Groups
- You may develop your project alone or by pair.
Possible topics
You can choose your own topic of project. Check with a teacher that your topic is valid.- Video game is OK
- Website of an imaginary company is OK
- General user service is OK
If you lack inspiration, here is two possible topic of project
Online Computational Sheet
Inspired from Jupyter spreadsheet type, you develop an online application in which the user can enter mathematical command as a text (following JavaScript syntax), and the answer is displayed automatically.
- As a basic step, you should at least be able to handle simple numerical computations.
- In a more advance setup, keywords such as solve, plot can be parsed to handle more complex actions and display (equation solving, graph plots, etc).
Basic video games
A second possible topic is to develop a set of basic video games where the interaction with the user are programmed in JavaScript.
In a first step, you may start with very simple game such as tic-tac-toe. Once achieved, you may develop other games associated to more technical challenges.
Methodology
Decomposing into sub-steps
Decompose your project in a series of steps/check-points.
- Make sure the first check-point providing a basic usable website is easily and quickly do-able.
- Set up the more challenging/explorative point in the latests steps.
In particular, make sure you don't spend any class without having a working website, even if it doesn't have all the expected functionalities (don't stay for a long time developing code without testing your steps, test your code along .
Merge your code often in pair
Make sure than when working by pair, you share and often merge your code.
- Don't spend more than one class without merging your code.
- Versioning tools such as github may help you sharing and merging regularily your code.
Assessment
- HTML should be clear, lisible, valid, highlighting the semantic organization.
- You need to show that you designed your website as you wanted using CSS
- It is not an art-contest project. You are not graded on the "beauty" of the result, but on your CSS technical solution to achieve your goal.
- JavaScript code should
- Be clear and easy to read.
- Follow the current good practice.
- Allow to handle user events.
- Responsive website is a plus.
- Accessibility (usable website without images, js) is a plus.
Note
- You can use (at your own "risk" = no class on the topic)
- External library/framework. You need to explain clearly what you have coded, and what you didn't.
- Server based programming if you know some.
- External API if available.
Things to drop
- All your website sources.
- A short 1-3 pages report explaining your approach.