Thank you for sending your enquiry! One of our team members will contact you shortly.
Thank you for sending your booking! One of our team members will contact you shortly.
Course Outline
The Structure and Style (HTML & CSS)
Introduction & Web Technologies
- How the Web Works: A simple explanation of the Client-Server model.
- The Browser as a Computer: Understanding how code is interpreted.
- HTML: The framework of the web, covering structure, hierarchy, and semantic tags.
- CSS: The styling of the web, including colors, fonts, and the Box Model.
- Lab 1: Setting up the development environment and creating a static "About Me" profile page.
Working with HTML & CSS (Deep Dive)
- HTML: Working with lists, links, images, and forms to enable user interaction.
- CSS: Styling text and backgrounds, with an introduction to Flexbox and Grid for modern layouts.
- Responsive Design: Ensuring the website functions well on both mobile devices and desktops.
- Lab 2: Enhancing the static page with professional styling and mobile responsiveness.
Working with the DOM (Document Object Model)
- Concept: Understanding the relationship between code and the visual page.
- Selecting Elements: Techniques for targeting specific parts of a webpage.
- Manipulation: Modifying content and attributes through code.
- Lab 3: Dynamically modifying elements on the static page, such as changing titles or images.
The Brains (JavaScript)
Programming in JavaScript (The Basics)
- Variables & Data Types: Storing information like text, numbers, and boolean values.
- Logic: Using if/else statements to make decisions.
- Loops: Efficiently repeating actions.
- Functions: Creating reusable blocks of code, likened to a "recipe".
- Lab 4: Building a basic calculator or logic game using JavaScript.
Interactivity & Events
- Event Listeners: Responding to user actions like clicks, keystrokes, and page loads.
- Form Handling: Validating user input, such as verifying email addresses.
- DOM Manipulation: Dynamically adding or removing elements, such as creating a To-Do list.
- Lab 5: Transforming the calculator into an interactive web app with user interface feedback.
Fetching Data (APIs)
- Concept: Understanding how web applications communicate with external servers, such as retrieving weather data or stock prices.
- JSON: The standard language for data exchange.
- Async Programming: Mastering "wait, then do" logic to prevent browser freezing.
- Lab 6: Developing a feature that retrieves live data from a public API to display on the page.
The Professional Toolkit (Frameworks & Capstone)
Using Programming Frameworks
- Why use frameworks? Exploring concepts from React, Vue, or Svelte.
- Components: Building modular and reusable UI pieces.
- State Management: Tracking changing data effectively.
- The Ecosystem: Understanding packages, dependencies, and version control (Git).
- Lab 7: Refactoring a simple feature using a component-based approach.
The Capstone Project: Building a Web Application
- Requirement: Participants must create a functional web application, such as a budget tracker, product dashboard, or portfolio site.
- Planning: Defining the user story and technical scope.
- Implementation: Integrating HTML/CSS structure with JavaScript logic.
- Debugging: Reading error messages and fixing logical issues.
- Presentation: Presenting the final application to the group.
Closing Remarks & Next Steps
- Technical Vocabulary: A cheat sheet for communicating with engineers, covering terms like API, Backend, Frontend, Git, and Deployment.
- Resource Guide: Recommended places for further learning, including Documentation, StackOverflow, and MDN.
- Career Integration: How these skills apply to Product Management and Design roles.
- Q&A and Course Evaluation.
Requirements
- Fundamental computer usage skills
- No prior programming experience required
21 Hours
Testimonials (2)
I really enjoyed learning about AI attacks and the tools out there to begin practicing and actively using for security testing. I took a lot of knowledge away which I didn't have at the beginning and the course met what I hoped it would be. My favorite part shown from the training was Comet Browser and was amazed at what it could do. Definitely something will be looking into more. Overall it was a great course and enjoyed learning all OWASP GenAI Top 10.
Patrick Collins - Optum
Course - OWASP GenAI Security
That every technical lesson came with multiple practical exercises to nail down the concepts.
