diff --git a/.github/ISSUE_TEMPLATE/1_bug_report.yaml b/.github/ISSUE_TEMPLATE/1_bug_report.yaml index fb6cbc1cb..3b17826ac 100644 --- a/.github/ISSUE_TEMPLATE/1_bug_report.yaml +++ b/.github/ISSUE_TEMPLATE/1_bug_report.yaml @@ -7,7 +7,7 @@ body: - type: markdown attributes: value: | - Before reporting a bug or a documentation error, please [check if the issue already exists](https://github.com/deven-org/B01LER-Kitchen/issues). + Before reporting a bug or a documentation error, please [check if the issue already exists](https://github.com/deven-org/boiler/issues). --- @@ -56,7 +56,7 @@ body: id: terms attributes: label: Code of Conduct - description: By submitting this issue, you agree to follow our [Code of Conduct](https://github.com/deven-org/B01LER-Kitchen/blob/develop/CODE_OF_CONDUCT.md) + description: By submitting this issue, you agree to follow our [Code of Conduct](https://github.com/deven-org/boiler/blob/develop/docs/CODE_OF_CONDUCT.md) options: - label: I agree to follow this project's Code of Conduct required: true diff --git a/.github/ISSUE_TEMPLATE/2_feature_request.yaml b/.github/ISSUE_TEMPLATE/2_feature_request.yaml index dc771d332..b4a5e8ba0 100644 --- a/.github/ISSUE_TEMPLATE/2_feature_request.yaml +++ b/.github/ISSUE_TEMPLATE/2_feature_request.yaml @@ -7,7 +7,7 @@ body: - type: markdown attributes: value: | - Before opening a feature request, please [check if the request already exists](https://github.com/deven-org/B01LER-Kitchen/issues). + Before opening a feature request, please [check if the request already exists](https://github.com/deven-org/boiler/issues). - type: textarea id: description attributes: @@ -23,7 +23,7 @@ body: id: terms attributes: label: Code of Conduct - description: By submitting this issue, you agree to follow our [Code of Conduct](https://github.com/deven-org/B01LER-Kitchen/blob/develop/CODE_OF_CONDUCT.md) + description: By submitting this issue, you agree to follow our [Code of Conduct](https://github.com/deven-org/boiler/blob/develop/docs/CODE_OF_CONDUCT.md) options: - label: I agree to follow this project's Code of Conduct required: true diff --git a/.github/ISSUE_TEMPLATE/3_custom_issue.yaml b/.github/ISSUE_TEMPLATE/3_custom_issue.yaml index cff98e778..8f5b44188 100644 --- a/.github/ISSUE_TEMPLATE/3_custom_issue.yaml +++ b/.github/ISSUE_TEMPLATE/3_custom_issue.yaml @@ -6,7 +6,7 @@ body: - type: markdown attributes: value: | - Before creating an issue please [check if the issue already exists](https://github.com/deven-org/B01LER-Kitchen/issues). + Before creating an issue please [check if the issue already exists](https://github.com/deven-org/boiler/issues). - type: textarea id: description attributes: @@ -47,7 +47,7 @@ body: id: terms attributes: label: Code of Conduct - description: By submitting this issue, you agree to follow our [Code of Conduct](https://github.com/deven-org/B01LER-Kitchen/blob/develop/CODE_OF_CONDUCT.md) + description: By submitting this issue, you agree to follow our [Code of Conduct](https://github.com/deven-org/boiler/blob/develop/docs/CODE_OF_CONDUCT.md) options: - label: I agree to follow this project's Code of Conduct required: true diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml index f71f915c7..f7d167967 100644 --- a/.github/ISSUE_TEMPLATE/config.yml +++ b/.github/ISSUE_TEMPLATE/config.yml @@ -1,5 +1,5 @@ blank_issues_enabled: false contact_links: - name: Ask questions or give feedback - url: https://github.com/deven-org/B01LER-Kitchen/discussions + url: https://github.com/deven-org/boiler/discussions about: Start a discussion to ask questions or give feedback. diff --git a/README.md b/README.md index 67cb1c6bc..9466250a9 100644 --- a/README.md +++ b/README.md @@ -17,12 +17,15 @@ - [Questions, feedback or feature requests?](#questions-feedback-or-feature-requests) - [Report an issue](#report-an-issue) - [:gear: Requirements](#gear-requirements) + - [Figma](#figma) + - [Tokens Studio](#tokens-studio) - [:triangular_ruler: Architecture](#triangular_ruler-architecture) - - [:rocket: How to start](#rocket-how-to-start) + - [:arrow_forward: How to start](#arrow_forward-how-to-start) - [Installation](#installation) - [Setup](#setup) - - [Usage](#usage) - [:white_check_mark: How to test](#white_check_mark-how-to-test) + - [:toolbox: How to build](#toolbox-how-to-build) + - [:rocket: How to deploy](#rocket-how-to-deploy) - [:v: Contribute](#v-contribute) - [:page_facing_up: License](#page_facing_up-license) - [:green_heart: Code of conduct](#green_heart-code-of-conduct) @@ -82,7 +85,18 @@ Get to know about our Architecture [here](./docs/ARCHITECTURE.md). In addition, you might need to install Corepack. For more information checkout [Corepack Documentation](https://nodejs.org/api/corepack.html). -## :rocket: How to start + +### Figma +Figma is a collaborative tool used for designing user interfaces. Figma can be run on any operating system that can run a browser which can help designers, developers and various other stakeholders to collaborate seamlessly. Sharing designs, managing permissions on a granular level and requesting feedback are some of the many features that help teams work in a more agile fashion. + +### Tokens Studio +Tokens Studio for Figma (also known as Figma Tokens) is a plugin for Figma that allows users to integrate design tokens into their Figma designs. +Before you start working with B01LER Design System for Figma, make sure to install the Tokens Studio for Figma (Figma Tokens) plugin so you can access and customize the UI kit easily. + +The plugin allows both designers and developers to inspect tokens that have been applied to components. An overview of all tokens for a component can be viewed with deep inspect or the specific tokens used for the building blocks of a component can also be viewed + +## :arrow_forward: How to start + ### Installation > **Note:** You need to run terminal as administrator on Windows machines. @@ -100,7 +114,7 @@ In addition, you might need to install Corepack. For more information checkout [ $ git clone https://github.com/deven-org/boiler.git ``` -3. now we enable corepack for yarn and choose right version +3. Now we enable corepack for yarn and choose right version ```sh $ corepack enable @@ -119,14 +133,54 @@ In addition, you might need to install Corepack. For more information checkout [ $ yarn start ``` +> Note: This command will also open up Storybook locally. This provides you with a full list of available components that you can experiment with. Each component in Storybook also contains detailed documentation how to use them and the parameters that they can accept. + ### Setup -Note: This is not filled out yet! ... -### Usage -Note: This is not filled out yet! ... +> Note: To be able to edit tokens, you must own a pro license of token studio + +1. First, open your Copy of the B01LER and bookmark Tokens Studio in the Plugins panel. +2. Launch Tokens Studio using 'New Empty File' since no tokens have been defined yet. +3. Connect your repository to Tokens Studio. First, generate and copy a new Personal Access Token in Github. You can use either Tokens (Classic) or 'Fine-grained tokens'. Next, use the copied token to add GitHub as a Sync Provider. Click the 'Settings tab' in Tokens Studio and in the 'Add new menu', select GitHub. Use the Personal Token that you copied to authenticate yourself and to connect your cloned B01LER repository. +4. If the entered credential are correct you will be asked to Pull from git. Please accept this dialog. The tokens tab should now contain all tokens sets of B01LER available. + +Please refer to the 'Getting Started' section in our [Figma file](https://www.figma.com/file/kG44mSWhEp2VcMvMqbJrRY/B01LER-%5Bv0.2--alpha-release%5D?type=design&node-id=1134%3A44297&mode=design&t=ZatzD7omF9pxalvP-1) (the link to the Figma file above is exclusively for members of the Accenture organization, while those outside the organization can download the file [here](https://boilerds.com/B01LER%20[v0.2%20-alpha%20release].fig)) for more detailed instructions on how to set up the library, configure Figma Tokens Studio and customize the project assets to meet your requirements. + +The 'Getting Started' section also explains the logic behind our token names and enable you to find and change the right tokens when rebranding B01LER or when you want to extend or change some functionality of a component. ## :white_check_mark: How to test -Learn about our testing approach [here](./docs/TESTING.md). +Learn about our testing approach [here](./doc/TESTING.md). + +## :toolbox: How to build +> Note: Each command must be run from the root directory of the project + +The B01LER UI Library can be built using the following command: + + ```sh + $ yarn build:ui-library + ``` + +B01LER can also be built with Storybook bundled alongside it which provides you with a sandbox to experiment with our components: + + ```sh + $ yarn build:storybook + ``` + +B01LER comes with an example vanilla JS application to demonstrate how easy it is to use components in your app. To build this example app, run the following command: + + ```sh + $ yarn build:js-example + ``` + +In the generated `dist` folder, the generated `index.html` file can be opened in the browser to preview our components. + +## :rocket: How to deploy +Learn about our approach to deployment [here](./doc/DEPLOYMENT.md). + +## :building_construction: How to develop +Note: This is not filled out yet! +... + ## :v: Contribute For a detailed documentation on how to contribute to the B01LER project, have a look at our [contribution guide](./docs/CONTRIBUTING.md). diff --git a/docs/ARCHITECTURE.md b/docs/ARCHITECTURE.md index 4e56d7b2b..d03ae3ea0 100644 --- a/docs/ARCHITECTURE.md +++ b/docs/ARCHITECTURE.md @@ -77,4 +77,4 @@ In addition to components and styles, the design system includes detailed guidel Figma plays an essential role in our product development, as B01LER relies heavily on its functionalities. It serves as the platform for our design assets, including the component designs. Moreover, we utilize the [tokens studio plugin](https://www.figma.com/community/plugin/843461159747178978) within Figma to manage and update our design tokens effectively. Figma allows our team to create, share, and collaborate on designs in real-time, streamlining the design process and facilitating cross-functional collaboration. ## Contributing -Contributions to the design system are welcome! If you have suggestions for new components, styles, or guidelines, please open an issue or submit a pull request. Your contributions help improve the consistency and quality of our user interfaces. Before opening a [bug report](https://github.com/deven-org/B01LER-Kitchen/issues/new?assignees=&labels=%F0%9F%9A%A8+new%3A%3Abug&projects=deven-org%2F3&template=1_bug_report.yaml&title=%5BBug%5D%3A+) or a [feature request](https://github.com/deven-org/B01LER-Kitchen/issues/new?assignees=&labels=%F0%9F%9A%A8+new%3A%3Aenhancement&projects=deven-org%2F3&template=2_feature_request.yaml&title=%5BFeature+Request%5D%3A+) please check out our [contribution guide](CONTRIBUTING.md) and our [code of conduct](CODE_OF_CONDUCT.md). In case you discover a security vulnerability please review our [security policy](SECURITY.md) for more details on how to report it. +Contributions to the design system are welcome! If you have suggestions for new components, styles, or guidelines, please open an issue or submit a pull request. Your contributions help improve the consistency and quality of our user interfaces. Before opening a [bug report](https://github.com/deven-org/boiler/issues/new?assignees=&labels=%F0%9F%9A%A8+new%3A%3Abug&projects=deven-org%2F3&template=1_bug_report.yaml&title=%5BBug%5D%3A+) or a [feature request](https://github.com/deven-org/boiler/issues/new?assignees=&labels=%F0%9F%9A%A8+new%3A%3Aenhancement&projects=deven-org%2F3&template=2_feature_request.yaml&title=%5BFeature+Request%5D%3A+) please check out our [contribution guide](CONTRIBUTING.md) and our [code of conduct](CODE_OF_CONDUCT.md). In case you discover a security vulnerability please review our [security policy](SECURITY.md) for more details on how to report it. diff --git a/docs/DEPLOYMENT.md b/docs/DEPLOYMENT.md index 710ca3bf3..7168b6e52 100644 --- a/docs/DEPLOYMENT.md +++ b/docs/DEPLOYMENT.md @@ -1,5 +1,11 @@ # Deployment -This chapter should provide the user with all needed information around the deployment of your project. Please provide a short introduction here. +This chapter should provide the user with all needed information around the deployment of your project. + +Currently, the B01LER project is getting deployed to [render.com](https://render.com) periodically. In the near future, we intend on implementing a more formal deployment schedule so that the latest version of the project will be available to view and interact with. + +The project can be viewed [here](https://b01ler.onrender.com/). This link allows you to experiment with the project and learn about how you can use components via Storybook. + +We also deploy our JS Example app to [Render](https://b01ler.onrender.com/js-example-app). This application shows you how our components look when implemented in a vanilla Javascript application. ## Content - [Tooling](#tooling) @@ -28,4 +34,4 @@ If you have a release management setup in place, please describe the process and Please write down your deployment schedule. Consider using screenshots or graphs for better visualization. ## Support -If someone needs support while deploying your project, please list the possible contact persons or communication channels where people can get support. \ No newline at end of file +If support is needed while deploying BO1LER, please refer to our [README feedback section](/README.md#tipping_hand_person-help--feedback) where we list the many ways that we can be reached to support you. diff --git a/package.json b/package.json index f80f22944..5ac7bedca 100644 --- a/package.json +++ b/package.json @@ -29,7 +29,7 @@ }, "repository": { "type": "git", - "url": "git+https://github.com/deven-org/BO1LER-Kitchen.git" + "url": "git+https://github.com/deven-org/boiler.git" }, "private": true, "workspaces": [ @@ -38,9 +38,9 @@ "author": "", "license": "MIT", "bugs": { - "url": "https://github.com/deven-org/BO1LER-Kitchen/issues" + "url": "https://github.com/deven-org/boiler/issues" }, - "homepage": "https://github.com/deven-org/BO1LER-Kitchen#readme", + "homepage": "https://github.com/deven-org/boiler#readme", "devDependencies": { "@babel/core": "^7.23.0", "@babel/plugin-proposal-decorators": "^7.23.0",