What curriculum is covered in Build Websites from Scratch?

Course Curriculum: Build Websites from Scratch

HTML

Set up your local development environment and begin writing well-structured content for your sites.

  • Intro to HTML
  • HTML Tags
  • Setting Up A Text Editor
  • Creating Your First Website
  • Project: Travel Blog
    • Implement an HTML page for your new blog site
  • Project: Two Sandals
    • Create an HTML page for a hip, new restaurant

CSS

Learn best practices for using CSS to style your HTML. Begin using Chrome DevTools to sandbox and debug your code.

  • CSS Setup
  • CSS Selectors
  • CSS Visual Rules
  • Chrome DevTools
  • Project: Beach Paradise
    • Create a travel site using your new-found knowledge of HTML and CSS.
  • Project: Dasmoto's Arts & Crafts
    • Create a website for a new Arts & Crafts store using HTML and CSS

Command Line + Git

Use the command line and Git to make drafts of your work. With GitHub Pages, deploy your first website to the Internet.

  • Command Line Navigation
  • Command Line Setup
  • Git Basic Workflow
  • Git and Github Setup
  • Deployment to Github Pages
  • Project: Broadway
    • Incorporate Git into your workflow and Help Broadway, a new design firm, create a landing page for their site. 
  • Project: Excursion
    • Create and deploy a landing page for a video recording app.

Display and Positioning

Learning to size and position elements with CSS. Leverage Flexbox – a powerful new CSS positioning tool.

  • CSS Box Model
  • CSS Display
  • CSS Flexbox
  • Project: My Times
    • Create a fully-realized clone of a popular newspaper site from scratch.
  • Project: The Tea Cozy
    • Create a professionally designed site for a new tea cafe from scratch.

Responsive Design and Browser Compatibility

Learn responsive techniques that make it easy to develop sites that look great on all sizes and browsers.

  • Responsive Design - Sizing Elements
  • Responsive Design - Media Queries
  • Browser Compatibility and Polyfills
  • Project: Secret Agent Supply Inc.
    • Create a fully responsive site that makes it easy to buy the secret agent supplies from any device. 
  • Project: Tortoiseshell Optics
    • Create a fully responsive site for a new glasses site, Tortoiseshell Optics

CSS Documentation and Debugging

Learn how to use documentation and other online resources to solve unfamiliar problems and debug complicated CSS.

  • MDN Documentation and Research
  • Project: Fotomatic
    • Debug a multi-page site for a new photography startup.

Design and UI Feedback

Analyze the decisions that make sites user friendly and fun to use. Learn advanced color and typographic CSS techniques. Harness the power of pseudo-classes to make your site interactive.

  • CSS Pseudo-Classes
  • CSS Animation / Transitions
  • CSS Typography
  • CSS Color
  • Design - Color Palettes

Capstone Project (Colmar Academy)

You've been hired to design and implement a completely responsive single page site. Using supplied wireframes, make key design decisions.

  • Accessibility
  • Font Awesome
  • Asset Management
  • Custom Domains

Introduction to Bootstrap, JavaScript, and jQuery

  • Introduction to Bootstrap
  • Introduction to JavaScript
  • Introduction to jQuery
  • Final project
    • Choose one of these three projects:

BWS_Projects.png



Was this article helpful?
6 out of 6 found this helpful
Have more questions? Submit one here

0 Comments

Article is closed for comments.