The CodeCraft: Intro to Web Development with HTML, CSS & JS course provides participants with a comprehensive introduction to building websites using HTML, CSS and JavaScript. Over two days, participants will learn the fundamentals of web development, including HTML structure, CSS styling, and JavaScript interactivity. Through a combination of lectures and hands-on workshops, participants will gain practical skills in creating basic web pages and adding interactivity to enhance user experience.
OBJECTIVES
- Understand the basic structure and components of web development, including HTML, CSS and JavaScript.
- Learn how to create well-structured HTML documents and apply CSS styles to enhance the visual presentation of web content.
- Gain proficiency in JavaScript syntax, including variables, data types, control structures, and functions.
- Develop skills in manipulating the Document Object Model (DOM) to dynamically update web page content and respond to user interactions.
- Integrate HTML, CSS and JavaScript to create interactive web pages with dynamic functionality.
WHO SHOULD ATTEND?
- Individuals who are new to web development and want to learn the fundamentals of building websites.
- Beginners who have some basic knowledge of HTML, CSS or JavaScript but want to deepen their understanding and practical skills.
- Professionals in non-technical roles who want to gain a basic understanding of web development concepts for career advancement or personal interest.
- Students and aspiring developers who are considering a career in web development and want to start with foundational knowledge.
PREREQUISITES
- No prior experience in web development is required. This course is suitable for absolute beginners.
- Basic computer literacy and familiarity with using a web browser are recommended.
- Participants should come with a willingness to learn and engage in hands-on activities to reinforce their understanding of web development concepts.
ALL PARTICIPANTS WILL RECEIVE
- Training manuals/documentation.
- Certification upon completion of the CodeCraft: Intro to Web Development with HTML, CSS & JS course.
- Excellent care and attention from instructors and staff.
- Unlimited attendance to the CodeCraft: Intro to Web Development with HTML, CSS & JS (limited to 5 repeat attendees per training session; if you wish to attend the workshop again, please contact our Facebook Page, Line, Email, or other channels to reserve your seat).
- If you are unable to attend the training session this time, you can reschedule your participation according to the training schedule.
OUTLINE
- Introduction to Web Development
- Overview of HTML, CSS and JavaScript.
- Importance of each in web development.
- HTML Essentials
- Structure of an HTML document.
- HTML tags and elements.
- Basic HTML tags: <html>, <head>, <title>, <body>, <h1>-<h6>, <p>, <a>, <img>, etc.
- Semantic HTML elements: <header>, <nav>, <main>, <section>, <article>, <footer>.
- CSS Basics
- Introduction to CSS.
- CSS syntax: selectors, properties, values.
- Different ways to apply CSS: inline, internal, external.
- Basic CSS properties: color, font, margin, padding, etc.
- Hands-on HTML
- Creating a basic HTML document.
- Structuring content using HTML tags.
- Building a simple webpage with text and images.
- Styling with CSS
- Applying CSS styles to HTML elements.
- Experimenting with basic CSS properties to change the appearance of elements.
- Creating a styled webpage.
- Adding Interactivity with JavaScript
- Introduction to JavaScript
- What is JavaScript?
- JavaScript’s role in web development.
- Basic JavaScript syntax: variables, data types, operators, control structures.
- DOM Manipulation
- Understanding the Document Object Model (DOM).
- Accessing and modifying HTML elements with JavaScript.
- Event handling: responding to user actions.
- Introduction to Functions
- Declaring and calling functions.
- Parameters and return values.
- Function expressions vs. function declarations.
- Interactive Web Pages with JavaScript
- Adding JavaScript to manipulate HTML elements dynamically.
- Creating interactive features such as buttons, forms, and simple animations.
- Putting It All Together
- Integrating HTML, CSS and JavaScript to create a fully functional web page.
- Refining the webpage design and functionality.
- Project Work and Q&A
- Participants work on a small project applying what they’ve learned.
- Instructor provides guidance and assistance as needed.
- Q&A session to address any remaining questions or concerns
