UI Development
Web Foundation - WF-0002 

Taste of the Web     🌐

🎯 Gain a foundational understanding of web development concepts and skills.

Learning Objectives:

1. Digital Citizenship:

   • Understand basic computer security practices.

2. Web Fundamentals:

   • Learn the building blocks of websites: HTML, CSS, and JavaScript.

   • Explore the structure, style, and behavior of web pages.

Course Content:

Module 1: Foundations of Web Development

• HTML and CSS Basics:

  • Introduction to web development

  • Understanding HTML structure

  • Styling web pages with CSS

  • Creating basic web layouts and designs

• JavaScript Fundamentals:

  • Variables, data types, and operators

  • Control flow (if/else, loops)

  • Functions

  • Arrays and objects

  • DOM manipulation

• Homework: Practical assignments.

• Projects:

  • Number Guessing Game

  • Quiz Game

  • Tic-Tac-Toe Game
    
    

Knowledge Quiz

Creator - It's time to roll up your sleeves 🥣

🎯Develop basic developer skills to build a real-world web site.

Learning Objectives:

1. Digital Citizenship:

   • Recognize and avoid cyber threats.

   • Respect intellectual property rights.

2. Web Development:

   • Learn the fundamentals of ReactJS framework.

   • Design and build interactive web pages.

Course Content:

Module 2: ReactJS Core Concepts

• Introduction to ReactJS:

  • What is ReactJS?

  • Setting up a React development environment

  • JSX syntax

  • Components and props

• State and Props:

  • Managing component state

  • Passing data between components

• Handling Events:

  • Responding to user interactions

• Lists and Keys:

  • Rendering dynamic lists of items

• Forms and Input Handling:

  • Creating and validating forms

  • Handling user input

Practical Assignments:

• • Homework: Practical assignments.

Projects:

• • Website Planning and Design

  • Website Development and Deployment

Knowledge Quiz

'Bob' the Web-builder     🛠️

🎯AI Role in Web Development. Lay a solid foundation in web development technologies to create interactive and dynamic websites. 

Learning Objectives:

1. Web Development:

   • Learn the production ReactJS topics.

   • Optimise website performance.

2. Website testing:

   • Explore Website excellence options.

   • Learn test techniques.

Course Content:

Module 3: Advanced React Topics

• React Router:

  • Creating single-page applications

  • Routing and navigation

• Redux:

  • Managing global state

  • Actions, reducers, and the store

• Hooks:

  • useState and useEffect hooks

  • Custom hooks

• Performance Optimization:

  • Memoization and useCallback

  • Virtualization

• Testing React Applications:

  • Unit testing with Jest

  • Integration testing with React Testing Library

Practical Assignments:

• Homework: Practical assignments.

Projects:

• • Optimise website performance Website.

  • To-Do List app.

Knowledge Quiz