{"library":"oc","title":"OpenComponents Framework","description":"OpenComponents (OC) is an open-source JavaScript framework designed for developing and distributing server-side rendered HTML components, often described as 'serverless in the front-end world'. It abstracts infrastructure complexities, allowing development teams to build, publish, and consume front-end components seamlessly. Components can include Node.js logic for data fetching, along with HTML, CSS, and client-side JavaScript, supporting popular frameworks like React or Angular. The current stable version is 0.50.44. While continuously developed, the project notes that the API is still under heavy development and prone to change. Key differentiators include its focus on server-side rendering, transparent scaling, and a registry-based distribution model that allows components to be consumed via HTTP endpoints.","language":"javascript","status":"active","last_verified":"Sun Apr 19","install":{"commands":["npm install oc"],"cli":{"name":"oc","version":null}},"imports":["import { Component } from 'oc';","import { Registry } from 'oc';","import { Client } from 'oc';"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import { Registry } from 'oc';\nimport path from 'path';\nimport fs from 'fs';\n\nasync function startLocalRegistry() {\n  const componentsDir = path.join(process.cwd(), 'local-components');\n\n  // Create a dummy components directory if it doesn't exist\n  if (!fs.existsSync(componentsDir)) {\n    fs.mkdirSync(componentsDir);\n    console.log(`Created directory: ${componentsDir}`);\n\n    // Add a placeholder component if needed for testing, e.g., a simple 'hello-world' component\n    // For a real component, you'd use 'oc-cli init' in this directory.\n    console.log('Consider using `oc-cli init` inside local-components to create a component.');\n  }\n\n  const registry = new Registry({\n    port: 3000,\n    baseUrl: 'http://localhost:3000/',\n    paths: [componentsDir],\n    env: { name: 'development' }\n  });\n\n  try {\n    await registry.start();\n    console.log('OpenComponents Registry started successfully on port 3000.');\n    console.log(`Components will be loaded from: ${componentsDir}`);\n    console.log('Access the registry at: http://localhost:3000/');\n    console.log('Press Ctrl+C to stop the server.');\n  } catch (err) {\n    console.error('Failed to start OpenComponents Registry:', err);\n    process.exit(1);\n  }\n}\n\nstartLocalRegistry();","lang":"typescript","description":"Demonstrates how to start a minimal local OpenComponents registry using the `Registry` class, serving components from a specified directory.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}