{"id":22674787,"url":"https://github.com/rabarbra/ft_react","last_synced_at":"2026-03-01T02:02:12.798Z","repository":{"id":246819850,"uuid":"823729900","full_name":"rabarbra/ft_react","owner":"rabarbra","description":"Naive implementation of React-like library","archived":false,"fork":false,"pushed_at":"2024-07-04T08:51:59.000Z","size":12,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-11-16T12:05:18.094Z","etag":null,"topics":["framework","frontend","react","react-like","react-like-library"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/@rabarbra/ft_react","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rabarbra.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"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}},"created_at":"2024-07-03T15:36:50.000Z","updated_at":"2025-05-28T11:32:42.000Z","dependencies_parsed_at":null,"dependency_job_id":"1b8fc431-b97d-44fc-a60d-b2b920f06674","html_url":"https://github.com/rabarbra/ft_react","commit_stats":null,"previous_names":["rabarbra/ft_react"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/rabarbra/ft_react","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rabarbra%2Fft_react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rabarbra%2Fft_react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rabarbra%2Fft_react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rabarbra%2Fft_react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rabarbra","download_url":"https://codeload.github.com/rabarbra/ft_react/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rabarbra%2Fft_react/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":29958395,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-01T01:47:18.291Z","status":"online","status_checked_at":"2026-03-01T02:00:07.437Z","response_time":124,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"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","frontend","react","react-like","react-like-library"],"created_at":"2024-12-09T17:18:09.810Z","updated_at":"2026-03-01T02:02:12.772Z","avatar_url":"https://github.com/rabarbra.png","language":"JavaScript","readme":"# Naive React-like Library\n\nThis is a naive implementation of a React-like library designed to manage a virtual DOM, component lifecycle, and state management. \n\n## Features\n\n- Virtual DOM\n- Component-based Architecture\n- State Management with `useState`\n- Effect Hook with `useEffect`\n\n## Installation\n\n```bash\nnpm install @rabarbra/ft_react\n```\n\n## Usage\n\n### Generate your app template\n\n```bash\n# Init a new project\n./node_modules/@rabarbra/ft_react/scripts/init-project.js\n# or \nnpx init-project\n\n# Start development server\nnpm start\n\n# Create production build (it will create ./dist folder containing production build)\nnpm run build\n```\n\n### Basic Example\n\n```jsx\nimport ftReact from '@rabarbra/ft_react';\n\nfunction App() {\n  const [count, setCount] = ftReact.useState(0);\n  return (\n    \u003cdiv style={{ textAlign: 'center' }}\u003e\n      \u003ch1\u003eHello, World!\u003c/h1\u003e\n      \u003cp\u003eCount: {count}\u003c/p\u003e\n      \u003cbutton onClick={() =\u003e setCount(count + 1)}\u003eIncrement\u003c/button\u003e\n    \u003c/div\u003e\n  );\n}\n\nconst container = document.getElementById('app');\nftReact.render(\u003cApp /\u003e, container);\n```\n\n## API\n\n### `createElement`\n\nCreates a virtual DOM element.\n\n```jsx\nconst element = \u003cdiv id=\"my-div\"\u003eHello, World!\u003c/div\u003e;\n```\n\n### `render`\n\nRenders a virtual DOM element to the actual DOM.\n\n```jsx\nconst container = document.getElementById('app');\nftReact.render(element, container);\n```\n\n### `useState`\n\nManages state in a functional component.\n\n```jsx\nfunction Counter() {\n  const [count, setCount] = ftReact.useState(0);\n  return (\n    \u003cbutton onClick={() =\u003e setCount(count + 1)}\u003e\n      Count: {count}\n    \u003c/button\u003e\n  );\n}\n```\n\n### `useEffect`\n\nPerforms side effects in a functional component.\n\n```jsx\nfunction Timer() {\n  const [time, setTime] = ftReact.useState(0);\n\n  ftReact.useEffect(() =\u003e {\n    const interval = setInterval(() =\u003e setTime(time + 1), 1000);\n    return () =\u003e clearInterval(interval);\n  }, [time]);\n\n  return \u003cdiv\u003eTime: {time}\u003c/div\u003e;\n}\n```\n\n## License\n\nThis project is licensed under the MIT License.","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frabarbra%2Fft_react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frabarbra%2Fft_react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frabarbra%2Fft_react/lists"}