{"id":21399032,"url":"https://github.com/pradeep-selva/react-gui","last_synced_at":"2026-04-13T23:02:45.313Z","repository":{"id":47350508,"uuid":"331209820","full_name":"Pradeep-selva/react-gui","owner":"Pradeep-selva","description":"A simple, blazingly fast way to create React Components using a GUI","archived":false,"fork":false,"pushed_at":"2021-06-30T06:30:41.000Z","size":1607,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-16T15:49:28.581Z","etag":null,"topics":["component","fast","generate-code","generated-code","gui","javascript","react","reactjs","svelte","typescript"],"latest_commit_sha":null,"homepage":"https://marketplace.visualstudio.com/items?itemName=pradeepselva.react-gui","language":"TypeScript","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/Pradeep-selva.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-01-20T06:07:33.000Z","updated_at":"2024-05-09T02:32:20.000Z","dependencies_parsed_at":"2022-08-21T22:21:24.194Z","dependency_job_id":null,"html_url":"https://github.com/Pradeep-selva/react-gui","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Pradeep-selva/react-gui","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Pradeep-selva%2Freact-gui","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Pradeep-selva%2Freact-gui/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Pradeep-selva%2Freact-gui/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Pradeep-selva%2Freact-gui/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Pradeep-selva","download_url":"https://codeload.github.com/Pradeep-selva/react-gui/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Pradeep-selva%2Freact-gui/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31774547,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-13T20:17:16.280Z","status":"ssl_error","status_checked_at":"2026-04-13T20:17:08.216Z","response_time":93,"last_error":"SSL_read: 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":["component","fast","generate-code","generated-code","gui","javascript","react","reactjs","svelte","typescript"],"created_at":"2024-11-22T15:12:46.640Z","updated_at":"2026-04-13T23:02:45.278Z","avatar_url":"https://github.com/Pradeep-selva.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n    \u003cimg src=\"./media/icon.png\" alt=\"icon\" width=\"100\"/\u003e\n\u003c/div\u003e\n\n\u003ch1 align=\"center\"\u003eReact GUI\u003c/h1\u003e\n\u003cdiv align=\"center\"\u003e\n  \u003cstrong\u003eA blazingly fast way to bootstrap react components\u003c/strong\u003e\n  \u003cp\u003eCreate your react components quickly \u0026 easily with a straightforward GUI\u003c/p\u003e\n\u003c/div\u003e\n\n---\n\n## Demo\n\n\u003cdiv align=\"center\"\u003e\n    \u003cimg src=\"./media/react-gui-recording.gif\" alt=\"demo\"/\u003e\n\u003c/div\u003e\n\n## Installation\n\nDownload the extension by -\n\n1. Searching for React GUI by pradeepselva on your vscode extensions.\n2. Visit the extension's home page at `https://marketplace.visualstudio.com/items?itemName=pradeepselva.react-gui` and download it.\n\n## Usage\n\n1. Component creation -\n\n   Open the component creation form from sidebar and fill it up as shown in the above demo.\n   Click create and get started with producing logic for your component, without worrying about\n   boilerplate. visit [this link](https://github.com/Pradeep-selva/react-gui/blob/master/media/react-gui-recording.gif) if the demo doesn't load.\n\n2. Definition file initialization -\n\n   - Highlight a list of props that you want to create a definition file (.d.ts) from.\n   - Press ctrl+shift+p and search `Initialize Definition File`.\n   - Press the `React GUI: Initialize Definition File` option.\n\n   **eg:** You may highlight the props from lists like the following. The highlighted text in\n   the following cases must be `label, placeholder, value`.\n\n   1. `const {label, placeholder, value} = this.props;`\n   2. `const InputField = ({label, placeholder, value}) =\u003e`\n\n## Built Using\n\n- Typescript\n- Svelte\n- HTML/CSS\n- Yo\n\n## Steps to run locally\n\n- Clone the repo using `git clone https://github.com/Pradeep-selva/react-gui`.\n- install dependencies using `yarn` or `npm install`.\n- Run `yarn watch` in your root directory.\n- In your root directory press f5 and select `npm compile`.\n\n## License\n\n[MIT](LICENSE) © [Pradeep-selva](https://github.com/Pradeep-selva)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpradeep-selva%2Freact-gui","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpradeep-selva%2Freact-gui","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpradeep-selva%2Freact-gui/lists"}