From d1a4e7611c14b56fc920a7a1de415191a00c7d9f Mon Sep 17 00:00:00 2001 From: Nathan Vasse Date: Thu, 1 Dec 2022 14:50:15 +0100 Subject: [PATCH] =?UTF-8?q?=F0=9F=93=9D(global)=20add=20README.md?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Create a first version of README.md --- README.md | 73 +++++++++++++-------------------------- packages/tokens/README.md | 12 +++---- 2 files changed, 30 insertions(+), 55 deletions(-) diff --git a/README.md b/README.md index a23d2df..6642d29 100644 --- a/README.md +++ b/README.md @@ -1,73 +1,48 @@ -# Turborepo starter +`# Cunningham, the best OpenSource Design System` -This is an official Yarn v1 starter turborepo. +[![CircleCI](https://circleci.com/gh/openfun/cunningham/tree/master.svg?style=svg)](https://circleci.com/gh/openfun/richie/tree/master) -## What's inside? +## Getting started -This turborepo uses [Yarn](https://classic.yarnpkg.com/) as a package manager. It includes the following packages/apps: +Packages are not published yet, but once it is done we will show people how to install packages. -### Apps and Packages +## Development -- `docs`: a [Next.js](https://nextjs.org/) app -- `web`: another [Next.js](https://nextjs.org/) app -- `ui`: a stub React component library shared by both `web` and `docs` applications -- `eslint-config-custom`: `eslint` configurations (includes `eslint-config-next` and `eslint-config-prettier`) -- `tsconfig`: `tsconfig.json`s used throughout the monorepo +### First start -Each package/app is 100% [TypeScript](https://www.typescriptlang.org/). - -### Utilities - -This turborepo has some additional tools already setup for you: - -- [TypeScript](https://www.typescriptlang.org/) for static type checking -- [ESLint](https://eslint.org/) for code linting -- [Prettier](https://prettier.io) for code formatting - -### Build - -To build all apps and packages, run the following command: +Install and build packages ``` -cd my-turborepo -yarn run build +make bootstrap ``` -### Develop - -To develop all apps and packages, run the following command: +And then run dev servers ``` -cd my-turborepo -yarn run dev +make dev ``` -### Remote Caching +Then, you will be able to access the demo app on `http://localhost:3200` and the React components package's Storybook on +`http://localhost:6006` -Turborepo can use a technique known as [Remote Caching](https://turbo.build/repo/docs/core-concepts/remote-caching) to share cache artifacts across machines, enabling you to share build caches with your team and CI/CD pipelines. +### Building -By default, Turborepo will cache locally. To enable Remote Caching you will need an account with Vercel. If you don't have an account you can [create one](https://vercel.com/signup), then enter the following commands: +In order to build all packages of this repo you just need to type the following command at the root of the monorepo. ``` -cd my-turborepo -npx turbo login +make build ``` -This will authenticate the Turborepo CLI with your [Vercel account](https://vercel.com/docs/concepts/personal-accounts/overview). +## Contributing -Next, you can link your Turborepo to your Remote Cache by running the following command from the root of your turborepo: +This project is intended to be community-driven, so please, do not hesitate to +get in touch if you have any question related to our implementation or design +decisions. -``` -npx turbo link -``` +We try to raise our code quality standards and expect contributors to follow +the recommandations from our +[handbook](https://openfun.gitbooks.io/handbook/content). -## Useful Links +## License -Learn more about the power of Turborepo: - -- [Pipelines](https://turbo.build/repo/docs/core-concepts/monorepos/running-tasks) -- [Caching](https://turbo.build/repo/docs/core-concepts/caching) -- [Remote Caching](https://turbo.build/repo/docs/core-concepts/remote-caching) -- [Filtering](https://turbo.build/repo/docs/core-concepts/monorepos/filtering) -- [Configuration Options](https://turbo.build/repo/docs/reference/configuration) -- [CLI Usage](https://turbo.build/repo/docs/reference/command-line-reference) +This work is released under the MIT License (see [LICENSE](./LICENSE)). \ No newline at end of file diff --git a/packages/tokens/README.md b/packages/tokens/README.md index cfcff26..09220f0 100644 --- a/packages/tokens/README.md +++ b/packages/tokens/README.md @@ -14,7 +14,7 @@ For example: ## Getting started -In this section we will install the library and generate the file that contains the design tokens of your app in order to +In this section we will install the library and generate the file that contains the design tokens of your app in order to make Cunningham's Design System yours! Install the lib @@ -35,7 +35,7 @@ module.exports = { }; ``` -In this configuration file you can overwrite all the default values of the design system. +In this configuration file you can overwrite all the default values of the design system. You can find the default values [here](./src/bin/cunningham.dist.js). Now add this script to your `package.json` @@ -50,13 +50,13 @@ Now add this script to your `package.json` ``` The cunningham CLI's main purpose is to build a ad-hoc CSS file that contains all your customized design tokens, -by taking into account your local configuration ( defined in the file that you previously created : `cunningham.cjs`, -it is worth mentioning that this file is optional, hence it will generate a file containing the default values of the +by taking into account your local configuration ( defined in the file that you previously created : `cunningham.cjs`, +it is worth mentioning that this file is optional, hence it will generate a file containing the default values of the design system ) > You can run `yarn run cunningham -h` to see the available options. -And in order to generate the tokens css file, run +And in order to generate the tokens css file, run ``` yarn build-theme @@ -76,7 +76,7 @@ It's all done! ## Use the design tokens -Design tokens variable are all present in the `cunningham-tokens.css` file. They are all prefixed with `--c` in order to +Design tokens variable are all present in the `cunningham-tokens.css` file. They are all prefixed with `--c` in order to avoid collision. Here is an example to make the text's color renders with the value of the primary color in `.my-element` matching elements