For the final project, you'll be designing and building a website of your choice. This project will test your knowledge of front-end web development and ask you to apply everything you've learned in this course. The result will be a website that you can add to your portfolio. You could create: a portfolio website; a marketing website for a startup or business; or a prototype for a simple web-app. Work with your instructor and EIR's to create project goals that are realistic given the scope and timing of the class.
We recommend you take a look at the GA Gallery for examples of past student work.
-
Demonstrate an understanding of all topics covered during this course:
- Structure, design, and style your site with HTML and CSS
- Use JavaScript and jQuery to make your site interactive
- Combine technical and design skills to create a responsive website that is compatible with mobile devices
-
Apply knowledge gained during this course by building a website from scratch
-
Use your creativity - instructors will validate feasibility and manage scope
-
Demonstrate that you have taken the appropriate steps to plan and build your website by submitting all milestones by their due dates:
- Project Proposal / Wireframes
- Draft of HTML / CSS (no JS)
- First draft of JS
- Updated Rough Draft
-
Use HTML to correctly structure the DOM:
- Use HTML5 structural elements (header, footer, nav, footer)
- Demonstrate a correct use of classes and IDs
- Use classes to identify a type of element and IDs for identifying a specific unique element on the page
- Select the appropriate tags to markup content
-
Use CSS to style the page:
- Apply fonts, color and styles to elements and the page
- Demonstrate use of floats (or inline-block) and the box model
-
Use JavaScript/jQuery to make pages interactive
Your instructional team will provide feedback on how well you execute best practices. Even though it is not part of the requirements, you should keep these in mind:
-
Clean And Readable Code. The instructional team should be able to read and follow your code easily. Maintain clean and readable code including: consistent indentation, code commenting (e.g. when closing
<div>tags, demarcating sections of code, describing possibly ambiguous code choices) and use of proper and consistent naming conventions. -
Search Engine Optimization (SEO). Implement SEO best practices related to HTML markup, and content optimization.
-
Avoid deprecated tags. Uses best practices and build using only supported HTML and CSS tags.
You can host your final project on the web for free using GitHub pages. Watch this video and see this guide for more information on how to host your site on GitHub pages. If you run into any problems with GitHub pages, your instructor and TA(s) should be able to help you troubleshoot.