Skip to content

Front-End Development

What are we trying to accomplish?

The goal of this module is to equip students with the skills and mental models required to design, build, test, and deploy modern front-end applications. Starting from foundational vanilla JavaScript development, students progressively move into React, learning how to manage state, structure components, handle side effects, and navigate complex applications using React Router. As the module advances, students adopt professional development practices including end-to-end testing and CI/CD pipelines, mirroring real-world engineering workflows. By the end of this module, students will be capable of delivering production-ready front-end applications that are maintainable, testable, and automatically deployed.

Lessons

  1. Vanilla Development
  2. React & Requests
  3. React Hooks
  4. React Components
  5. Component vs Utility Libraries
  6. Intro to React Router DOM
  7. React Router Hooks
  8. End-to-End Testing
  9. CI/CD with Github Pages

Module Topics

  • Modern JavaScript and DOM manipulation
  • Component-based architecture with React
  • State management and React Hooks
  • Controlled forms and user-driven data flow
  • Client-side routing and navigation patterns
  • Managing application state across routes
  • End-to-end testing with Cypress
  • Automated testing strategies and test environments
  • Continuous Integration with GitHub Actions
  • Continuous Deployment to GitHub Pages
  • Environment-based configuration and build pipelines
  • Production-ready front-end workflows