perf: use GitHub Action to build the document

also:

- typo: rename the folder `dist` to `icon`
- chore: remove README and built badges in the code

.github/workflows/main.yml

@@ -0,0 +1,32 @@
+name: Build badges
+on:
+  push:
+    branches:
+      - main
+concurrency: building
+jobs:
+  build:
+    runs-on: macos-latest
+    steps:
+      - uses: actions/checkout@v2
+        with:
+          fetch-depth: 1
+      - uses: actions/setup-node@v2-beta
+        with:
+          node-version: '16'
+      - name: Build
+        run: |
+          npm version
+          npm i --no-save --no-audit
+          npm link
+          badge -v
+          npm run build
+          echo 'node_modules' > .gitignore
+        env:
+          ACCESS_TOKEN: ${{secrets.ACCESS_TOKEN}}
+      - name: Deploy
+        uses: JamesIves/github-pages-deploy-action@v4.2.5
+        with:
+          single-commit: true
+          branch: docs
+          folder: .

.gitignore

@@ -35,4 +35,11 @@ node_modules
 # Editor
 .idea
 
+# Output Assets
+dist
+README.md
+README_dfc.md
+README_flat_square.md
+README_flat_square_dfc.md
+
 package-lock.json

part/introduction.md

@@ -10,7 +10,7 @@
 <br />
 <br />
 
-![npm](./src/npm.svg) ![cli](./src/cli.svg) ![javascript](https://img.shields.io/badge/%20%20JavaScript-%20%20%20%20730L-f1e05a.svg) ![html](https://img.shields.io/badge/%20%20HTML-%20%20%20%20164L-e34c26.svg)
+![npm](dist/npm.svg) ![cli](dist/cli.svg) ![javascript](https://img.shields.io/badge/%20%20JavaScript-%20%20%20%20730L-f1e05a.svg) ![html](https://img.shields.io/badge/%20%20HTML-%20%20%20%20164L-e34c26.svg)
 
 Alternative: [**default**](./README.md)<!-- @IGNORE PREVIOUS: link -->, [**flat-square**](./README_flat_square.md)<!-- @IGNORE PREVIOUS: link -->, [**dynamic-fore-color**](./README_dfc.md)<!-- @IGNORE PREVIOUS: link -->, [**dynamic-fore-color (flat_square)**](./README_flat_square_dfc.md)<!-- @IGNORE PREVIOUS: link -->.
 
@@ -40,10 +40,10 @@ sudo npm uninstall -g badges-cli
 
 As for how to create a badge and add it to the collection? There are some steps you may need to follow:
 
-1. Fork the repository
-2. Install `badges-cli`
-3. Create a logo with SVG formatted (**recommended**) or other formats like PNG. (_**The logo should be wrapped into a square, in another word, the width should be equal to the height, or it would have been horizontally squished.**_)
-4. Save the logo in the folder `dist`
+1. Fork the repository and checkout the `main` branch
+2. Install dependencies by running `npm i`
+3. Create a logo with SVG formatted (**recommended**) or other formats like PNG. (_**The logo should be wrapped into a square, in other words, the width should be equal to the height, or it would have been horizontally squished.**_)
+4. Save the logo in the folder `icon`
 5. Add data for your badge in the file `script/data.js`
     ```js
     const data = {
@@ -55,13 +55,12 @@ As for how to create a badge and add it to the collection? There are some steps
         },
     };
     ```
-5. Run the script by typing `npm run build`
+5. Run the command `npm run build` to build to test
 6. If successful, the readme file will be automatically updated
-7. Finally, push all updates and create a pull request for your change
-8. **Done!!**
+7. Finally, push the icon and modification of the data file and create a pull request for your change, the GitHub Action will build all for you, **Done!!**
 
-> Note that: so far haven't I thought out a perfect solution for calculating the width of text accurately yet, and it means that the text can not be aligned in some cases.
+> Note that: so far haven't thought out a perfect solution for calculating the width of text accurately yet, and it means that the text can not be aligned in some cases.
 
 *Note: if you like this project, feel free to buy me a swimming chance:*
 
-[![badges](./src/paypal.svg)](http://paypal.me/aleen42) [![badges](./src/patreon.svg)](https://www.patreon.com/aleen42) [![badges](./src/buymeacoffee.svg)](https://www.buymeacoffee.com/aleen42)
+[![badges](dist/paypal.svg)](http://paypal.me/aleen42) [![badges](dist/patreon.svg)](https://www.patreon.com/aleen42) [![badges](dist/buymeacoffee.svg)](https://www.buymeacoffee.com/aleen42)

script/setup.js

@@ -15,7 +15,7 @@
  *      - Author: aleen42
  *      - Description: a script for building README.md
  *      - Create Time: Apr 20th, 2017
- *      - Update Time: Apr 8th, 2021
+ *      - Update Time: Jan 30th, 2024
  *
  *
  **********************************************************************/
@@ -42,9 +42,11 @@ const execSync = require('child_process').execSync;
 const data = require('./sorted-data');
 
 const rootPath = './';
-const distPath = `${rootPath}dist/`;
-const outputPath = `${rootPath}src/`;
-const linkPath = 'https://badges.aleen42.com/src/';
+const inputPath = `${rootPath}icon/`;
+const outputPath = `${rootPath}dist/`;
+const linkPath = 'https://badges.aleen42.com/dist/';
+
+fs.existsSync(outputPath) || fs.mkdirSync(outputPath);
 
 const suffix = (base, ...suffix) => [base, ...suffix].filter(x => x).join('_');
 
@@ -70,7 +72,7 @@ const generateBadge = (style, dfc) => (name, badgeItem, index) => {
             `-c "${color}"`,
             `-s ${skin || 'dark'}`,
             `-t "${text || name}"`,
-            `-p ${distPath}${fname}`,
+            `-p ${inputPath}${fname}`,
             `--style=${style}`,
             `-o ${output}`,
         ].join(' ')}`, {