chore(devcontainer): onafy repo — automations, HMR fix, README badge (#91)

- Add allowedDevOrigins for Ona preview environments (fixes cross-origin HMR)
- Move postCreateCommand to .ona/automations.yaml (install deps task + dev server service)
- Add portsAttributes for port 3000 labeling
- Replace Quick start with Ona badge, project setup instructions, and secrets table

Co-authored-by: Ona <no-reply@ona.com>

Author: Siddhant-K-code

.devcontainer/devcontainer.json

@@ -2,8 +2,13 @@
   "name": "memo",
   "image": "mcr.microsoft.com/devcontainers/javascript-node:22",
   "features": {
-    "ghcr.io/devcontainers/features/github-cli:1": {}
+    "ghcr.io/devcontainers/features/github-cli": {}
   },
-  "postCreateCommand": "sudo apt-get update && sudo apt-get install -y --no-install-recommends curl && pnpm install && npx playwright install --with-deps chromium",
-  "forwardPorts": [3000]
+  "forwardPorts": [3000],
+  "portsAttributes": {
+    "3000": {
+      "label": "Memo App",
+      "onAutoForward": "notify"
+    }
+  }
 }

.ona/automations.yaml

@@ -0,0 +1,16 @@
+tasks:
+  installDeps:
+    name: Install dependencies
+    description: Install npm packages and Playwright browsers.
+    command: |
+      pnpm install && npx playwright install --with-deps chromium
+    triggeredBy:
+      - postDevcontainerStart
+
+services:
+  dev-server:
+    name: Dev Server
+    description: Next.js development server on port 3000.
+    commands:
+      start: pnpm dev
+      ready: curl -sf http://localhost:3000

README.md

@@ -37,14 +37,32 @@ Past streams are available on the [YouTube channel](https://www.youtube.com/@ona
 - [Vitest](https://vitest.dev/) + [Playwright](https://playwright.dev/) (testing)
 - Deployed on [Vercel](https://vercel.com/)
 
-## Quick start
+## Getting started
 
-```bash
-pnpm install
-pnpm dev
-```
+[![Run in Ona](https://ona.com/run-in-ona.svg)](https://app.ona.com/#https://github.com/gitpod-io/memo)
+
+The fastest way to run Memo is in an [Ona](https://ona.com). Click the badge above, or:
+
+1. [Add this repository to an Ona project](https://ona.com/docs/ona/create-first-project)
+2. Configure the required [**project secrets**](https://ona.com/docs/ona/projects/project-secrets#project-secrets) (see below)
+3. Open the environment — dependencies install automatically and the dev server starts on port 3000
+
+### Required project secrets
+
+Set these in your Ona project settings under **Secrets**:
+
+| Secret | Description |
+|---|---|
+| `NEXT_PUBLIC_SUPABASE_URL` | Supabase project URL |
+| `NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY` | Supabase anon/public key |
+| `SUPABASE_SECRET_KEY` | Supabase service role key |
+| `NEXT_PUBLIC_SENTRY_DSN` | Sentry DSN (optional — leave empty to disable) |
+| `SENTRY_DSN` | Sentry server-side DSN (optional) |
+| `SENTRY_AUTH_TOKEN` | Sentry auth token for source maps (optional) |
+| `SENTRY_ORG` | Sentry organization slug (optional) |
+| `SENTRY_PROJECT` | Sentry project slug (optional) |
 
-Open [http://localhost:3000](http://localhost:3000).
+Without Supabase secrets, the app starts but auth and data features won't work.
 
 ## Project links
 

next.config.ts

@@ -1,7 +1,9 @@
 import type { NextConfig } from "next";
 import { withSentryConfig } from "@sentry/nextjs";
 
-const nextConfig: NextConfig = {};
+const nextConfig: NextConfig = {
+  allowedDevOrigins: ["*.preview.devx.network", "*.preview.env.ona.dev"],
+};
 
 export default withSentryConfig(nextConfig, {
   org: process.env.SENTRY_ORG,