diff --git a/web/.gitignore b/web/.gitignore new file mode 100644 index 0000000..a23b084 --- /dev/null +++ b/web/.gitignore @@ -0,0 +1,29 @@ +# build output +dist/ +# generated types +.astro/ + +# dependencies +node_modules/ + +# logs +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* + + +# environment variables +.env +.env.production + +# macOS-specific files +.DS_Store + +# jetbrains setting folder +.idea/ + +bun.lockb +bun.lock +package-lock.json +.vscode/ \ No newline at end of file diff --git a/web/README.md b/web/README.md new file mode 100644 index 0000000..b2dab47 --- /dev/null +++ b/web/README.md @@ -0,0 +1,22 @@ +# Anga's Online Compiler + +A browser-based compiler for **C, C++, Python, and Java**. + +## How to use + +1. Go to the [website](https://compiler.anga.codes/) +2. Select a language. +3. Write or paste code in the editor. +4. Add stdin input (optional). +5. Run the program. +6. View stdout/stderr output from the compiler runtime. + +## Execution Constraints + +Code is executed in a controlled environment with fixed resource limits that can be changed via the UI. +- Limited CPU time (terminates after 60 seconds) +- Limited memory usage (you can use upto 128MB) + +## How does this execute the code? + +This is just the code for the frontend of the online compiler, the actual code execution is handled by the [ContainerizationAPI](https://github.com/Anga205/ContainerizationAPI) that i had made earlier, you can go to that repo to see that code, it essentially just uses unix tools to containerize your code and run it in a sandbox environment \ No newline at end of file diff --git a/web/astro.config.mts b/web/astro.config.mts new file mode 100644 index 0000000..f6600ed --- /dev/null +++ b/web/astro.config.mts @@ -0,0 +1,14 @@ +// @ts-check +import { defineConfig } from 'astro/config'; +import tailwindcss from "@tailwindcss/vite"; + +// https://astro.build/config +export default defineConfig({ + site: "https://compiler.anga.codes", + vite: { + resolve: { + tsconfigPaths: true + }, + plugins: [tailwindcss()] + } +}); diff --git a/web/netlify.toml b/web/netlify.toml new file mode 100644 index 0000000..984bce6 --- /dev/null +++ b/web/netlify.toml @@ -0,0 +1,14 @@ +[build] + command = "bun run build" + publish = "dist" + +[[redirects]] + from = "/404" + to = "/index.html" + status = 301 + force = true + +[[redirects]] + from = "/*" + to = "/index.html" + status = 200 \ No newline at end of file diff --git a/web/package.json b/web/package.json new file mode 100644 index 0000000..c869950 --- /dev/null +++ b/web/package.json @@ -0,0 +1,23 @@ +{ + "name": "online-compiler", + "type": "module", + "version": "0.0.1", + "engines": { + "node": ">=22.12.0" + }, + "scripts": { + "dev": "astro dev", + "build": "astro build", + "preview": "astro preview", + "astro": "astro" + }, + "dependencies": { + "@lucide/astro": "^1.7.0", + "@monaco-editor/loader": "^1.7.0", + "@tailwindcss/vite": "^4.2.4", + "astro": "^6.3.0", + "devicon": "^2.17.0", + "tailwindcss": "^4.2.2", + "vite": "^8.0.11" + } +} diff --git a/web/public/.well-known/llms.txt b/web/public/.well-known/llms.txt new file mode 100644 index 0000000..1007b06 --- /dev/null +++ b/web/public/.well-known/llms.txt @@ -0,0 +1,3 @@ +# Anga's Online Compiler + +Canonical: https://compiler.anga.codes/llms.txt diff --git a/web/public/anga.svg b/web/public/anga.svg new file mode 100644 index 0000000..113d87c --- /dev/null +++ b/web/public/anga.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/web/public/llms.txt b/web/public/llms.txt new file mode 100644 index 0000000..18b30c5 --- /dev/null +++ b/web/public/llms.txt @@ -0,0 +1,41 @@ +# Anga's Online Compiler + +> Browser-based online compiler for C, C++, Python, and Java with Monaco editor. + +- Site: https://compiler.anga.codes/ +- Product: Online code compiler and runtime sandbox +- Languages: C, C++, Python, Java +- Cost: Free + +## What this app does + +Anga's Online Compiler lets users write, compile, and run code directly in a browser. +It supports configurable memory and time limits, standard input, and instant stdout/stderr output. + +## Primary URL + +- https://compiler.anga.codes/ + +## Public technical details + +- Frontend framework: Astro +- Editor: Monaco Editor +- Interface sections: + - Language selector + - Code editor pane + - Output pane + - Runtime limits controls + +## Usage summary + +1. Open the homepage. +2. Select a language. +3. Write or paste source code. +4. Provide stdin if needed. +5. Run and inspect output. + +## Discovery files + +- robots.txt: https://compiler.anga.codes/robots.txt +- sitemap.xml: https://compiler.anga.codes/sitemap.xml +- llms mirror: https://compiler.anga.codes/.well-known/llms.txt diff --git a/web/public/robots.txt b/web/public/robots.txt new file mode 100644 index 0000000..83ef80b --- /dev/null +++ b/web/public/robots.txt @@ -0,0 +1,8 @@ +User-agent: * +Allow: / + +Sitemap: https://compiler.anga.codes/sitemap.xml + +# LLM discovery +Allow: /llms.txt +Allow: /.well-known/llms.txt diff --git a/web/public/sitemap.xml b/web/public/sitemap.xml new file mode 100644 index 0000000..810434d --- /dev/null +++ b/web/public/sitemap.xml @@ -0,0 +1,8 @@ + + + + https://compiler.anga.codes/ + weekly + 1.0 + + diff --git a/web/src/components/compiler-body.astro b/web/src/components/compiler-body.astro new file mode 100644 index 0000000..cffbd7d --- /dev/null +++ b/web/src/components/compiler-body.astro @@ -0,0 +1,65 @@ +--- +import LanguageSidebar from "./language-sidebar.astro"; +import EditorPane from "./editor-pane.astro"; +import OutputPane from "./output-pane.astro"; +--- + +
+
+ + +
+
+ +
+ + + +
+ +
+
+
+
+ + diff --git a/web/src/components/editor-pane.astro b/web/src/components/editor-pane.astro new file mode 100644 index 0000000..3ffcc2d --- /dev/null +++ b/web/src/components/editor-pane.astro @@ -0,0 +1,189 @@ +
+
+ + +
+ +
+
+
+
+ +
+
+ + \ No newline at end of file diff --git a/web/src/components/language-sidebar.astro b/web/src/components/language-sidebar.astro new file mode 100644 index 0000000..f67ce0a --- /dev/null +++ b/web/src/components/language-sidebar.astro @@ -0,0 +1,75 @@ +--- +import "devicon/devicon.min.css"; + +const languages = [ + { key: "python", label: "Python", iconClass: "devicon-python-plain" }, + { key: "java", label: "Java", iconClass: "devicon-java-plain" }, + { key: "c", label: "C", iconClass: "devicon-c-plain" }, + { key: "cpp", label: "C++", iconClass: "devicon-cplusplus-plain" } +]; +--- + + + + + + diff --git a/web/src/components/output-pane.astro b/web/src/components/output-pane.astro new file mode 100644 index 0000000..e8119d6 --- /dev/null +++ b/web/src/components/output-pane.astro @@ -0,0 +1,310 @@ +
+
+

stdout

+ +
+ +
+
+

time: -

+

memory: -

+
+ +
Program output will appear here.
+ + +
+
+ + diff --git a/web/src/components/topbar.astro b/web/src/components/topbar.astro new file mode 100644 index 0000000..1ea4214 --- /dev/null +++ b/web/src/components/topbar.astro @@ -0,0 +1,131 @@ +--- +import { Moon, Sun } from "@lucide/astro"; +--- +
+
+ +
+
+

Anga's

+

Online Compiler

+
+ +
+ +
+ + + +
+ +
+ +
+
+ + \ No newline at end of file diff --git a/web/src/pages/404.astro b/web/src/pages/404.astro new file mode 100644 index 0000000..63669e4 --- /dev/null +++ b/web/src/pages/404.astro @@ -0,0 +1,18 @@ +--- +--- + + + + + + + 404 | Page Not Found + + +
+

Page not found

+

The page you requested does not exist.

+

Return to the online compiler

+
+ + diff --git a/web/src/pages/index.astro b/web/src/pages/index.astro new file mode 100644 index 0000000..520abc4 --- /dev/null +++ b/web/src/pages/index.astro @@ -0,0 +1,81 @@ +--- +import "../styles/global.css"; +import Topbar from "../components/topbar.astro"; +import CompilerBody from "../components/compiler-body.astro"; + +const siteUrl = "https://compiler.anga.codes"; +const pageTitle = "Anga's Online Compiler"; +const pageDescription = "Free online compiler for C, C++, Python, and Java. Write code in Monaco editor, execute with memory and time limits, provide stdin input, and get instant output."; +const pageUrl = `${siteUrl}/`; +const previewImage = `${siteUrl}/anga.svg`; + +const softwareApplicationJsonLd = { + "@context": "https://schema.org", + "@type": "SoftwareApplication", + name: pageTitle, + applicationCategory: "DeveloperApplication", + operatingSystem: "Any", + description: pageDescription, + url: pageUrl, + image: previewImage, + author: { + "@type": "Person", + name: "Anga" + }, + offers: { + "@type": "Offer", + price: "0", + priceCurrency: "USD" + }, + featureList: [ + "Compile and run C, C++, Python, and Java code in browser", + "Monaco editor with syntax highlighting", + "Configurable memory and time limits", + "Standard input support", + "Immediate stdout and stderr output" + ] +}; + +const webSiteJsonLd = { + "@context": "https://schema.org", + "@type": "WebSite", + name: pageTitle, + url: pageUrl, + description: pageDescription, + inLanguage: "en" +}; +--- + + + + + + + + + {pageTitle} + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/web/src/styles/global.css b/web/src/styles/global.css new file mode 100644 index 0000000..8c1e284 --- /dev/null +++ b/web/src/styles/global.css @@ -0,0 +1,215 @@ +@import "tailwindcss"; + +:root { + --bg-app: #0a0a0a; + --surface-0: #111111; + --surface-1: #171717; + --surface-2: #262626; + --surface-3: #404040; + --border-ui: #3f3f46; + --text-primary: #f5f5f5; + --text-muted: #a3a3a3; + --accent-language: #d4d4d4; + --accent-language-soft: #262626; + --accent-run: #22c55e; + --accent-run-soft: #14532d; +} + +html[data-theme="light"] { + --bg-app: #fafafa; + --surface-0: #f5f5f5; + --surface-1: #e5e5e5; + --surface-2: #d4d4d4; + --surface-3: #a3a3a3; + --border-ui: #a3a3a3; + --text-primary: #171717; + --text-muted: #525252; + --accent-language: #525252; + --accent-language-soft: #d4d4d4; + --accent-run: #15803d; + --accent-run-soft: #bbf7d0; +} + +html, +body { + background-color: var(--bg-app); + color: var(--text-primary); +} + +body { + transition: background-color 150ms ease, color 150ms ease; +} + +.spin-scale-hover { + display: inline-block; + transition: transform 0.6s ease-out; +} + +.spin-scale-hover:hover { + animation: spinOnce 0.5s forwards; +} + +@keyframes spinOnce { + 0% { + transform: rotate(0deg) scale(1); + } + 100% { + transform: rotate(360deg) scale(1.2); + } +} + +@media (max-width: 900px) { + body { + height: auto !important; + min-height: 100dvh; + overflow: auto !important; + } + + #topbar { + height: auto; + min-height: 5rem; + padding: 0.5rem; + align-items: flex-start; + flex-wrap: wrap; + gap: 0.5rem; + } + + #topbar > div:first-child { + height: 3rem; + width: 3rem; + flex: 0 0 auto; + } + + #topbar > div:nth-child(2) { + height: 3rem; + margin-left: 0; + display: flex; + flex-direction: column; + justify-content: center; + } + + #topbar > div:nth-child(2) p:first-child { + font-size: 1.1rem; + line-height: 1.1; + } + + #topbar > div:nth-child(2) p:last-child { + font-size: 0.75rem; + } + + #topbar > .grow { + display: none; + } + + #topbar-controls { + order: 3; + width: 100%; + flex: 0 0 100%; + max-width: none; + min-width: 0; + height: auto; + padding: 0; + flex-wrap: wrap; + gap: 0.65rem; + align-items: flex-end; + } + + #limits-mode-wrapper { + width: 100%; + min-width: 0; + } + + #limits-mode { + height: 2.25rem; + border-radius: 0.5rem; + font-size: 0.9rem; + padding: 0 0.65rem; + } + + #custom-limits-controls { + width: 100%; + min-width: 0; + flex-direction: column; + align-items: stretch; + gap: 0.65rem; + } + + #custom-limits-controls label { + min-width: 0 !important; + } + + #theme-toggle-wrapper { + width: auto; + height: 3rem; + margin-left: auto; + } + + #theme-toggle { + width: 2.75rem; + height: 2.75rem; + } + + #compiler-body { + height: auto; + min-height: calc(100dvh - 6.5rem); + } + + .compiler-layout { + display: flex; + flex-direction: column; + } + + #language-sidebar { + width: 100%; + height: auto; + border-right: 0; + border-bottom: 1px solid var(--border-ui); + } + + #language-sidebar ul { + flex-direction: row; + justify-content: center; + gap: 0.6rem; + padding: 0.65rem; + } + + #language-sidebar .language-button { + width: 3rem; + height: 3rem; + } + + .workspace-shell { + flex-direction: column; + min-height: 0; + height: auto; + } + + #workspace-divider { + display: none; + } + + .workspace-pane, + #left-workspace, + #right-workspace { + width: 100% !important; + min-width: 0; + } + + #left-workspace { + height: 56dvh; + } + + #right-workspace { + height: 38dvh; + border-top: 1px solid var(--border-ui); + } + + [data-pane="right"] { + border-left: 0; + } + + [data-pane="left"] .tab-trigger, + [data-pane="right"] #run-code-button { + min-height: 2.25rem; + } +} \ No newline at end of file diff --git a/web/tsconfig.json b/web/tsconfig.json new file mode 100644 index 0000000..8bf91d3 --- /dev/null +++ b/web/tsconfig.json @@ -0,0 +1,5 @@ +{ + "extends": "astro/tsconfigs/strict", + "include": [".astro/types.d.ts", "**/*"], + "exclude": ["dist"] +}