Build skills with a guided, interactive tutorial flow.

Each module includes a quick overview, objectives, a runnable mental model, and a short check-in. Use the search bar to filter, mark lessons complete to track progress, and copy code blocks in one click.

Start the journey

C++ Essentials

Beginner 15 min Console I/O

Outcome

Understand the structure of a minimal C++ program and the role of headers and namespaces.

1Include headers
2Define `main`
3Print to stdout

Hello World

#include <iostream>

int main() {
    std::cout << "Hello World!" << std::endl;
    return 0;
}

Quick Check

Which header enables `std::cout`?

Java Starter

Beginner 12 min JVM Basics

Outcome

Learn the Java class structure and how `main` boots a program.

1Class container
2Static main
3Console output

Hello World

public class HelloWorld {
    public static void main(String[] args) {
        System.out.println("Hello, World!");
    }
}

Quick Check

Which keyword keeps `main` callable without an object?

Pascal Foundations

Beginner 10 min Procedural Flow

Outcome

Grasp the `program`, `begin`, and `end.` structure used in classic Pascal.

1Program header
2Statements block
3Termination

Hello World

program HelloWorld;
begin
    writeln('Hello, World!');
end.

Quick Check

Which keyword starts the Pascal instruction block?

HTML5 Structure

Beginner 14 min Semantic

Outcome

Learn the semantic backbone of web pages for accessibility and SEO.

1Document outline
2Semantic tags
3Readable structure

Starter Template

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <header>...</header>
    <main>...</main>
    <footer>...</footer>
</body>
</html>

Quick Check

Which tag holds the primary page content?

CSS Layouts

Intermediate 18 min Flexbox + Grid

Outcome

Master modern layout techniques to build responsive UI quickly.

1Flex direction
2Grid areas
3Responsive rhythm

Layout Snippet

.layout {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 28px;
}

@media (max-width: 980px) {
    .layout {
        grid-template-columns: 1fr;
    }
}

Quick Check

Which property turns on CSS Grid?

Network Fundamentals

Beginner 16 min TCP/IP

Outcome

Understand how data moves from client to server using layered protocols.

1IP addressing
2Transport layers
3HTTP request flow

Request Anatomy

GET /learn HTTP/1.1
Host: example.com
User-Agent: YourBrowser
Accept: */*

Quick Check

Which protocol moves packets across networks?

Algorithm Thinking

Intermediate 20 min Big-O

Outcome

Measure performance and choose the right data structures for the job.

1Analyze time
2Choose structure
3Optimize loops

Complexity Example

for (int i = 0; i < n; i++) {
    for (int j = 0; j < n; j++) {
        sum += matrix[i][j];
    }
}
// Time: O(n^2)

Quick Check

What is the complexity of the double loop?

Excel Productivity

Beginner 12 min Formulas

Outcome

Use essential formulas to automate calculations and reporting.

1SUM
2IF logic
3Lookup basics

Starter Formula

=IF(B2 >= 70, "Pass", "Review")

Quick Check

Which formula adds a range of cells?

JavaScript Interaction

Intermediate 20 min DOM + Events

Outcome

Attach event listeners and update the DOM for rich interactivity.

1Select elements
2Listen to events
3Change UI state

Click Handler

const button = document.querySelector(".cta");

button.addEventListener("click", () => {
    button.textContent = "Done!";
});

Quick Check

Which method attaches an event listener?