The Front-End Web Developer Bootcamp: HTML, CSS, JS & React

Learn the structure of an HTML5 file, including doctype, html, head and body sections. Explore meta tags, charset UTF-8, viewport settings, and the roles of title and body content.

Learn how to structure files by creating a root folder and placing the HTML file inside it, ensuring the browser can interpret the file type.

Master heading tags from h1 to h6 in a basic HTML5 page, and preview how they render in the browser using VS Code.

Explore html5 quotation and citation tags, including b and strong for bold, i and em for italic, mark, small, del, ins, u, sub, and sup, with live examples in vscode.

Learn how HTML comment tags hide text from the page, preventing execution and storing notes for later, with practical examples in vscode and a browser demonstration.

Explore how HTML5 attributes provide information about elements, set properties like width, height, and color, drive forms with labels, fieldsets, buttons, and inline CSS, including id and class distinctions.

Learn how anchor tags create hyperlinks, use the href attribute to link to other pages, and open links in a new tab with the target attribute.

Explore break tags that convert a line into two or more lines using opening and closing tags. See browser results and practice inserting breaks at chosen points in VS Code.

Learn to build html tables using table, tr, th, and td tags, add borders, set width, center content, and customize background and font colors.

Learn to create unordered and ordered lists with ul, ol, and li, using bullets or numbering, and apply attributes for numbers, alphabets, capitals, and roman numerals.

Explore how to embed video with the HTML video tag, configure width, height, and controls, specify sources, and handle browser compatibility and formats.

Learn how to upload audio on a website using the audio tag, with source elements and controls, and understand ogg’s lack of Safari support through a practical VS Code walkthrough.

Learn how to build HTML forms using form tags, input types (text, radio, checkbox, submit), and labels, with a walk-through of creating inputs and line breaks using break tags.

Explore input types in forms, including text, password, email, date, time, color, file, url, radio and checkbox, and learn labeling and form submission basics for better user input.

Explore how input attributes like readonly, size, and disabled control form fields, showing how readonly lets users read content, size adjusts width, and disabled disables input.

Explore how the required attribute on input fields enforces form submission by preventing empty values. See how username, password, and email illustrate blank fields blocking submission.

Master the basics and advanced HTML tags to build the skeleton of a website, while CSS enhances the design with styling. Apply these skills as you build future projects.

Explore CSS3 basics, mastering Cascading Style Sheets to design and style HTML elements, manage layouts across pages with external style sheets and learn how the latest version adds properties.

Learn how CSS3 syntax uses selectors, properties, and values to style HTML elements. See an example with h1, color blue, and font-size 20px, and understand declarations separated by semicolons.

Learn how to style borders in CSS by using the border shorthand to set width, style, and color, including side borders like border-left, with practical, reset-focused examples.

Explore how height and width define element sizes using min and max height and width to enable responsive layouts, prevent overflow, and reduce reliance on media queries.

Explore how margins and padding create outside and inside space around elements, using top, right, bottom, and left properties and shorthand techniques for precise layout.

Learn how to adjust text spacing in css using text indent, text spacing, word spacing, and letter spacing, with practical examples applying to paragraphs and headings.

Learn to use the CSS font-family property by importing Google fonts, downloading fonts, or using browser defaults, and apply fonts to elements with the universal selector and font-face.