{"id":22487326,"url":"https://github.com/kickstartDS/kickstartDS","last_synced_at":"2025-08-02T20:30:36.884Z","repository":{"id":63248131,"uuid":"357872105","full_name":"kickstartDS/kickstartDS","owner":"kickstartDS","description":"kickstartDS mono-repository, containing all packages but config related ones and the content component module","archived":false,"fork":false,"pushed_at":"2025-07-21T10:20:02.000Z","size":25843,"stargazers_count":98,"open_issues_count":88,"forks_count":4,"subscribers_count":3,"default_branch":"next","last_synced_at":"2025-07-29T17:04:58.612Z","etag":null,"topics":["components","design-system","es6","eslint","html","html5","javascript","prettier","react","storybook","styleguide","stylelint","typescript","ui","ui-components"],"latest_commit_sha":null,"homepage":"https://www.kickstartDS.com/docs","language":"MDX","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/kickstartDS.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE-APACHE","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,"zenodo":null}},"created_at":"2021-04-14T10:57:15.000Z","updated_at":"2025-07-21T10:20:06.000Z","dependencies_parsed_at":"2024-06-04T09:06:49.854Z","dependency_job_id":"43134324-ebe1-4d22-8752-97c4e826a06f","html_url":"https://github.com/kickstartDS/kickstartDS","commit_stats":{"total_commits":1781,"total_committers":10,"mean_commits":178.1,"dds":0.6204379562043796,"last_synced_commit":"bd1048f6151c0403745634d9f95aa98e62be4d3f"},"previous_names":[],"tags_count":916,"template":false,"template_full_name":null,"purl":"pkg:github/kickstartDS/kickstartDS","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kickstartDS%2FkickstartDS","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kickstartDS%2FkickstartDS/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kickstartDS%2FkickstartDS/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kickstartDS%2FkickstartDS/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/kickstartDS","download_url":"https://codeload.github.com/kickstartDS/kickstartDS/tar.gz/refs/heads/next","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/kickstartDS%2FkickstartDS/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":267727816,"owners_count":24135023,"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","status":"online","status_checked_at":"2025-07-29T02:00:12.549Z","response_time":2574,"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":["components","design-system","es6","eslint","html","html5","javascript","prettier","react","storybook","styleguide","stylelint","typescript","ui","ui-components"],"created_at":"2024-12-06T17:16:20.500Z","updated_at":"2025-08-02T20:30:35.139Z","avatar_url":"https://github.com/kickstartDS.png","language":"MDX","funding_links":[],"categories":["MDX"],"sub_categories":[],"readme":"# kickstartDS\n\nkickstartDS is an Open Source Design System starter and UI toolkit for building up your very own Design System. This in turn enables you, and your team, to build brand-compliant websites and apps super efficiently. All while using core web technologies — HTML, CSS, and JavaScript — and best practices.\n\n![Own a Design System without investing years of development - Next-gen UI development toolkit to democratize Design Systems](assets/own-a-design-system.png)\n\n## Goals\n\n- Great components as the baseline\n- Enable flexible + easy design application\n- First-class React templating support\n- Work with \"classic\" backend environments, too\n- Jamstack \u0026 composable integrations\n\n## Documentation\n\nWe started work on extensive documentation around **kickstartDS**, the best practices employed, ways of creating components and integrations available. We will continuously expand on this, so please let us know what you're missing!\n\n### Categories\n\nWe have the following categories in our docs:\n\n- [**Getting Started**](https://www.kickstartds.com/docs/intro/): intro to **kickstartDS**, its requirements and basic usage\n- [**Foundations**](https://www.kickstartds.com/docs/foundations/): explanations for all basic building blocks like token, components and layout\n- [**Integration**](https://www.kickstartds.com/docs/integration/): available integrations that can take work off your shoulders\n- [**Guides**](https://www.kickstartds.com/docs/guides/): main Design System setup guide, and guides around specific component workflows\n- **Concepts** (coming soon): Background articles about the concepts involved, like **Semantic Token**, **JSON Schema**, and the likes\n\n### Create your Design System guide\n\nThis is our main guide, where you'll create a complete Design System from scratch... based on **kickstartDS**.\n\n![Open Source framework for Design System creation in just 5 steps: 1. Start your Design System, 2. Design application, 3. Configure details, 4. Add components, 5. Publish your Design System](assets/github_readme2.png)\n\nStart here: https://www.kickstartds.com/docs/guides/create/\n\nOr jump directly into a specific section of it:\n\n1. [Start your Design System](https://www.kickstartds.com/docs/guides/create/start)\n2. [Design Application](https://www.kickstartds.com/docs/guides/create/design)\n3. [Configure Storybook](https://www.kickstartds.com/docs/guides/create/storybook)\n4. [Add Components](https://www.kickstartds.com/docs/guides/create/components)\n5. [Publish your Design System](https://www.kickstartds.com/docs/guides/create/publish)\n\n## kickstartDS CLI\n\nWe have a dedicated CLI, you can find it over here:\u003cbr/\u003e\nhttps://github.com/kickstartDS/kickstartDS-cli\n\nOur CLI helps deliver everyday tasks faster, and with less errors! Create and compile token, work with **JSON Schema** and other parts of **kickstartDS**.\n\nLearn more about our CLI in our docs:\u003cbr/\u003e\nhttps://www.kickstartds.com/docs/intro/cli\n\n## Tooling\n\nNo modern technical solutions exists in a vacuum. Having a lively ecosystem enables broader and quicker adoption, while sharing knowledge and common learnings with a wider, organic community.\n\nThis is why we're also always actively trying to add building blocks to that ecosystem ourselves, while listening closely to which problems people are actually trying to solve.\n\nWe already have the following in place:\n\n- Generator (to convert your component **JSON Schema** into a variety of different formats, including component **TypeScript** types)\n- **Gatsby** Theme (to enable low-code integration of your Design System into your website)\n- **Next.js** helper (to smooth out development of **Next.js** based apps and interfaces with **kickstartDS**)\n- **GraphQL** tooling (to generate **GraphQL** types, fragments, amongst others matching your components and their documentation)\n\nLearn more about generators on our integration page:\u003cbr/\u003e\nhttps://www.kickstartds.com/integrations/\n\nOr read our documentation about tooling and integrations:\u003cbr/\u003e\nhttps://www.kickstartds.com/docs/integration/\n\n## Community\n\nWe try to have a healthy, friendly and active community. Although it's still quite small, this also enables us to respond to requests in a very hands-on fashion.\n\nFeel free to [join us on Discord](https://discord.gg/mwKzD5gejY)!\n\nIf that's not your cup of tea, you can also reach out to us:\n\n- by [writing us an email](mailto:hello@kickstartds.com)\n- by [joining us on Twitter](https://twitter.com/intent/follow?screen_name=kickstartDS)\n- by [writing us on WhatsApp](https://wa.me/491752131879?text=Hi!%20I%20am%20interested%20to%20know%20more%20about%20kickstartDS.)\n\n## Development\n\nThis project is managed by [lerna](https://lernajs.io/). Each module is an independent lerna package. Install module-specific dependencies only via `lerna add` (see \"Install npm dependencies\" section)!\n\n### Requirements\n\n#### Environment\n\n- [node](https://nodejs.org/en/) \u003e= v14 – if you have [nvm](https://github.com/creationix/nvm#node-version-manager---) installed, you can just run `nvm use` to select the right node version.\n\n- [yarn](https://classic.yarnpkg.com/lang/en/) classic\n\n#### Global npm packages\n\n- [commitizen](http://commitizen.github.io/cz-cli/) – Constistent commit messages. Read more about the commit conventions in the \"Commit changes\"-section.\n\n`npm install -g lerna commitizen`\n\nIf you cannot or don't want to install global packages, you can use yarn. E.g. instead of `git cz`, you can also call `yarn git-cz`.\n\n### Locally\n\n#### Installation\n\n- `yarn` - installs npm dependencies for all frontend modules\n\n#### Scripts\n\n- `yarn build` – builds the pattern library\n- `yarn storybook start` - starts a storybook with all components\n- `yarn lint` – checks sass- \u0026 js-files against potential errors\n- `yarn list` – lists all lerna packages\n\n### Release\n\nReleases are mangaged by [Auto](https://intuit.github.io/auto/index).\n\n### Module Development\n\nAll modules are placed in the _pacakges/components_ directory. They are individual npm packages mangaged by [yarn workspaces](https://classic.yarnpkg.com/en/docs/workspaces).\n\n#### Install npm dependencies\n\nDon't install module dependencies manually, let yarn do the job!\nE.g. to install \"package-xy\" in module \"news\", run `yarn workspace news add package-xy` in the projects root directory.\n\n### Commit changes\n\nThis project uses [commitizen](http://commitizen.github.io/cz-cli/). So in order to commit your changes, run `git cz` (or `yarn git-cz` if commitizen is not installed globally) instead of `git commit`. commitizen will then ask you a few questions about the change:\n\n- **type** – The type of the change (e.g. feature, fix, refactoring)\n- **scope** - The name of the module affected (e.g. base, products, news)\n- **ticket number** – The JIRA ticket id\n- **subject** - Contains a succinct description of the change\n  - use the imperative, present tense: \"change\" not \"changed\" nor \"changes\"\n  - don't capitalize the first letter\n  - no dot (.) at the end\n- **body** - Just as in the subject, use the imperative, present tense. The body should include the motivation for the change and contrast this with previous behavior\n- **breaking changes** – Description of the change, justification and migration notes\n\nThis convention is based loosely on the [angular commit message guidlines](https://github.com/angular/angular/blob/master/CONTRIBUTING.md#-commit-message-guidelines) and ensures constistent commit messages, so they can be automatically converted into a changelog.\n\n## Contributing\n\nUnless you explicitly state otherwise, any contribution intentionally submitted\nfor inclusion in the work by you, as defined in the Apache-2.0 license, shall be\ndual licensed as below, without any additional terms or conditions.\n\n## License\n\n\u0026copy; Copyright 2022 Jonas Ulrich, kickstartDS by ruhmesmeile GmbH [jonas.ulrich@kickstartds.com].\n\nThis project is licensed under either of\n\n- [Apache License, Version 2.0](https://www.apache.org/licenses/LICENSE-2.0) ([`LICENSE-APACHE`](LICENSE-APACHE))\n- [MIT license](https://opensource.org/licenses/MIT) ([`LICENSE-MIT`](LICENSE-MIT))\n\nat your option.\n\nThe [SPDX](https://spdx.dev) license identifier for this project is `MIT OR Apache-2.0`.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FkickstartDS%2FkickstartDS","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FkickstartDS%2FkickstartDS","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FkickstartDS%2FkickstartDS/lists"}