Veroxid (@veroxid/core)

Lightweight, zero-dependency modern JavaScript library ready for NPM, jsDelivr CDN, unpkg, and direct browser integration.

📦 Installation via Package Managers

Install the scoped package in your modern TypeScript/JavaScript project:

# npm
npm install @veroxid/core

# pnpm
pnpm add @veroxid/core

# yarn
yarn add @veroxid/core

# bun
bun add @veroxid/core

Module Import (ESM & TypeScript)

import { createVeroxid, veroxid, type VeroxidCore } from '@veroxid/core';

// Create a configured instance
const vx = createVeroxid({
  name: 'MyApp',
  debug: true,
});

// Reactive state store
const store = vx.state({ count: 0, user: 'Bayu' });

store.subscribe('count', (newVal, oldVal) => {
  console.log(`Count changed: ${oldVal} -> ${newVal}`);
});

store.set('count', 10);

⚡ Quick Start via CDN (No Build Step Required)

1. jsDelivr (GitHub Release CDN)

<!-- Load the minified production bundle -->
<script src="https://cdn.jsdelivr.net/gh/prssbayu-oss/Veroxid@latest/dist/veroxid.min.js"></script>

<script>
  // Access global window.Veroxid
  const app = Veroxid.create({ debug: true });
  const store = app.state({ count: 0 });
  store.subscribe('count', (val) => console.log('Current count:', val));
  store.set('count', 1);
</script>

2. NPM-based CDN (jsDelivr / unpkg)

<!-- Via jsDelivr NPM -->
<script src="https://cdn.jsdelivr.net/npm/@veroxid/core/dist/veroxid.min.js"></script>

<!-- Or via unpkg -->
<script src="https://unpkg.com/@veroxid/core/dist/veroxid.min.js"></script>

3. ES Module in Modern Browsers

<script type="module">
  import { createVeroxid } from 'https://cdn.jsdelivr.net/npm/@veroxid/core/dist/veroxid.esm.js';

  const vx = createVeroxid();
  vx.on('greeting', (data) => console.log('Received:', data));
  vx.emit('greeting', { message: 'Hello from Veroxid!' });
</script>

📦 Distribution Files Structure

When building the library with npm run build:lib, the following files are generated:

| File | Format | Description | | :--- | :--- | :--- | | dist/veroxid.min.js | UMD / IIFE | Primary minified CDN file (auto-binds to window.Veroxid) | | dist/veroxid.esm.js | ESM | Standard ES Module for browser import and bundlers | | dist/veroxid.cjs | CommonJS | Node.js backend compatibility | | src/veroxid/types.ts | TypeScript | Full TypeScript interfaces and type declarations |

🛠️ Developer & Automated Release Guide

1. Build the library locally:

npm run build:lib

2. Publish a new Version / Release:

The repository includes a GitHub Action (.github/workflows/cdn-release.yml) that automatically builds, attaches CDN assets, and publishes to NPM via NPM_TOKEN:

git add .
git commit -m "chore: release v1.0.0"
git tag v1.0.0
git push origin main --tags

🧩 Core Features

1. Reactive State: Lightweight store with key-based and global observers.
2. Event Bus: Type-safe pub/sub event emitter (on, once, emit, off).
3. Dynamic CDN Loader: Load subsequent scripts or stylesheets dynamically with built-in deduplication.
4. HTTP Client: Built-in fetch wrapper with configurable timeouts and automatic JSON parsing.
5. Plugin Architecture: Extensible .use(plugin) system.

📄 License

MIT © prssbayu-oss