|
1 |
| -# Turborepo Design System starter with Changesets |
| 1 | +<p align="center"><a href="https://github.com/Handfish/ajel" target="_blank"><img src="https://raw.githubusercontent.com/Handfish/ajel/main/apps/docs/public/ajel2.svg" width="100" alt="Laravel Logo"></a></p> |
2 | 2 |
|
3 |
| -This is an official React design system starter powered by Turborepo. Versioning and package publishing is handled by [Changesets](https://github.com/changesets/changesets) and fully automated with GitHub Actions. |
| 3 | +<p align="center">Ajel is a <b>312 byte</b> set of functions that encourage you to handle errors in a way that is similar to Golang.</p> |
4 | 4 |
|
5 |
| -## Using this example |
| 5 | +<p align="center"> |
| 6 | +<a href="https://www.npmjs.com/ajel" target="_blank"><img src="https://img.shields.io/npm/v/ajel.svg" alt="NPM Version" /></a> |
| 7 | +<a href="https://www.npmjs.com/ajel" target="_blank"><img src="https://img.shields.io/npm/l/ajel.svg" alt="Package License" /></a> |
| 8 | +<a href="https://www.npmjs.com/ajel" target="_blank"><img src="https://img.shields.io/npm/dt/ajel.svg" alt="NPM Downloads" /></a> |
| 9 | +<a href="https://handfish.github.io/ajel" target="_blank"><img src="https://img.shields.io/badge/GitHub%20Pages-222222?style=for-the-badge&logo=GitHub%20Pages&logoColor=white" /></a> |
| 10 | +<a href="https://github.com/Handfish/ajel" target="_blank"><img src="https://img.shields.io/badge/GitHub-100000?style=for-the-badge&logo=github&logoColor=white" /></a> |
| 11 | +</p> |
6 | 12 |
|
7 |
| -Run the following command: |
8 | 13 |
|
9 |
| -```sh |
10 |
| -npx create-turbo@latest -e with-changesets |
11 |
| -``` |
12 |
| - |
13 |
| -## What's inside? |
14 |
| - |
15 |
| -This Turborepo includes the following: |
16 |
| - |
17 |
| -### Apps and Packages |
18 |
| - |
19 |
| -- `docs`: A placeholder documentation site powered by [Next.js](https://nextjs.org/) |
20 |
| -- `@ajel/core`: core React components |
21 |
| -- `@ajel/utils`: shared React utilities |
22 |
| -- `@ajel/tsconfig`: shared `tsconfig.json`s used throughout the monorepo |
23 |
| -- `@ajel/eslint-config`: ESLint preset |
24 | 14 |
|
25 |
| -Each package and app is 100% [TypeScript](https://www.typescriptlang.org/). |
| 15 | +# [ajel](https://handfish.github.io/ajel) |
26 | 16 |
|
27 |
| -### Utilities |
| 17 | +### Installation |
28 | 18 |
|
29 |
| -This Turborepo has some additional tools already setup for you: |
| 19 | +`yarn add ajel eslint-plugin-ajel` |
30 | 20 |
|
31 |
| -- [TypeScript](https://www.typescriptlang.org/) for static type checking |
32 |
| -- [ESLint](https://eslint.org/) for code linting |
33 |
| -- [Prettier](https://prettier.io) for code formatting |
| 21 | +`pnpm add ajel eslint-plugin-ajel` |
34 | 22 |
|
35 |
| -### Useful commands |
36 | 23 |
|
37 |
| -- `yarn build` - Build all packages and the docs site |
38 |
| -- `yarn dev` - Develop all packages and the docs site |
39 |
| -- `yarn lint` - Lint all packages |
40 |
| -- `yarn changeset` - Generate a changeset |
41 |
| -- `yarn clean` - Clean up all `node_modules` and `dist` folders (runs each package's clean script) |
| 24 | +### Example usage |
| 25 | +```typescript |
| 26 | +// Handling async functions that throw |
| 27 | +import { ajel } from 'ajel'; |
42 | 28 |
|
43 |
| -### Changing the npm organization scope |
| 29 | +async function main() { |
| 30 | + const [result, err] = await ajel(Promise.resolve('hello world')); |
44 | 31 |
|
45 |
| -The npm organization scope for this design system starter is `@ajel`. To change this, it's a bit manual at the moment, but you'll need to do the following: |
| 32 | + if (err) { |
| 33 | + return err; |
| 34 | + } |
46 | 35 |
|
47 |
| -- Rename folders in `packages/*` to replace `ajel` with your desired scope |
48 |
| -- Search and replace `ajel` with your desired scope |
49 |
| -- Re-run `yarn install` |
| 36 | + return result; |
| 37 | +} |
| 38 | +``` |
50 | 39 |
|
51 |
| -## Versioning and Publishing packages |
| 40 | +```typescript |
| 41 | +// Handling synchronous functions that throw |
| 42 | +import { sjel } from 'ajel'; |
52 | 43 |
|
53 |
| -Package publishing has been configured using [Changesets](https://github.com/changesets/changesets). Please review their [documentation](https://github.com/changesets/changesets#documentation) to familiarize yourself with the workflow. |
| 44 | +function main() { |
| 45 | + const [result, err] = sjel(JSON.parse)("{}"); |
54 | 46 |
|
55 |
| -This example comes with automated npm releases setup in a [GitHub Action](https://github.com/changesets/action). To get this working, you will need to create an `NPM_TOKEN` and `GITHUB_TOKEN` in your repository settings. You should also install the [Changesets bot](https://github.com/apps/changeset-bot) on your GitHub repository as well. |
| 47 | + if (err) { |
| 48 | + return err; |
| 49 | + } |
56 | 50 |
|
57 |
| -For more information about this automation, refer to the official [changesets documentation](https://github.com/changesets/changesets/blob/main/docs/automating-changesets.md) |
| 51 | + return result; |
| 52 | +} |
| 53 | +``` |
58 | 54 |
|
59 |
| -### npm |
| 55 | +`ajel` and `sjel` are a set of functions that return a tuple representing a potential result and a potential error. |
| 56 | +On success, the result item has value. On error, the error item has value. It's that simple. |
60 | 57 |
|
61 |
| -If you want to publish package to the public npm registry and make them publicly available, this is already setup. |
| 58 | +More interestingly, it comes with a series of linting tools to help enforce the paradigm available in the package `eslint-plugin-ajel` |
62 | 59 |
|
63 |
| -To publish packages to a private npm organization scope, **remove** the following from each of the `package.json`'s |
| 60 | +### Basic eslintrc |
64 | 61 |
|
65 |
| -```diff |
66 |
| -- "publishConfig": { |
67 |
| -- "access": "public" |
68 |
| -- }, |
| 62 | +```javascript |
| 63 | +{ |
| 64 | + plugins: ['ajel'], |
| 65 | + extends: [ |
| 66 | + 'plugin:ajel/recommended', |
| 67 | + ], |
| 68 | +} |
69 | 69 | ```
|
70 | 70 |
|
71 |
| -### GitHub Package Registry |
| 71 | +### What's inside this repo? |
72 | 72 |
|
73 |
| -See [Working with the npm registry](https://docs.github.com/en/packages/working-with-a-github-packages-registry/working-with-the-npm-registry#publishing-a-package-using-publishconfig-in-the-packagejson-file) |
| 73 | +#### Apps and Packages |
| 74 | + |
| 75 | +- `docs`: A placeholder documentation site powered by [Next.js](https://nextjs.org/) |
| 76 | +- `ajel`: The core library (function) |
| 77 | +- `eslint-plugin-ajel`: Eslint rules for proper usage and error handling paradigm |
| 78 | +- `benchmarks`: Testing ajel's performance against other methods |
0 commit comments