{"id":15011825,"url":"https://github.com/barelyhuman/preact-native","last_synced_at":"2025-10-29T14:11:55.971Z","repository":{"id":60242131,"uuid":"541209255","full_name":"barelyhuman/preact-native","owner":"barelyhuman","description":"experimental renderer for preact to work with react-native","archived":false,"fork":false,"pushed_at":"2023-12-11T05:41:08.000Z","size":775,"stargazers_count":157,"open_issues_count":6,"forks_count":4,"subscribers_count":7,"default_branch":"main","last_synced_at":"2025-03-04T23:33:01.336Z","etag":null,"topics":["preact","preact-native","react","react-native","renderer"],"latest_commit_sha":null,"homepage":"","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/barelyhuman.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":"CONTRIBUTING.md","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}},"created_at":"2022-09-25T15:03:45.000Z","updated_at":"2025-01-21T17:57:33.000Z","dependencies_parsed_at":"2024-09-15T22:10:48.952Z","dependency_job_id":null,"html_url":"https://github.com/barelyhuman/preact-native","commit_stats":{"total_commits":61,"total_committers":2,"mean_commits":30.5,"dds":"0.016393442622950838","last_synced_commit":"b8cf1024927a26a9777a575d5720d1d052d9636d"},"previous_names":[],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/barelyhuman%2Fpreact-native","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/barelyhuman%2Fpreact-native/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/barelyhuman%2Fpreact-native/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/barelyhuman%2Fpreact-native/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/barelyhuman","download_url":"https://codeload.github.com/barelyhuman/preact-native/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244047646,"owners_count":20389206,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["preact","preact-native","react","react-native","renderer"],"created_at":"2024-09-24T19:41:46.061Z","updated_at":"2025-10-29T14:11:55.851Z","avatar_url":"https://github.com/barelyhuman.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# preact-native\n\n\u003e **Warning**: This is an experimental approach at creating a renderer for\n\u003e preact\n\n\u003e **Note**: until this reaches v1.0.0, the entire featureset might change,\n\u003e since we are still figuring out what works best\n\nI wouldn't really recommend using this for production but putting down the base\nusage setup so that anyone who'd wish to help with development can at least get\na test environment ready.\n\n## Install\n\n```sh\n$ npm install @barelyhuman/preact-native preact\n```\n\n## Usage\n\n1. Setup a base react native project using `npx react-native init`\n2. Change `index.js` to include the `withPreact` from the library\n\n```js\n/**\n * @format\n */\nimport { AppRegistry } from 'react-native'\nimport App from './App'\nimport { name as appName } from './app.json'\nimport { withPreact } from '@barelyhuman/preact-native'\n\nAppRegistry.registerComponent(appName, () =\u003e withPreact(App))\n```\n\n3. Then add the following to the top of the `App.js` file\n\n```js\n/** @jsxImportSource preact */\nimport { SafeAreaView, View, Text, TextInput } from '@barelyhuman/preact-native'\n```\n\n4. Once the above is setup, you can just go ahead and write preact components as\n   usual.\n\n\u003e **Note**: instead of `preact/hooks` please use `@preact/signals` for the time\n\u003e being, once fixed this note will be removed\n\n**Eg:**\n\n```js\n/** @jsxImportSource preact */\nimport { SafeAreaView, View, Text } from '@barelyhuman/preact-native'\n\nexport default function App() {\n  return \u003cHome /\u003e\n}\n\nfunction Home() {\n  return (\n    \u003c\u003e\n      \u003cSafeAreaView\u003e\n        \u003cView\u003e\n          \u003cText color={'red'}\u003eHello\u003c/Text\u003e\n        \u003c/View\u003e\n      \u003c/SafeAreaView\u003e\n    \u003c/\u003e\n  )\n}\n```\n\n\u003e **Note**: All react related stuff (react as a dep and render tree needing\n\u003e react) will be removed from the library once I can handle creation of all\n\u003e these native modules manually without having to re-write the entire react\n\u003e native base from scratch\n\n## Roadmap\n\n- [x] A minimal dom\n- [x] Create views from the bridge instead of rendering with react\n  - [x] Create native views (Views created on the iOS and Android platform APIs)\n  - [x] Create derived views (Views created on top of the above by manipulating\n        the SDK)\n- [x] Update view styles from the bridge\n- [x] Update text nodes from the bridge\n- [x] Add compat for preact to make it possible for preact to diff and render\n      without the need for a react tree generator\n      `import {render} from \"preact-native/dom\"`\n- [ ] Handle events (presses, input, gestures) , aka events from preact will be\n      on the DOM, need to be proxied as events to the Native SDK\n- [x] Handling for Bridge level style props\n\n## Contribute\n\nread the [CONTRIBUTING.md](CONTRIBUTING.md)\n\n## Why ?\n\nIt seemed like a nice project to try out my limits in terms of complicated stuff\nand also because I got bored of building websites. Also, I personally think\npreact has become a lot more stable and has less breaking changes every 3\nversions thus making it easier to maintain and upgrade older projects.\n\n## License\n\n[MIT](/LICENSE) \u0026copy; [reaper](https://reaper.is)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbarelyhuman%2Fpreact-native","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbarelyhuman%2Fpreact-native","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbarelyhuman%2Fpreact-native/lists"}