Learn the basics of HTML, CSS, JavaScript and React

Master cascading stylesheets basics: syntax, selectors, and comments, with inline, internal, and external styles, plus element, id, class, and grouping selectors and their priorities.

Master CSS basics for colors, backgrounds, and typography, including height and width, color names, hex, rgb/rgba, background shorthand, background size, and text formatting.

Explore the CSS box model, including content, padding, border, and margin, and learn how box sizing and overflow affect layout, height, and width.

Explore CSS position properties from static to sticky, showing how relative and absolute shift elements within or out of the normal flow, with fixed viewport alignment and z-index for overlaps.

Create a flex container with flex items and apply display flex to arrange items horizontally, then explore flex-direction, flex-wrap, justify-content, align-items, and flex-basis to control main and cross axes.

Learn how CSS grids provide a two-dimensional layout, define grid containers and items, set columns and rows with grid-template-columns and grid-template-rows, apply gaps, align content, and name areas for flexible layouts.

Discover advanced CSS selectors and combinators, including descendant, child, adjacent and general sibling selectors, plus pseudo-classes like hover and focus, and pseudo-elements such as ::before, ::after, and ::first-letter.

Learn to design responsive web pages that adapt across devices by using relative CSS units (em, rem, vw, vh, percent), avoiding absolute units, and applying mobile-first media queries with breakpoints.

Learn to create web animations using CSS keyframes, define animation properties like name and duration, apply timing functions and fill modes, and handle browser prefixes for older browsers.

Build a mobile-first, responsive site with a top nav bar, hero, portfolio, about, and social icons, using no frameworks and VSS Grid and Sears's Flex Box.

Orient viewers to the file structure by presenting a studios folder for project files, an assets folder for images, and an estimate file to hold the code.

Learn to scaffold a semantic html page using emmet to generate boilerplate, create a two-column landing with nav, main, portfolio, about, and contact sections, and embed images and captions.

Enhance web pages with CSS by importing Roberto Condensed and Sofia from Google fonts, applying a universal reset, using responsive flex layouts, and adding hover effects on navigation and images.

Learn to build a responsive website using media queries and flexbox to create a landing section with text and image, a fixed navigation bar, and a grid gallery.

Discover how JavaScript defines the behavior of web pages, turning static pages into dynamic, interactive experiences, and learn to add external scripts with the script tag for efficient loading.

Learn how to declare and use JavaScript variables and constants with let and const, explore naming rules, case sensitivity, and log values with console log.

Explore JavaScript variables and operators, including assignment, arithmetic (addition, modulus, exponent, increment, decrement with prefix and postfix behavior), and comparison, logical, and string operators for concatenation.

Explore JavaScript data types, including numbers with infinity and NaN, strings, booleans, null, undefined, symbols, and the object type, plus memory, operations, and type checks.

Explore JavaScript conditional statements, including if, elif, and switch, with practical examples of time-based greetings, logical operators, default cases, and strict comparison.

Discover how JavaScript arrays store multiple values, access items by zero-based indices, and apply methods like length, toString, join, pop, push, shift, and unshift.

Learn how to define and call JavaScript functions with the function keyword or arrow syntax, pass parameters, return values, and manage local scope to boost code reusability.

Learn how JavaScript objects group multiple properties using the object literal method, access properties with dot or bracket notation, and define methods using this keyword and function definitions.

Master loops in JavaScript by using for, while, and do-while loops to iterate arrays, objects, and strings, understanding initialization, condition, and increment, plus break for safety.

Explore the document object model and implement JavaScript in HTML by accessing elements with getElementById and getElementsByTagName, then handle events.

Learn how to select and update HTML content and style with JavaScript using id, class, or tag, and compare textContent and innerText.

Learn to select elements using querySelector and querySelectorAll with CSS selectors, including id, class, and tag selectors, returning a single element or a node list and demonstrating indexing and iteration.

Master dom navigation by exploring parent and child relationships, siblings, and text nodes, then create, insert before, append, remove, and replace elements to traverse and manipulate the dom.

Learn to handle DOM events with JavaScript using event listeners and the event object. Explore event types like click and key down, and read properties such as type and target.

Learn to build a responsive carousel with HTML, CSS, and JavaScript, featuring dynamic dots, prev/next controls, auto-rotate, fade animation, and a mobile-first to desktop layout at 768px.

Create a functional countdown timer using HTML, CSS, and JavaScript, structuring with a container and flex boxes for days, hours, minutes, and seconds, and updating with setInterval.

Create a color swap interface that dynamically generates color circles from a list, updates the output box on click, and manages active states with JavaScript.

Learn to build a responsive top navigation bar using HTML, CSS, and JavaScript, with a logo, menu items, and a hamburger menu that toggles in responsive mode.

Build a tech-themed landing page with a particle background using JavaScript and a responsive navigation. Learn to integrate particle.js, fonts, and a responsive menu for modern styling.

Explore ES6 arrow functions, convert traditional functions to concise arrow syntax, and apply lexical this binding to events and class methods for cleaner, predictable JavaScript.

Explore higher order functions in JavaScript by using map, filter, and reduce to transform arrays, with callbacks, indices, and accumulators demonstrated through practical examples.

Explore JavaScript destructuring for arrays and objects, extracting values, setting defaults, renaming variables, and handling nested structures, with practical use in React.

Explore JavaScript modules by learning to export functions, objects, and classes (named and default), import them in other files, and configure the browser for module usage.

Build a simple counter app in React to learn core concepts like components, props, and state, while exploring GSX, Create React App, and event-driven styling.

Build a tic tac toe game with React function components, a nine-square board, move history with time travel, winner detection, and preventing edits after moves.

Build a full-stack to-do app with React and Firebase, featuring add, complete, delete, and live search, deployed with Firebase and styled with React Bootstrap.

Learn to style react components with react bootstrap by bootstrapping the project, installing bootstrap, and building a responsive todo app layout using container, row, and columns with input groups.