Capstone Project

[saadat-ali-awan]

HTML/CSS & JavaScript capstone project - Conference page

Project requirements

• You should personalize the content of your page. Choose a topic that is different than the one in the original design.
• You should follow these design guidelines, including:
  • Colors.
  • Typography: font face, size, and weight.
  • Layout: composition and space between elements.
• The pages should look almost identical to the original design. Small adjustments like text or image changes are acceptable.
• You can use Bootstrap for styling if you want to.
• You should build only these 2 pages:
  • The home page.
  • The about page.
• Each of these pages should have versions for 2 different screen sizes:
  • Mobile: up to 768px wide.
  • Desktop: 768px or wider.

Challenge breakdown

In order to tackle this challenge, you need a plan! We created high-level milestones for you. Your job is to make them more detailed.

Day 1

Milestone 0 - project setup (0.5h)

• Set up the repository and tools.

Milestone 1 - content (1h)

• Choose the topic for your website.
• Choose images, text, icons, fonts.

Milestone 2 - mobile-first (5h)

• Create the 2 pages for mobile.
• Deploy the project.

Day 2

Milestone 3 - desktop version (5h)

• Adapt the 2 pages to desktop.

Milestone 4 - interactions (1.5h)

• Implement the user interactions: link, mobile menu.
• Deploy the project.

Day 3

Milestone 5 - dynamic page (5h)

• Implement the section "Featured speakers" with dynamic HTML.
• Deploy the project and check to make sure everything works as planned.

Milestone 6 - documentation (1.5h)

• Record a video describing your project.
• Create a good README and pull request description.