Migrate basic examples to be JS based

.cursor/rules/pnpm.mdc

@@ -17,6 +17,8 @@ This monorepo uses **pnpm** as the package manager.
 - Never use `npm` or `yarn` commands
 - The project uses `pnpm@10.20.0` (specified in `packageManager` field)
 
+The only exception to this rule are the examples in the `examples/` folder ,which are supposed to be standalone and run on their own, regardless of monorepo setup.
+
 ## Common Commands
 
 ```bash

apps/playgrounds/node/index.js

@@ -0,0 +1,28 @@
+import arkenv, { type } from "arkenv";
+
+const Env = type({
+	HOST: "string.host",
+	PORT: "number.port",
+	NODE_ENV: "'development' | 'production' | 'test' = 'development'",
+	ALLOWED_ORIGINS: type("string[]").default(() => []),
+	DEBUG: "boolean = true",
+});
+
+const env = arkenv(Env, process.env);
+
+// Automatically validate and parse process.env
+// Values are validated and parsed at runtime!
+const host = env.HOST;
+const port = env.PORT;
+const nodeEnv = env.NODE_ENV;
+const allowedOrigins = env.ALLOWED_ORIGINS;
+const debug = env.DEBUG;
+console.log({
+	host,
+	port,
+	nodeEnv,
+	allowedOrigins,
+	debug,
+});
+
+export default env;

arkenv.code-workspace

@@ -84,13 +84,17 @@
 			"path": "examples/basic",
 			"name": "  basic"
 		},
+		{
+			"path": "examples/basic-js",
+			"name": "  basic-js"
+		},
 		{
 			"path": "examples/with-bun",
 			"name": "  with-bun"
 		},
 		{
-			"path": "examples/with-vite-react-ts",
-			"name": "  with-vite-react-ts"
+			"path": "examples/with-vite-react",
+			"name": "  with-vite-react"
 		}
 	]
 }

examples/README.md

@@ -2,13 +2,17 @@
 
 This directory contains a collection of example projects that demonstrate various use cases and features of ArkEnv. Each example is a standalone project that can be run independently.
 
+> [!NOTE]
+> The examples listed below are written in TypeScript out of convention.
+> ArkEnv does _not_ require TypeScript. If you prefer plain JavaScript, see [basic-js](https://github.com/yamcodes/arkenv/tree/main/examples/basic-js) for a basic example.
+
 ## Examples
 
 | Name                                                                                             | Description                                                                                              |
 | ------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------- |
 | [`basic`](https://github.com/yamcodes/arkenv/tree/main/examples/basic)                           | Minimal example of *using ArkEnv in a [Node.js](https://nodejs.org/) app* for learning the fundamentals. |
 | [`with-bun`](https://github.com/yamcodes/arkenv/tree/main/examples/with-bun)                     | Minimal example of *using ArkEnv in a [Bun](https://bun.sh/) app*.                                       |
-| [`with-vite-react-ts`](https://github.com/yamcodes/arkenv/tree/main/examples/with-vite-react-ts) | Minimal example of *using ArkEnv in a [Vite](https://vite.dev/)+[React](https://react.dev/) app*.                                    |
+| [`with-vite-react`](https://github.com/yamcodes/arkenv/tree/main/examples/with-vite-react) | Minimal example of *using ArkEnv in a [Vite](https://vite.dev/)+[React](https://react.dev/) app*.
 
 ## Contributing an example
 

examples/basic-js/.env.example

@@ -0,0 +1,3 @@
+HOST=localhost
+PORT=3000
+NODE_ENV=development

examples/basic-js/.gitignore

@@ -0,0 +1 @@
+.env

examples/basic-js/README.md

@@ -0,0 +1,77 @@
+# ArkEnv basic example (plain JavaScript)
+
+This example shows how to use ArkEnv in a basic Node.js application.
+
+
+## What's inside?
+
+The example demonstrates:
+- Setting up environment variables with ArkEnv
+- Using default values
+- Runtime-validated environment configuration
+
+## Getting started
+
+### Prerequisites
+
+Make sure you have [Node.js](https://nodejs.org) installed. We recommend using [nvm](https://github.com/nvm-sh/nvm) to install it.
+
+### Quickstart
+
+1. #### Install dependencies
+    ```bash
+    npm install
+    ```
+
+2. #### Start the development server with hot reloading enabled
+    ```bash
+    npm run dev
+    ```
+    :white_check_mark: You will see the environment variables printed in the console.
+
+### Adding environment variables
+
+With the development server running (if it isn't - just run `npm run dev`), let's see how to add a new environment variable. For this example, we'll add a new environment variable called `MY_ENV_VAR`.
+
+1. #### Define the new environment variable in the schema as a _required_ string
+    ```javascript
+    // index.js
+    const env = arkenv({
+        // other definitions...
+        MY_ENV_VAR: "string"
+    });
+    ```
+
+2. #### Notice the development server will show an error
+    ```bash
+    ArkEnvError: Errors found while validating environment variables
+      MY_ENV_VAR must be a string (was missing)
+    ```
+    This is **good**! It means the environment variable is required and the type is enforced. Let's see how to fix it. For this example, we will define the environment variable [with a `.env` file](https://arkenv.js.org/docs/arkenv/how-to/load-environment-variables#using-env-files).
+
+3. #### Copy the `.env.example` file to `.env`
+
+    To keep the development server running, run this command in a new terminal window:
+    ```bash
+    cp .env.example .env
+    ```
+
+4. #### Add a new environment variable to the `.env` file
+    ```bash
+    echo "MY_ENV_VAR=new_value" >> .env
+    ```
+
+    Notice the development server will once again print the existing environment variables.
+
+5. #### Add the following line to the `index.js` file
+    ```javascript
+    console.log(env.MY_ENV_VAR);
+    ```
+    You will see the new environment variable printed in the console.
+
+    **Congratulations!** :tada: You've just added a new environment variable and printed its value.
+
+### Next steps
+
+- [ArkEnv docs](https://arkenv.js.org/docs/arkenv)
+- [ArkType docs](https://arktype.io/)

examples/basic-js/package.json

@@ -0,0 +1,22 @@
+{
+	"name": "arkenv-example-basic-js",
+	"private": true,
+	"type": "module",
+	"scripts": {
+		"start": "node --env-file .env index.js",
+		"dev": "node --watch --env-file .env index.js",
+		"dev:example": "node --watch --env-file .env.example index.js",
+		"clean": "rimraf dist node_modules"
+	},
+	"dependencies": {
+		"arkenv": "^0.7.5",
+		"arktype": "^2.1.22"
+	},
+	"packageManager": "npm@11.6.4",
+	"engines": {
+		"node": "24"
+	},
+	"stackblitz": {
+		"startCommand": "npm install && npm run dev:example"
+	}
+}

examples/basic-js/tsconfig.json

@@ -0,0 +1,12 @@
+{
+	"compilerOptions": {
+		"target": "ESNext",
+		"module": "ESNext",
+		"moduleResolution": "Bundler",
+		"esModuleInterop": true,
+		"strict": true,
+		"skipLibCheck": true,
+		"forceConsistentCasingInFileNames": true,
+		"outDir": "./dist"
+	}
+}