Full-Stack Web Developer Bootcamp | Front & Back-End Mastery

Explore the HTML5 boilerplate, including doctype html, html, head, title, and body tags, and learn where CSS and JavaScript belong within the hidden tag.

Learn how the div tag structures web pages into sections, while the span tag targets inline parts for styling; practice with classes and inline CSS.

Explore how to use the HTML address tag to format and position an address on a webpage, see its formatting differences, and practice implementing it in a simple example.

Explore meta tags, page refresh, and redirection in front end web development. Learn about utf-8 charset, the header and head sections, and responsive design.

discover how to use meta tags to improve search engine optimization, define keywords, descriptions, and author, and implement viewport for responsive design in front-end web development.

Learn how to add images in HTML with the image tag, manage image sources and folders, and optimize loading and SEO with alt text and basic styling.

Learn the basics of HTML tables, including table, table row, header, and data elements, with examples of classes, IDs, borders, cellpadding, cellspacing, and basic styling.

Explore advanced HTML tables by creating table head, body, foot, and caption; center alignment and borders illustrate how a robust table renders in a full-stack web app.

Explore how HTML anchor tags create page links for a navigation bar, connecting home, media, blog, sign up, login, and contact us with href targets and optional _blank behavior.

Combine the image tag with an anchor tag to link images to pages like the contact page, add alt text, resize with width and height, and link to pdfs.

Learn to build HTML forms, including text areas, checkboxes, and radio buttons, plus a country dropdown with options; practice using names, values, and proper grouping for radios and embedding forms.

Embed videos in web pages using the video tag with mp4 and ogg sources, add controls and proper height and width for cross-browser playback.

embed youtube videos on your site with iframes using the youtube embed url, ensure proper streaming, and follow rights requirements for video usage.

Explore the basics of CSS and how styling, including color, background, and font size, shapes web pages, with hands-on inspection of elements and simple experiments.

Explore the basics of CSS, including external and inline styles, linking CSS to HTML. Learn to style with selectors, properties, and values like colors, fonts, and the universal selector.

Explore CSS comments to document styles, including single-line and multi-line forms, to help current and future developers understand and maintain the code.

Explore CSS measurement units, including pixels, percentage, and em. See how font-size and image sizes use these units and why 100% sizing matters.

Explore how to apply and pair fonts in CSS using font-family, font-style, font-variant, font-weight, and font-size, and build robust font stacks with Google Fonts for cross-platform compatibility.

Explore text decoration in CSS by adjusting letter spacing, word spacing, alignment, underline and strike styles, text transform (uppercase, capitalize, lowercase), blink effects, and text shadow with spans and classes.

Master CSS margins by applying top, right, bottom, and left values, using the shorthand margin property, and exploring auto behavior, with visual examples like borders and spacing between paragraphs.

Explore list properties in CSS, including unordered and ordered lists, text-align, float effects, and list-style-type options such as disk, circle, square, decimal, roman numerals, and lower alpha.

Learn CSS padding concepts and apply top, right, bottom, and left values to create space between content and borders, explore the box model, and see practical padding examples.

Explore css positioning by comparing relative, absolute, and fixed, showing how elements move from their normal spot, from the viewport, or stay put, with practical image examples.

Learn how z-index controls stacking order with relative positioning using layered divs, colors, and practical examples to ensure menu bars and content overlap predictably.

Learn to implement CSS gradients with linear-gradient, experiment with color transitions from yellow to blue, and control gradient directions from left to right, bottom to top, for cross-device compatibility.

Create an index.html in a frontend folder, apply boilerplate, and add meta tags for title, description, and keywords to boost SEO while planning blog, signup, login, contact, and about pages.

Create a fixed navigation bar with a logo and search bar to navigate between blog, media, sign up, login, and about pages, and structure header, nav, and content in HTML.

Master the search bar styling by applying margins, padding, borders, and hover effects, then refine colors, text, and alignment to enhance the navigation experience.

Learn to add a dropdown menu by creating an anchor and a hidden drop content div, linking to home, media, sign up, login, and about pages.

Learn to style a drop-down menu with CSS by hiding and revealing the drop content on hover, using absolute positioning, background colors, link styles, padding, and shadows.

Solve the dropdown menu challenge by preventing refresh with JavaScript void(0), adding a media dropdown for videos, audio, photos, and slides under the navigation bar.

Create the homepage header by structuring the site container into top, middle, and button sections, add a header image, and style fonts, colors, and spacing with css.

Apply CSS to style the site container, adjust widths and margins, and center content. Align text, float images, and add headings and anchors to refine the middle and services.

Build a popup contact form using divs with ids like message box and pop up contact, including name, email, and message fields and a close image with css/js.

Learn to style a popup contact form with CSS, setting width, borders, padding, inputs, and icons with background images. Align with login and signup pages; add hover effects.

Write JavaScript to power a popup contact form, showing and hiding the form, validating name, email, and message fields, and handling form submission with alerts.

Create the blog section with a header, a main area, and a sidebar using floats and responsive widths in a centered, fluid site container.

Learn to add an image with caption in a blog, using a div with image banner and banner description, apply rgba background and opacity to the caption.

Learn to add images to a blog using HTML and CSS, create a block box, and center or cover images, while styling a gradient sidebar.

Learn to add slides to a website using cycle two and jquery, with html structure, image assets, and navigation features like next, previous, auto slide, and hover pause.

Learn to add pause on hover to a slide show and implement a cyclopedia (PGA) pager using cycle two JavaScript, with CSS positioning and an active state.

Create a photo gallery on a website using lightbox, linking lightbox.css and lightbox.js, with thumbnails that open images in a lightbox and use data-lightbox for clean URLs.

Master styling a photo gallery with thumbnails, hover effects, and smooth transitions; tune z-index, apply transforms and rotation, add box shadows, and implement a lightbox with data-title labels.

Learn to add video to a website using the video element, embed videos, set width to 100%, enable controls, and style with a cover image and css for border radius.

demonstrates embedding audio on a webpage using an audio tag with an mp3 source and controls, wrapped in a styled container with an accompanying image.

Learn to build photo gallery two using HTML and CSS, creating image thumbnails, a preview pane, and interactive hover effects with a green bordered button.

Create a css stripes navigation using a stripe.png background, hover color changes, and inline list items for home, chat, email, and phone to guide user interaction.

Learn to create a sign up page with HTML and CSS, including labeled inputs for first name, last name, email, and password, using a post method and redirecting to login.html.

Explore styling a signup page with HTML and CSS, including name, email, password, and date inputs, a 50% width form, borders and border radius, hover effects, and signup link styling.

Style the contact page, add a footer, set header background and padding, center the map, refine the contact form with CSS, remove unnecessary elements, and prepare for JavaScript interactivity.