{"id":25943470,"url":"https://github.com/tobitsoftware/create-chayns-app","last_synced_at":"2025-03-04T07:16:49.760Z","repository":{"id":55381558,"uuid":"305735765","full_name":"TobitSoftware/create-chayns-app","owner":"TobitSoftware","description":"Create a new chayns® development project in one command.","archived":false,"fork":false,"pushed_at":"2025-02-13T08:18:55.000Z","size":1490,"stargazers_count":2,"open_issues_count":0,"forks_count":1,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-02-13T09:25:31.987Z","etag":null,"topics":["chayns","chayns-components","chayns-toolkit","react","starter-kit"],"latest_commit_sha":null,"homepage":"https://npm.im/create-chayns-app","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/TobitSoftware.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":"2020-10-20T14:31:10.000Z","updated_at":"2025-02-13T08:18:54.000Z","dependencies_parsed_at":"2024-06-06T08:25:30.903Z","dependency_job_id":"eca6b3e9-a162-453d-be27-3f1845716f56","html_url":"https://github.com/TobitSoftware/create-chayns-app","commit_stats":{"total_commits":50,"total_committers":4,"mean_commits":12.5,"dds":0.5,"last_synced_commit":"b0ca23a82ade33d23015221aff27bdae6edb5057"},"previous_names":[],"tags_count":39,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TobitSoftware%2Fcreate-chayns-app","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TobitSoftware%2Fcreate-chayns-app/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TobitSoftware%2Fcreate-chayns-app/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TobitSoftware%2Fcreate-chayns-app/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/TobitSoftware","download_url":"https://codeload.github.com/TobitSoftware/create-chayns-app/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":241801253,"owners_count":20022390,"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":["chayns","chayns-components","chayns-toolkit","react","starter-kit"],"created_at":"2025-03-04T07:16:49.251Z","updated_at":"2025-03-04T07:16:49.733Z","avatar_url":"https://github.com/TobitSoftware.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n    \u003ch1\u003e\n        \u003cimg src=\"https://raw.githubusercontent.com/TobitSoftware/create-chayns-app/HEAD/assets/logo.png\" width=\"500px\" alt=\"create-chayns-app\" /\u003e\n    \u003c/h1\u003e\n    \u003cp\u003eCreate a new chayns® development project in one command.\u003c/p\u003e\n    \u003cdiv\u003e\n        \u003ca href=\"https://github.com/TobitSoftware/create-chayns-app/blob/master/LICENSE\"\u003e\n            \u003cimg src=\"https://img.shields.io/github/license/TobitSoftware/create-chayns-app?style=for-the-badge\" alt=\"\" /\u003e\n        \u003c/a\u003e\n        \u003ca href=\"https://www.npmjs.com/package/create-chayns-app\"\u003e\n            \u003cimg src=\"https://img.shields.io/npm/v/create-chayns-app?style=for-the-badge\" alt=\"\" /\u003e\n        \u003c/a\u003e\n        \u003ca href=\"https://github.com/TobitSoftware/create-chayns-app/commits\"\u003e\n            \u003cimg src=\"https://img.shields.io/github/last-commit/TobitSoftware/create-chayns-app?style=for-the-badge\" alt=\"\" /\u003e\n        \u003c/a\u003e\n        \u003ca href=\"https://github.com/TobitSoftware/create-chayns-app/issues\"\u003e\n            \u003cimg src=\"https://img.shields.io/github/issues-raw/TobitSoftware/create-chayns-app?style=for-the-badge\" alt=\"\" /\u003e\n        \u003c/a\u003e\n    \u003c/div\u003e\n    \u003chr /\u003e\n    \u003cimg src=\"https://raw.githubusercontent.com/TobitSoftware/create-chayns-app/HEAD/assets/demo.gif\" alt=\"Demo of using create-chayns-app\"\u003e\n\u003c/div\u003e\n\n## Overview\n\n-   [Get Started](#get-started)\n    -   [Developing a Custom Page](#developing-a-custom-page)\n    -   [Developing a Pagemaker Plugin](#developing-a-pagemaker-plugin)\n-   [FAQ](#faq)\n    -   [What is the difference between an Pagemaker plugin and a complete page?](#what-is-the-difference-between-an-pagemaker-plugin-and-a-complete-page)\n    -   [How can I deploy the application so it will be permanently available to all users of my Site?](#how-can-i-deploy-the-application-so-it-will-be-permanently-available-to-all-users-of-my-site)\n\n## Get Started\n\nTo bootstrap a new chayns® project, simply run\n\n```bash\nnpx create-chayns-app@latest\n```\n\nor\n\n```bash\nyarn create chayns-app\n```\n\nThis will start an interactive wizard to guide you through the creation of your\nproject.\n\n\u003e A folder will be created in the current working directory of your terminal\n\u003e with the name of your project.\n\nDepending on wether you choose to create a complete page or a pagemaker plugin,\ncontinue with the [\"Developing a Custom Page\"](#developing-a-custom-page) or the\n[\"Developing a Pagemaker Plugin\"](#developing-a-pagemaker-plugin) guides\nrespectively.\n\n\u003e Don't know what to choose? Check out the\n\u003e [FAQ](#what-is-the-difference-between-an-pagemaker-plugin-and-a-complete-page).\n\n### Developing a Custom Page\n\nSince you chose the `A complete page` option for your project, we will be\ncreating a custom page. You can start a local development server by running\n\n```bash\nnpm run dev\n```\n\nor\n\n```bash\nyarn dev\n```\n\nYou need to develop the project in a chayns-environment for all features to work\nproperly. You have to create a Page on a chayns-Site you can manage, if you do\nnot have one yet, create one [here](https://chayns.net/).\n\nAfter finishing the setup of your site, head to **Administration \u003e Content \u003e\nPages** and click the \"Add Page\" button at the top.\n\n![](https://raw.githubusercontent.com/TobitSoftware/create-chayns-app/HEAD/assets/guide/add-page.png)\n\nChoose the \"Include website\" option and enter a name you like (e.g. \"Local\nDevelopment\"). Set the source to `http://localhost:1234/`, the address at which\nyour local development server operates.\n\n![](https://raw.githubusercontent.com/TobitSoftware/create-chayns-app/HEAD/assets/guide/include-website.png)\n\nYour freshly created page should appear in the menu. Navigate to the page by\nclicking it.\n\n**Congrats!** You are now ready to develop your custom page! Start making\nchanges to your code and you should see them reflected on your Page in\nreal-time.\n\n### Developing a Pagemaker Plugin\n\nSince you chose the `A pagemaker plugin` option, we will be creating a plugin\nfor the Pagemaker, the powerful website editing tool included in chayns.\n\nFirst you should start the local development server of your project by running\n\n```bash\nnpm run dev\n```\n\nor\n\n```bash\nyarn dev\n```\n\nYou need to develop the project in a chayns-environment for all features to work\nproperly. You have to create a Page on a chayns-Site you can manage, if you do\nnot have one yet, create one [here](https://chayns.net/).\n\nAfter finishing the setup of your site, head to **Administration \u003e Content \u003e\nPages** and click the \"Add Page\" button at the top.\n\n![](https://raw.githubusercontent.com/TobitSoftware/create-chayns-app/HEAD/assets/guide/add-page.png)\n\nChoose the \"Create a page\" option and enter a name you like (e.g. \"Local\nDevelopment\"). Click the \"Add\" button to create the Page.\n\n![](https://raw.githubusercontent.com/TobitSoftware/create-chayns-app/HEAD/assets/guide/create-page.png)\n\nYour freshly created page should appear in the menu. Navigate to the page by\nclicking it. There we want to enter _\"admin-mode\"_ by activating the switch in\nthe main menu, next to the name of your Site.\n\n![](https://raw.githubusercontent.com/TobitSoftware/create-chayns-app/HEAD/assets/guide/admin-switch.png)\n\nA floating button with a big plus sign should appear in the bottom right corner.\nClick it and choose **Interactive \u003e Iframe** in the flyout-menu to add an iframe\nto your Page.\n\n![](https://raw.githubusercontent.com/TobitSoftware/create-chayns-app/HEAD/assets/guide/add-iframe.png)\n\nHover over your newly created iframe and activate the chayns-API by clicking on\nthe code-symbol and confirming your choice in the dialog.\n\n![](https://raw.githubusercontent.com/TobitSoftware/create-chayns-app/HEAD/assets/guide/iframe-chayns-api.png)\n\nNow we have to set the iframe source (_\"Quelle\"_) to the address of your local\ndevelopment server by tapping on the gear-icon and entering\n`http://localhost:1234/` in the second input field.\n\n![](https://raw.githubusercontent.com/TobitSoftware/create-chayns-app/HEAD/assets/guide/add-local-path.png)\n\n**Congrats!** You are now ready to develop your Pagemaker plugin! Start making\nchanges to your code and you should see them reflected on your Page in\nreal-time.\n\n## FAQ\n\n### What is the difference between an Pagemaker plugin and a complete page?\n\nA Pagemaker plugin only takes up a slice of your Page and you can add regular\nPagemaker elements like text, videos, graphics or other interactive elements\nabove and below your Plugin, that can be easily edited with the MS Word-like\ninterface of the Pagemaker, by anyone, including non-developers.\n\nWhen developing a complete page, your application will take up all the space on\none page. On one hand you will have slightly more space to work with, but on the\nother had this means that you cannot easily add content to this page with the\nPagemaker. Of course you can still add headings (`\u003ch1\u003e`) and other elements in\nyour code with HTML, but they will not be easily editable by other people,\nespecially non-developers.\n\n### How can I deploy the application so it will be permanently available to all users of my Site?\n\nThe most simple way of deploying your app is to use a cloud deployment platform\nlike [Vercel](https://vercel.com/home) or [Netlify](https://www.netlify.com/).\nThese services will deploy any project for you, aslong as it is managed with a\nGit repository on GitHub or similar services.\n\nIf these platforms ask for a build command, enter `chayns-toolkit build` and if\nthey ask for a publish directory, enter `build`.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftobitsoftware%2Fcreate-chayns-app","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftobitsoftware%2Fcreate-chayns-app","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftobitsoftware%2Fcreate-chayns-app/lists"}