{"id":43047539,"url":"https://github.com/vincenthirtz/pulse-js-framework","last_synced_at":"2026-02-11T13:06:54.377Z","repository":{"id":335289571,"uuid":"1145098925","full_name":"vincenthirtz/pulse-js-framework","owner":"vincenthirtz","description":"A declarative DOM framework with CSS selector-based structure","archived":false,"fork":false,"pushed_at":"2026-01-31T16:41:29.000Z","size":657,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2026-01-31T21:29:46.786Z","etag":null,"topics":["framework","javascript","mobile","web"],"latest_commit_sha":null,"homepage":"https://pulse-js.fr","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vincenthirtz.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2026-01-29T12:26:49.000Z","updated_at":"2026-01-31T16:41:32.000Z","dependencies_parsed_at":null,"dependency_job_id":null,"html_url":"https://github.com/vincenthirtz/pulse-js-framework","commit_stats":null,"previous_names":["vincenthirtz/pulse-js-framework"],"tags_count":23,"template":false,"template_full_name":null,"purl":"pkg:github/vincenthirtz/pulse-js-framework","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vincenthirtz%2Fpulse-js-framework","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vincenthirtz%2Fpulse-js-framework/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vincenthirtz%2Fpulse-js-framework/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vincenthirtz%2Fpulse-js-framework/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vincenthirtz","download_url":"https://codeload.github.com/vincenthirtz/pulse-js-framework/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vincenthirtz%2Fpulse-js-framework/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29092732,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-02-04T03:31:03.593Z","status":"ssl_error","status_checked_at":"2026-02-04T03:29:50.742Z","response_time":62,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["framework","javascript","mobile","web"],"created_at":"2026-01-31T10:03:12.613Z","updated_at":"2026-02-11T13:06:54.371Z","avatar_url":"https://github.com/vincenthirtz.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Pulse Framework\n\n[![CI](https://github.com/vincenthirtz/pulse-js-framework/actions/workflows/ci.yml/badge.svg)](https://github.com/vincenthirtz/pulse-js-framework/actions/workflows/ci.yml)\n[![codecov](https://codecov.io/gh/vincenthirtz/pulse-js-framework/graph/badge.svg)](https://codecov.io/gh/vincenthirtz/pulse-js-framework)\n[![Netlify Status](https://api.netlify.com/api/v1/badges/2597dac2-228a-4d3e-bea8-4e7ef8ac5c53/deploy-status)](https://app.netlify.com/projects/pulse-js/deploys)\n\nNo build. No dependencies. Just JavaScript.\n\n## Features\n\n- **CSS Selector Syntax** - Create DOM elements using familiar CSS selectors\n- **Reactive Pulsations** - Automatic UI updates when state changes\n- **Custom DSL** - Optional `.pulse` file format for cleaner code\n- **No Build Required** - Works directly in the browser\n- **Lightweight** - Minimal footprint, maximum performance\n- **Router \u0026 Store** - Built-in SPA routing and state management\n- **Form Handling** - Validation, async validators, field arrays\n- **Async Primitives** - useAsync, useResource, usePolling with SWR caching\n- **Server-Side Rendering** - Full SSR with hydration and async data fetching\n- **Hot Module Replacement** - Full HMR with state preservation\n- **Mobile Apps** - Build native Android \u0026 iOS apps (zero dependencies)\n- **TypeScript Support** - Full type definitions for IDE autocomplete\n- **DevTools** - Time-travel debugging, dependency graph visualization\n\n## Installation\n\n```bash\nnpm install pulse-js-framework\n```\n\n## Quick Start\n\n### Create a new project\n\n```bash\nnpx pulse-js-framework create my-app\ncd my-app\nnpm install\nnpm run dev\n```\n\n### Or with TypeScript\n\n```bash\nnpx pulse-js-framework create my-app --typescript\ncd my-app\nnpm install\nnpm run dev\n```\n\n### Or from a template\n\nCreate projects from built-in example apps:\n\n```bash\n# E-commerce app (products, cart, checkout)\nnpx pulse-js-framework create my-shop --ecommerce\n\n# Todo app (filtering, local storage)\nnpx pulse-js-framework create my-todos --todo\n\n# Blog (posts, sidebar, navigation)\nnpx pulse-js-framework create my-blog --blog\n\n# Chat app (messages, users, emoji picker)\nnpx pulse-js-framework create my-chat --chat\n\n# Dashboard (data visualization)\nnpx pulse-js-framework create my-dashboard --dashboard\n```\n\n### Or use directly\n\n```javascript\nimport { pulse, effect, el, mount } from 'pulse-js-framework';\n\n// Create reactive state\nconst count = pulse(0);\n\n// Build UI with CSS selector syntax\nfunction Counter() {\n  const div = el('.counter');\n\n  const display = el('h1');\n  effect(() =\u003e {\n    display.textContent = `Count: ${count.get()}`;\n  });\n\n  const increment = el('button.btn', '+');\n  increment.onclick = () =\u003e count.update(n =\u003e n + 1);\n\n  div.append(display, increment);\n  return div;\n}\n\nmount('#app', Counter());\n```\n\n## CSS Selector Syntax\n\n```javascript\nel('div')                    // \u003cdiv\u003e\u003c/div\u003e\nel('.container')             // \u003cdiv class=\"container\"\u003e\u003c/div\u003e\nel('#app')                   // \u003cdiv id=\"app\"\u003e\u003c/div\u003e\nel('button.btn.primary')     // \u003cbutton class=\"btn primary\"\u003e\u003c/button\u003e\nel('input[type=text]')       // \u003cinput type=\"text\"\u003e\nel('h1', 'Hello World')      // \u003ch1\u003eHello World\u003c/h1\u003e\n```\n\n## Reactivity\n\n```javascript\nimport { pulse, effect, computed, batch } from 'pulse-js-framework';\n\nconst firstName = pulse('John');\nconst lastName = pulse('Doe');\n\n// Computed values\nconst fullName = computed(() =\u003e `${firstName.get()} ${lastName.get()}`);\n\n// Effects auto-run when dependencies change\neffect(() =\u003e console.log(`Hello, ${fullName.get()}!`));\n\nfirstName.set('Jane'); // Logs: \"Hello, Jane Doe!\"\n\n// Batch updates (effects run once)\nbatch(() =\u003e {\n  firstName.set('John');\n  lastName.set('Smith');\n});\n```\n\n## .pulse File Format\n\n```pulse\n@page Counter\n\nstate {\n  count: 0\n}\n\nview {\n  .counter {\n    h1 \"Count: {count}\"\n    button @click(count++) \"+\"\n    button @click(count--) \"-\"\n  }\n}\n\nstyle {\n  .counter { text-align: center; padding: 20px }\n}\n```\n\nSee [Pulse DSL documentation](docs/pulse-dsl.md) for full syntax reference.\n\n## CLI Commands\n\n```bash\n# Project Creation\npulse create \u003cname\u003e              # Create new project\npulse create \u003cname\u003e --typescript # Create TypeScript project\npulse create \u003cname\u003e --ecommerce  # Create from E-Commerce template\npulse create \u003cname\u003e --todo       # Create from Todo App template\npulse create \u003cname\u003e --blog       # Create from Blog template\npulse create \u003cname\u003e --chat       # Create from Chat template\npulse create \u003cname\u003e --dashboard  # Create from Dashboard template\npulse init --typescript          # Initialize in current directory\n\n# Development\npulse dev [port]                 # Start dev server (default: 3000)\npulse build                      # Build for production\npulse preview [port]             # Preview production build\npulse compile \u003cfile\u003e             # Compile .pulse file\n\n# Code Quality\npulse lint [files]               # Validate .pulse files\npulse lint --fix                 # Auto-fix fixable issues\npulse format [files]             # Format .pulse files\npulse analyze                    # Analyze bundle\n\n# Testing\npulse test                       # Run tests with Node.js test runner\npulse test --coverage            # Run tests with coverage\npulse test --watch               # Watch mode\npulse test --create \u003cname\u003e       # Generate test file\n\n# Project Tools\npulse doctor                     # Run project diagnostics\npulse doctor --verbose           # Detailed diagnostics\n\n# Creating .pulse Files\npulse new \u003cname\u003e                 # Create component (src/components/\u003cName\u003e.pulse)\npulse new \u003cname\u003e --type page     # Create page (src/pages/\u003cName\u003e.pulse)\npulse new \u003cname\u003e --type layout   # Create layout (src/layouts/\u003cName\u003e.pulse)\npulse new \u003cname\u003e --props         # Include props section\n\n# Scaffolding\npulse scaffold component \u003cname\u003e  # Generate component\npulse scaffold page \u003cname\u003e       # Generate page\npulse scaffold store \u003cname\u003e      # Generate store module\npulse scaffold hook \u003cname\u003e       # Generate custom hook\npulse scaffold service \u003cname\u003e    # Generate API service\npulse scaffold context \u003cname\u003e    # Generate context provider\npulse scaffold layout \u003cname\u003e     # Generate layout component\n\n# Documentation\npulse docs --generate            # Generate API docs (Markdown)\npulse docs --generate -f html    # Generate HTML docs\npulse docs --generate -f json    # Generate JSON docs\n```\n\nSee [CLI documentation](docs/cli.md) for full command reference.\n\n## Core Modules\n\n### Router\n\n```javascript\nimport { createRouter, lazy } from 'pulse-js-framework/runtime/router';\n\nconst router = createRouter({\n  routes: {\n    '/': HomePage,\n    '/users/:id': UserPage,\n    '/dashboard': lazy(() =\u003e import('./Dashboard.js'))\n  }\n});\n```\n\n### Store\n\n```javascript\nimport { createStore, createActions } from 'pulse-js-framework/runtime/store';\n\nconst store = createStore({ user: null, theme: 'light' }, { persist: true });\nconst actions = createActions(store, {\n  login: (store, user) =\u003e store.user.set(user)\n});\n```\n\n### Form\n\n```javascript\nimport { useForm, validators } from 'pulse-js-framework/runtime/form';\n\nconst { fields, handleSubmit, isValid } = useForm(\n  { email: '', password: '' },\n  {\n    email: [validators.required(), validators.email()],\n    password: [validators.required(), validators.minLength(8)]\n  }\n);\n```\n\n### Async\n\n```javascript\nimport { useAsync, useResource } from 'pulse-js-framework/runtime/async';\n\nconst { data, loading } = useAsync(() =\u003e fetch('/api/users').then(r =\u003e r.json()));\n\nconst users = useResource('users', fetchUsers, { refreshInterval: 30000 });\n```\n\n### Accessibility\n\n```javascript\nimport {\n  // Announcements\n  announce, createAnnouncementQueue,\n  // Focus management\n  trapFocus, onEscapeKey, createFocusVisibleTracker,\n  // User preferences\n  prefersReducedMotion, prefersReducedTransparency, forcedColorsMode,\n  // ARIA widgets\n  createModal, createTooltip, createAccordion, createMenu,\n  // Color contrast\n  getContrastRatio, meetsContrastRequirement,\n  // Validation\n  validateA11y\n} from 'pulse-js-framework/runtime/a11y';\n\n// Screen reader announcements\nannounce('Item saved successfully');\n\n// Accessible modal dialog\nconst modal = createModal(dialog, { labelledBy: 'title', closeOnBackdropClick: true });\nmodal.open();\n\n// Check color contrast (WCAG)\nconst ratio = getContrastRatio('#333', '#fff'); // 12.63\nmeetsContrastRequirement(ratio, 'AA'); // true\n```\n\nSee [Accessibility documentation](docs/accessibility.md) for full guide.\n\nSee [API documentation](docs/api.md) for full reference.\n\n## Mobile Apps\n\nBuild native Android and iOS apps:\n\n```bash\npulse mobile init\npulse build\npulse mobile build android\npulse mobile run android\n```\n\n```javascript\nimport { createNativeStorage, NativeUI } from 'pulse-js-framework/runtime/native';\n\nconst storage = createNativeStorage();\nconst theme = storage.get('theme', 'light');\nNativeUI.toast('Hello from native!');\n```\n\nSee [Mobile documentation](docs/mobile.md) for full guide.\n\n## IDE Extensions\n\n### VS Code\n\n```bash\ncd vscode-extension \u0026\u0026 bash install.sh\n```\n\n### IntelliJ IDEA / WebStorm\n\n```bash\ncd intellij-plugin \u0026\u0026 ./gradlew buildPlugin\n```\n\nFeatures: Syntax highlighting, code snippets, bracket matching.\n\n## TypeScript Support\n\nFull type definitions included:\n\n```typescript\nimport { pulse, Pulse } from 'pulse-js-framework/runtime';\nimport { createRouter, Router } from 'pulse-js-framework/runtime/router';\n\nconst count: Pulse\u003cnumber\u003e = pulse(0);\n```\n\n## Examples\n\n| Example | Description |\n|---------|-------------|\n| [Todo App](examples/todo) | Task management with filters |\n| [Blog](examples/blog) | CRUD, categories, search |\n| [Chat App](examples/chat) | Real-time messaging |\n| [E-commerce](examples/ecommerce) | Shopping cart |\n| [Dashboard](examples/dashboard) | Admin UI |\n| [HMR Demo](examples/hmr) | Hot module replacement |\n| [Router Demo](examples/router) | SPA routing |\n| [Store Demo](examples/store) | State with undo/redo |\n| [Electron App](examples/electron) | Desktop notes app |\n\n## Server-Side Rendering\n\nPulse supports full SSR with hydration and async data fetching:\n\n```javascript\n// server.js\nimport { renderToString, serializeState } from 'pulse-js-framework/runtime/ssr';\nimport App from './App.js';\n\napp.get('*', async (req, res) =\u003e {\n  const { html, state } = await renderToString(() =\u003e App(), {\n    waitForAsync: true  // Wait for useAsync to resolve\n  });\n\n  res.send(`\n    \u003c!DOCTYPE html\u003e\n    \u003chtml\u003e\n      \u003cbody\u003e\n        \u003cdiv id=\"app\"\u003e${html}\u003c/div\u003e\n        \u003cscript\u003ewindow.__PULSE_STATE__ = ${serializeState(state)};\u003c/script\u003e\n        \u003cscript type=\"module\" src=\"/client.js\"\u003e\u003c/script\u003e\n      \u003c/body\u003e\n    \u003c/html\u003e\n  `);\n});\n\n// client.js\nimport { hydrate } from 'pulse-js-framework/runtime/ssr';\nimport App from './App.js';\n\nhydrate('#app', () =\u003e App(), {\n  state: window.__PULSE_STATE__\n});\n```\n\n## Documentation\n\n- [API Reference](docs/api.md) - Complete API documentation\n- [CLI Commands](docs/cli.md) - Command line interface\n- [Pulse DSL](docs/pulse-dsl.md) - .pulse file syntax\n- [Accessibility](docs/accessibility.md) - A11y guide and ARIA helpers\n- [HTTP Client](docs/http.md) - Fetch wrapper with interceptors\n- [WebSocket](docs/websocket.md) - Real-time with auto-reconnect\n- [GraphQL](docs/graphql.md) - Queries, mutations, subscriptions\n- [Context API](docs/context.md) - Dependency injection\n- [DevTools](docs/devtools.md) - Debugging and profiling\n- [Mobile Apps](docs/mobile.md) - Native Android \u0026 iOS\n- [SSR](docs/ssr.md) - Server-side rendering and hydration\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvincenthirtz%2Fpulse-js-framework","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvincenthirtz%2Fpulse-js-framework","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvincenthirtz%2Fpulse-js-framework/lists"}