Learn Mobile App Development by Creating a Food Ordering App

Master HTML basics by creating .html files, viewing them in a browser, and using VS Code with live server to render boilerplate, head, and body content.

Discover how to use VS Code as your IDE, including file explorer, extensions, and settings. Learn to navigate with shortcuts, search, the action panel, and split editors for efficient coding.

Build a functional HTML blog by coding headings, paragraphs, images, links, and a contact form, while learning HTML basics, semantic divs, and basic styling from the W3Schools resources.

Master CSS selectors, from element and class selectors to IDs, using comma separated lists and the asterisk universal selector to apply backgrounds and borders across HTML elements.

Learn to debug CSS using the browser inspector, resolve conflicting styles, and test responsive layouts with the browser's responsive design mode across devices.

Explore modern JavaScript, from vanilla to Ecmascript and TypeScript, and see how frameworks like React, Vue, and Angular shape the web. Discover Babel, npm, Webpack, and Node.js for streamlined development.

Explore JavaScript syntax, file structure, and formatting essentials—from comments and indentation to semicolon use and style guides—through practical examples in code and the browser.

Learn how to integrate JavaScript with HTML by adding script tags, manipulating the DOM with getElementById and innerHTML, and wiring modules via import and export.

Explore objects in JavaScript, defining objects with properties, accessing them via dot and bracket notation, and creating object methods that modify state, including nested objects like bottle dimensions.

Explore the document object model (dom) using querySelector and querySelectorAll to select, modify classes and attributes, and inspect styles. Create and append elements with createElement and append to the dom.

Explore JavaScript data types, including strings, numbers, booleans, objects, and arrays, and learn const versus let, type of, and common operators for comparisons and arithmetic.

Explore JavaScript arrays by creating and modifying lists with push, unshift, shift, and pop; learn length, indexing from zero, join, and find using a predicate and forEach.

Explore how functions work in JavaScript, from the function keyword and parameters to return values, calling with arguments, and using default values or arrow functions via const.

Learn how to pass parameters and return values in functions, including objects, destructuring, and string interpolation. Explore callbacks, returning functions, and level-based log formatting with info and log levels.

Explore if conditions and logical operators in JavaScript, using true/false booleans and comparisons to control flow with else, else if, and, or, including nesting examples.

Explore how to use the switch case statement in JavaScript to map vegetables to prices, with examples for tomato and broccoli, including default cases and multiple cases sharing a result.

Explore looping in JavaScript by comparing forEach, for, for-in, and for-of on an animals array, and learn how map transforms it into a new array for React rendering.

Learn how promises handle asynchronous server requests in JavaScript, using async/await, and practical examples with setTimeout to control timing, fulfillment, and resolve.

Explore the command line interface (CLI) essentials: terminal setup, navigation with cd and ls, and file operations like mkdir, touch, cp, mv, and rm.

Master Mac terminal setup with iTerm2, brew installation, and a Solarized theme, then enable Oh My Zsh and Powerlevel10k for verbose prompts.

Explore Node.js as an open-source JavaScript runtime. Install node and npm, run JavaScript in the command line interface, and create a node app with package.json and a start script.

Install and manage npm dependencies in a node app, updating package.json and package-lock.json. Use gitignore to exclude node_modules and create a readme.md with markdown, and run npm start.

Explore version control with GitHub, view repositories, readme guidance, and commit history, including diffs, branches, and master and develop workflows.

resolve git conflicts across branches with local merge and GitHub UI; learn git ignore rules to exclude node_modules and dot env from the repository.

Learn how TypeScript adds types and syntax to JavaScript, enabling explicit typing, interfaces, and type aliases. Explore arrays, objects, optional properties, unions, and typed functions to improve developer experience.

Launch a React.js project with Create React App, choosing the TypeScript template and installing node modules. Run npm start to view the app locally at localhost:3000 in VS Code.

Explore JSX in Reactjs, writing HTML inside JavaScript to build components, and learn how the virtual dom, className, and curly braces enable dynamic rendering.

Learn how to use props in React with TypeScript by typing a paragraph component via an interface, passing a mandatory message prop, and destructuring or rest-spreading other props.

Build a stateful React button with props and children, then use useState to toggle color and render changes, illustrating hooks and component-level updates.

Explore conditional rendering in React by using useState to toggle content with a button and a ternary operator in a food ordering app.

Explore how to implement a React useContext log system by building a logs provider, creating a logs context, and consuming it across components to log events.

Explore the useEffect hook in React, controlling mounting, updating, and unmounting with empty and dependency arrays, including cleanup functions and state changes.

Build a React app using Create React App and TypeScript, integrate Chakra UI, add a sidebar navigation, and manage a mock contact list with a context provider.

Learn to add navigation with React Router Dom, set up a createBrowserRouter and outlet, create a dynamic contacts route, and fetch a contact by id using context.

Add navigation features to the contact app by implementing clickable contacts with useNavigate, creating a new contact route, and building a chakra-based contact form with first name and description fields.

Add edit and delete capabilities to each contact by reusing the contact form, implementing routes for edit, wiring navigate and params, and updating the context with edit and delete operations.