diff --git a/chat.json b/chat.json new file mode 100644 index 0000000..5c68ef7 --- /dev/null +++ b/chat.json @@ -0,0 +1,268 @@ +{ + "requesterUsername": "Eric-Zhang-Developer", + "requesterAvatarIconUri": { + "$mid": 1, + "path": "/u/57819328", + "scheme": "https", + "authority": "avatars.githubusercontent.com", + "query": "v=4" + }, + "responderUsername": "GitHub Copilot", + "responderAvatarIconUri": { + "id": "copilot" + }, + "initialLocation": "panel", + "requests": [ + { + "requestId": "request_4ef670fb-b23b-4cf5-826e-43512b170b89", + "message": { + "parts": [ + { + "range": { + "start": 0, + "endExclusive": 97 + }, + "editorRange": { + "startLineNumber": 1, + "startColumn": 1, + "endLineNumber": 1, + "endColumn": 98 + }, + "text": "Tell me about this repo. What is the structure and purpose, main things to get familiar with here", + "kind": "text" + } + ], + "text": "Tell me about this repo. What is the structure and purpose, main things to get familiar with here" + }, + "variableData": { + "variables": [] + }, + "response": [ + { + "value": " Based on the path `/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project`, this appears to be a University of Florida Introduction to Software Engineering mini-project.\n\nTo give you a precise overview, I need to know what files are in your workspace. Could you share the repository structure? You can run this in your terminal:\n\n```bash\nls -la\n```\n\nOr in VS Code, you can view the Explorer pane to see the file tree.\n\n**Typical Intro SWE mini-project structures often include:**\n\n- ", + "supportThemeIcons": false, + "supportHtml": false, + "baseUri": { + "$mid": 1, + "path": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/", + "scheme": "file" + } + }, + { + "kind": "inlineReference", + "inlineReference": { + "$mid": 1, + "fsPath": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/README.md", + "external": "file:///Users/ericzhang/VSCODE%20Proejcts/UF%20Classes/Intro%20SWE/mini-project/README.md", + "path": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/README.md", + "scheme": "file" + } + }, + { + "value": " - Project description, requirements, and setup instructions\n- ", + "supportThemeIcons": false, + "supportHtml": false, + "baseUri": { + "$mid": 1, + "path": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/", + "scheme": "file" + } + }, + { + "kind": "inlineReference", + "inlineReference": { + "$mid": 1, + "fsPath": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/src/", + "external": "file:///Users/ericzhang/VSCODE%20Proejcts/UF%20Classes/Intro%20SWE/mini-project/src/", + "path": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/src/", + "scheme": "file" + } + }, + { + "value": " or `lib/` - Source code directory\n- `test/` - Test files (unit tests, integration tests)\n- `docs/` - Documentation or design documents\n- `requirements.txt` or ", + "supportThemeIcons": false, + "supportHtml": false, + "baseUri": { + "$mid": 1, + "path": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/", + "scheme": "file" + } + }, + { + "kind": "inlineReference", + "inlineReference": { + "$mid": 1, + "fsPath": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/package.json", + "external": "file:///Users/ericzhang/VSCODE%20Proejcts/UF%20Classes/Intro%20SWE/mini-project/package.json", + "path": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/package.json", + "scheme": "file" + } + }, + { + "value": " - Dependency management\n- Configuration files (", + "supportThemeIcons": false, + "supportHtml": false, + "baseUri": { + "$mid": 1, + "path": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/", + "scheme": "file" + } + }, + { + "kind": "inlineReference", + "inlineReference": { + "$mid": 1, + "fsPath": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/.gitignore", + "external": "file:///Users/ericzhang/VSCODE%20Proejcts/UF%20Classes/Intro%20SWE/mini-project/.gitignore", + "path": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/.gitignore", + "scheme": "file" + } + }, + { + "value": ", etc.)\n\n**Key things to get familiar with:**\n\n1. **Project Requirements** - Check README for functional and non-functional requirements\n2. **Tech Stack** - Identify the programming language and frameworks used\n3. **Testing Approach** - Look for existing tests to understand expected behavior\n4. **Code Organization** - Understand the module/package structure\n5. **Submission Guidelines** - Note any specific formatting, documentation, or deployment requirements\n\nPlease share the file structure, and I can provide a detailed analysis of this specific project.", + "supportThemeIcons": false, + "supportHtml": false, + "baseUri": { + "$mid": 1, + "path": "/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project/", + "scheme": "file" + } + } + ], + "responseId": "response_c2ab537f-1834-4ca9-bec2-460957cab49f", + "result": { + "timings": { + "firstProgress": 4037, + "totalElapsed": 8187 + }, + "metadata": { + "codeBlocks": [ + { + "code": "ls -la\n", + "language": "bash", + "markdownBeforeBlock": " Based on the path `/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project`, this appears to be a University of Florida Introduction to Software Engineering mini-project.\n\nTo give you a precise overview, I need to know what files are in your workspace. Could you share the repository structure? You can run this in your terminal:\n\n" + } + ], + "toolCallRounds": [ + { + "response": " Based on the path `/Users/ericzhang/VSCODE Proejcts/UF Classes/Intro SWE/mini-project`, this appears to be a University of Florida Introduction to Software Engineering mini-project.\n\nTo give you a precise overview, I need to know what files are in your workspace. Could you share the repository structure? You can run this in your terminal:\n\n```bash\nls -la\n```\n\nOr in VS Code, you can view the Explorer pane to see the file tree.\n\n**Typical Intro SWE mini-project structures often include:**\n\n- `README.md` - Project description, requirements, and setup instructions\n- `src/` or `lib/` - Source code directory\n- `test/` - Test files (unit tests, integration tests)\n- `docs/` - Documentation or design documents\n- `requirements.txt` or `package.json` - Dependency management\n- Configuration files (`.gitignore`, etc.)\n\n**Key things to get familiar with:**\n\n1. **Project Requirements** - Check README for functional and non-functional requirements\n2. **Tech Stack** - Identify the programming language and frameworks used\n3. **Testing Approach** - Look for existing tests to understand expected behavior\n4. **Code Organization** - Understand the module/package structure\n5. **Submission Guidelines** - Note any specific formatting, documentation, or deployment requirements\n\nPlease share the file structure, and I can provide a detailed analysis of this specific project.", + "toolCalls": [], + "toolInputRetry": 0, + "id": "4e11fa92-a586-4bf2-a804-653c3cc494c3" + } + ], + "modelMessageId": "5658b747-fdce-403b-9807-b5147724b3cb", + "responseId": "1a5abf62-e0ca-4e49-987a-b4ce830f09e8", + "sessionId": "ce1bd31c-6b0e-481b-bbab-b1bc8d6ce217", + "agentId": "github.copilot.default" + }, + "details": "MoonshotAI: Kimi K2 Thinking • 0x" + }, + "followups": [], + "isCanceled": false, + "agent": { + "extensionId": { + "value": "GitHub.copilot-chat", + "_lower": "github.copilot-chat" + }, + "publisherDisplayName": "GitHub", + "extensionPublisherId": "GitHub", + "extensionDisplayName": "GitHub Copilot Chat", + "id": "github.copilot.default", + "description": "Ask or edit in context", + "metadata": { + "themeIcon": { + "id": "copilot" + }, + "hasFollowups": false, + "helpTextPrefix": "You can ask me general programming questions, or chat with the following participants which have specialized expertise and can perform actions:", + "helpTextVariablesPrefix": "You can also help me understand your question by using the following variables to give me extra context:", + "helpTextPostfix": { + "value": "To have a great conversation, ask me questions as if I was a real programmer:\n\n* **Show me the code** you want to talk about by having the files open and selecting the most important lines.\n* **Make refinements** by asking me follow-up questions, adding clarifications, providing errors, etc.\n* **Review my suggested code** and tell me about issues or improvements, so I can iterate on it.\n\nYou can also ask me questions about your editor selection by [starting an inline chat session](command:inlineChat.start).\n\nLearn more about [GitHub Copilot](https://docs.github.com/copilot/using-github-copilot/getting-started-with-github-copilot?tool=vscode&utm_source=editor&utm_medium=chat-panel&utm_campaign=2024q3-em-MSFT-getstarted) in [Visual Studio Code](https://code.visualstudio.com/docs/copilot/overview). Or explore the [Copilot walkthrough](command:github.copilot.open.walkthrough).", + "isTrusted": { + "enabledCommands": [ + "inlineChat.start", + "github.copilot.open.walkthrough" + ] + }, + "supportThemeIcons": false, + "supportHtml": false, + "uris": { + "command:inlineChat.start": { + "$mid": 1, + "path": "inlineChat.start", + "scheme": "command" + }, + "https://docs.github.com/copilot/using-github-copilot/getting-started-with-github-copilot?tool=vscode&utm_source=editor&utm_medium=chat-panel&utm_campaign=2024q3-em-MSFT-getstarted": { + "$mid": 1, + "path": "/copilot/using-github-copilot/getting-started-with-github-copilot", + "scheme": "https", + "authority": "docs.github.com", + "query": "tool=vscode&utm_source=editor&utm_medium=chat-panel&utm_campaign=2024q3-em-MSFT-getstarted" + }, + "https://code.visualstudio.com/docs/copilot/overview": { + "$mid": 1, + "path": "/docs/copilot/overview", + "scheme": "https", + "authority": "code.visualstudio.com" + }, + "command:github.copilot.open.walkthrough": { + "$mid": 1, + "path": "github.copilot.open.walkthrough", + "scheme": "command" + } + } + }, + "supportIssueReporting": false, + "requester": { + "name": "Eric-Zhang-Developer", + "icon": { + "$mid": 1, + "path": "/u/57819328", + "scheme": "https", + "authority": "avatars.githubusercontent.com", + "query": "v=4" + } + } + }, + "name": "GitHubCopilot", + "fullName": "GitHub Copilot", + "isDefault": true, + "locations": [ + "panel" + ], + "modes": [ + "ask" + ], + "slashCommands": [], + "disambiguation": [ + { + "category": "generate_code_sample", + "description": "The user wants to generate code snippets without referencing the contents of the current workspace. This category does not include generating entire projects.", + "examples": [ + "Write an example of computing a SHA256 hash." + ] + }, + { + "category": "add_feature_to_file", + "description": "The user wants to change code in a file that is provided in their request, without referencing the contents of the current workspace. This category does not include generating entire projects.", + "examples": [ + "Add a refresh button to the table widget." + ] + }, + { + "category": "question_about_specific_files", + "description": "The user has a question about a specific file or code snippet that they have provided as part of their query, and the question does not require additional workspace context to answer.", + "examples": [ + "What does this file do?" + ] + } + ] + }, + "contentReferences": [], + "codeCitations": [], + "timestamp": 1762967694156, + "modelId": "openrouter/moonshotai/kimi-k2-thinking" + } + ] +} \ No newline at end of file diff --git a/src/app/page.tsx b/src/app/page.tsx index 3aa3210..47ec7fe 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -27,7 +27,7 @@ export default function LandingPage() { {/*all dark grey logo*/} -
+
CodeQuest Logo ({ default: () =>
Back to Dashboard
, })); +// Mock next/font/google +vi.mock("next/font/google", () => ({ + Cinzel: () => ({ + className: "mocked-cinzel-font", + }), +})); + // Mock react-youtube vi.mock("react-youtube", () => ({ default: ({ videoId }: { videoId: string }) => ( diff --git a/src/app/tutorial-hello-world/page.tsx b/src/app/tutorial-hello-world/page.tsx index d0675c5..a097547 100644 --- a/src/app/tutorial-hello-world/page.tsx +++ b/src/app/tutorial-hello-world/page.tsx @@ -2,102 +2,139 @@ import BackToDashBoardLink from "@/components/back-to-dashboard-link"; import YouTube from "react-youtube"; +import { Cinzel } from 'next/font/google'; + +const cinzel = Cinzel({ + subsets: ["latin"], + weight: ["400", "700"], +}); + +// body text (Times New Roman= more readable) +const bodyFontClass = "font-serif text-amber-950"; +// titles (Cinzel font) +const cinzelTitleClass = cinzel.className; export default function TutorialHelloWorld() { return ( -
- + // Background of scroll +
+
+ +
-
- {/* Quest Title */} -

- Quest: The Oracle's First Greeting - Whispering "Hello World" + {/* "scroll"*/} +
+ + {/* title*/} +

+ Quest: The Oracle's First Greeting

- {/* Flavor Text*/} -

+ +

Welcome, brave coder! Your journey into the mystical lands of programming begins now. Before you can conjure complex spells or build mighty digital fortresses, every adventurer must learn the first incantation, the universal greeting recognized across all realms:{" "} - "Hello World". This + "Hello World". This simple phrase is your key to unlocking the power of code.

-

+

This quest will guide you through understanding and wielding this fundamental magic.

-
- {/* Section 1 */} -
-

+
+ + {/* section*/} +
+

What is this "Hello World" Sorcery?

-

+

In the ancient scrolls of programming, "Hello World" is the traditional first spell learned. What does it do? It simply commands the machine - your loyal golem - to display the message{" "} - + "Hello World!" {" "} on the screen.

-

+

Think of it like teaching a parrot its first words. You're not asking it to recite poetry yet, just to say "Hello!" It's the basic proof that you can communicate your intentions to the machine and make it respond.

-
- {/* Section 2 */} -
-

Why This First Greeting Matters

-

Why start with something so simple?

-
    +
    + + {/* section */} +
    +

    + Why This First Greeting Matters +

    +

    Why start with something so simple?

    +
    • - It's Tradition: Like a knight + It's Tradition: Like a knight receiving their first sword, programmers worldwide start here. It connects you to generations of coders before you!
    • - It's a Test: Successfully making the + It's a Test: Successfully making the machine say "Hello World" proves your basic setup is working. Your coding environment, the language you're using - they're all aligned and ready for more complex commands. It's like checking if your magic wand sparks before trying to levitate a mountain.
    • - It's Confidence: Seeing your very + It's Confidence: Seeing your very first command come to life, even a simple one, is a powerful boost! It's the first step on your epic journey.
    -
    - {/* Section 3 */} -
    -

    + +
    + + {/* section*/} +
    +

    Visualizing the Incantation (Conceptual Example)

    -

    +

    Imagine you have a magical scroll (your program). To perform the "Hello World" greeting, you'd write an instruction similar to this:

    -
    +          
                 {`// Command the Oracle (or Screen) to speak:\nDisplay: "Hello World!"`}
               
    -

    +

    Different programming languages (spellbooks) have slightly different words for the 'Display' command (like{" "} - print,{" "} - console.log,{" "} - echo), but the core + print,{" "} + console.log,{" "} + echo), but the core idea is the same: tell the machine to show those exact words.

    -
    + +

); -} +} \ No newline at end of file