{"id":24488666,"url":"https://github.com/yubaoquan/cyclejs-demo","last_synced_at":"2025-03-15T00:30:21.587Z","repository":{"id":148637305,"uuid":"130960131","full_name":"yubaoquan/cyclejs-demo","owner":"yubaoquan","description":"Some small demos using cyclejs","archived":false,"fork":false,"pushed_at":"2018-06-14T11:48:11.000Z","size":185,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2025-01-21T16:36:13.556Z","etag":null,"topics":["cyclejs","demo","demo-app"],"latest_commit_sha":null,"homepage":null,"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/yubaoquan.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}},"created_at":"2018-04-25T06:23:09.000Z","updated_at":"2018-06-14T11:48:13.000Z","dependencies_parsed_at":"2023-05-20T18:34:12.374Z","dependency_job_id":null,"html_url":"https://github.com/yubaoquan/cyclejs-demo","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yubaoquan%2Fcyclejs-demo","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yubaoquan%2Fcyclejs-demo/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yubaoquan%2Fcyclejs-demo/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/yubaoquan%2Fcyclejs-demo/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/yubaoquan","download_url":"https://codeload.github.com/yubaoquan/cyclejs-demo/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243667531,"owners_count":20328032,"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":["cyclejs","demo","demo-app"],"created_at":"2025-01-21T16:29:16.897Z","updated_at":"2025-03-15T00:30:21.571Z","avatar_url":"https://github.com/yubaoquan.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# cyclejs-demo\nSome small demos using cyclejs\n\n### install\n\n\u003cdel\u003e install puer so that you can view the page as from server, this will avoid getting the error `Origin null is not allowed by Access-Control-Allow-Origin\n` when demo sending an http request while you view the demo page just from file system. \u003c/del\u003e\n\n\u003e npm install -g puer\n\ngo to the root path of demo, install all dependencies\n\n\u003e npm install\n\n### run\n\nin the root path of demo, open two terminal and run this 2 cmds below:\n\n\u003e npm run build\n\n\u003e puer\n\nThen, open `http://localhost:8000/index.html` in broswer, you will see the demo running.\n\n\n### What this demo does?\n\n1. Four tabs, click on each tab to activate it.\n2. Each tab has a component under it.\n3. Two instances of component Foo is in the first tab, click on component foo, it will show you the second of current time.\n4. Form component is in the second tab. It has two field: name and age. you can input the value of name or age and you get what you input below the form. Click the submit button to process a validation, and form component also emit a msg to the container component.\n5. Ajax component is in the third tab. Click on the button to send an request to server, after the first request succeed, it will automatically send the second one, And print the response msg as json string in the tab. Otherwise if request failed, log an error msg in the console.\n6. Container component, it wap all these components above, all its subcomponents emit msgs to it, and it pass the msg to the reducer to process. So the reducer knows all the dataflows through the whole app.\n\n### Is it the best practice of cyclejs?\n\nI don't know yet, there can be come implementations which are not well designed in this app, or even anti-pattern. Anyway, this demo app provide you a way to organize code using cyclejs to implement some daily needed features.\n\n### Feedback\n\nIf you have any questions or find any bugs, please make an issue in this repo. Thank you.\n\n### slide\n[slide](https://slides.com/fuucker/deck-1/live#/)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyubaoquan%2Fcyclejs-demo","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fyubaoquan%2Fcyclejs-demo","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fyubaoquan%2Fcyclejs-demo/lists"}