upgrade library (#11)

Author: InumberX

.github/release.yml

@@ -0,0 +1,16 @@
+changelog:
+  exclude:
+    authors:
+      - github-actions
+    labels:
+      - release
+  categories:
+    - title: New Features
+      labels:
+        - 'enhancement'
+    - title: Bug Fix
+      labels:
+        - 'bug'
+    - title: Other Changes
+      labels:
+        - '*'

.github/workflows/automation-pr-label.yml

@@ -0,0 +1,36 @@
+name: Automatically labeling pull request.
+
+on:
+  pull_request:
+    types: [opened]
+
+jobs:
+  auto-labeling-pr:
+    runs-on: ubuntu-latest
+
+    env:
+      GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+    steps:
+      - uses: actions/checkout@v2
+
+      # ラベル名を取得する
+      - name: Get label name
+        id: label_name
+        run: |
+          branch_type=$(echo ${{github.head_ref}} | cut -d "/" -f1)
+          if [ $branch_type == 'feature' ]; then
+            label_name=$(echo "enhancement")
+          elif [ $branch_type == 'bugfix' ] || [ $branch_type == 'hotfix' ]; then
+            label_name=$(echo "bug")
+          else
+            label_name=""
+          fi
+          echo "::set-output name=label_name::$label_name"
+
+      # PRにラベルを付与する
+      - name: Auto labeling
+        if: ${{ steps.label_name.outputs.label_name }}
+        run: |
+          number=$(echo $GITHUB_REF | sed -e 's/[^0-9]//g')
+          gh pr edit $number --add-label ${{ steps.label_name.outputs.label_name }}

.github/workflows/automation-release-note.yml

@@ -0,0 +1,49 @@
+name: Create release tag and release note.
+
+on:
+  push:
+    branches: [main]
+
+jobs:
+  create-release-tag:
+    runs-on: ubuntu-latest
+
+    env:
+      GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      TZ: 'Asia/Tokyo'
+
+    steps:
+      - uses: actions/checkout@v2
+
+      # 前回のりリースタグを取得する
+      - name: Get previous tag
+        id: pre_tag
+        run: |
+          echo "::set-output name=pre_tag::$(curl -H 'Accept: application/vnd.github.v3+json' -H 'Authorization: token ${{ secrets.GITHUB_TOKEN }}' https://api.github.com/repos/${{ github.repository }}/releases/latest | jq -r .tag_name)"
+
+      # タグを生成する 「{YYYY.MM.DD}-{当日リリース回数}」
+      - name: Generate release tag
+        id: release_tag
+        run: |
+          today=$(date +'%Y.%m.%d')
+          pre_release_date=$(echo ${{ steps.pre_tag.outputs.pre_tag }} | awk -F'-' '{print $1}')
+          pre_release_count=$(echo ${{ steps.pre_tag.outputs.pre_tag }} | awk -F'-' '{print $2}')
+          if [[ ! $pre_release_date = $today ]]; then
+            echo "init count"
+            pre_release_count=0
+          fi
+          echo "::set-output name=release_tag::v$today-$(($pre_release_count + 1))"
+
+      # 前回リリースからの差分をもとに、リリースノートの本文を生成する
+      - name: Generate release note
+        id: release_note
+        run: |
+          echo "::set-output name=release_note::$(curl -X POST -H 'Accept: application/vnd.github.v3+json' -H 'Authorization: token ${{ secrets.GITHUB_TOKEN }}' https://api.github.com/repos/${{ github.repository }}/releases/generate-notes -d '{"tag_name":"${{ steps.release_tag.outputs.release_tag }}", "previous_tag_name":"${{ steps.pre_tag.outputs.pre_tag }}"}' | jq .body | sed 's/"//g')"
+
+      # タグを切り、リリースノートを作成する
+      - name: Create Release
+        run: |
+          curl -X POST \
+            -H "Authorization: token ${{ secrets.GITHUB_TOKEN }}" \
+            -d "{ \"tag_name\": \"${{ steps.release_tag.outputs.release_tag }}\", \"name\": \"${{ steps.release_tag.outputs.release_tag }}\", \"body\": \"${{ steps.release_note.outputs.release_note }}\"}" \
+            https://api.github.com/repos/${{ github.repository }}/releases

.github/workflows/automation-release-pr.yml

@@ -0,0 +1,31 @@
+name: Create a pull request for release.
+
+on:
+  push:
+    branches: [develop]
+
+jobs:
+  create-release-pr:
+    runs-on: ubuntu-latest
+
+    env:
+      GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+    steps:
+      - uses: actions/checkout@v2
+
+      # リリース用PRが既に存在するかどうかをチェック
+      - name: Check if pr exists
+        id: check_pr
+        run: |
+          pr_title='Release'
+          base_branch='main'
+          echo "::set-output name=count::$(gh pr list -S ${pr_title}' in:title' -B $base_branch | wc -l)"
+          echo "::set-output name=pr_title::$pr_title"
+          echo "::set-output name=base_branch::$base_branch"
+
+      # リリース用PRを作成
+      - name: Create release pr
+        if: ${{ steps.check_pr.outputs.count == 0 }}
+        run: |
+          gh pr create -B ${{ steps.check_pr.outputs.base_branch }} -t ${{ steps.check_pr.outputs.pr_title }} -b "" -l "release"

.node-version

@@ -0,0 +1 @@
+18.13.0

README.md

@@ -1,3 +1,183 @@
 # Static Site Generator with Docker React
 
-[README](./static-site-generator)
+![GitHub release (with filter)](https://img.shields.io/github/v/release/InumberX/ssg-with-docker-react) ![GitHub Release Date - Published_At](https://img.shields.io/github/release-date/InumberX/ssg-with-docker-react) ![GitHub last commit (by committer)](https://img.shields.io/github/last-commit/InumberX/ssg-with-docker-react) ![GitHub issues](https://img.shields.io/github/issues/InumberX/ssg-with-docker-react) ![GitHub closed issues](https://img.shields.io/github/issues-closed/InumberX/ssg-with-docker-react) ![GitHub pull requests](https://img.shields.io/github/issues-pr/InumberX/ssg-with-docker-react) ![GitHub closed pull requests](https://img.shields.io/github/issues-pr-closed/InumberX/ssg-with-docker-react)
+
+## Development with Node.js
+
+Start a shell such as PoworShell and navigate to the root of the project.
+
+### Installing packages
+
+Install the Node.js package.
+
+```shell
+yarn install
+```
+
+### Execution of development tasks
+
+Execute the following command.
+
+```shell
+yarn dev
+```
+
+The following URL will take you to the screen.
+
+http://localhost:3000/
+
+- Press "Ctrl + C" to stop
+
+### Execution of Storybook
+
+Execute the following command.
+
+```shell
+yarn storybook
+```
+
+The following URL will take you to the screen.
+
+http://localhost:6006/
+
+- Press "Ctrl + C" to stop
+
+### Build
+
+Execute the following command to execute the build.
+
+```shell
+yarn build
+```
+
+### Syntax Check
+
+```shell
+yarn lint
+```
+
+### Formatter
+
+#### Check
+
+```shell
+yarn prettier
+```
+
+#### Check and Format
+
+```shell
+yarn prettier:fix
+```
+
+### Formatter (SCSS)
+
+#### Check
+
+```shell
+yarn stylelint
+```
+
+#### Check and Format
+
+```shell
+yarn stylelint:fix
+```
+
+## Development with Docker
+
+Start a shell such as PoworShell and navigate to the root of the project.
+
+### Launching Containers
+
+The container is started by executing the following command.
+
+```shell
+docker compose up -d
+```
+
+### Installing packages
+
+Install the Node.js package.
+
+```shell
+docker compose exec node yarn install
+```
+
+### Execution of development tasks
+
+Execute the following command.
+
+```shell
+docker compose exec node yarn dev
+```
+
+The following URL will take you to the screen.
+
+http://localhost:3000/
+
+- Press "Ctrl + C" to stop
+
+### Execution of Storybook
+
+Execute the following command.
+
+```shell
+docker compose exec node yarn storybook
+```
+
+The following URL will take you to the screen.
+
+http://localhost:6006/
+
+- Press "Ctrl + C" to stop
+
+### Build
+
+Execute the following command to execute the build.
+
+```shell
+docker compose exec node yarn build
+```
+
+### Stopping Containers
+
+Execute the following command to stop the container.
+
+```shell
+docker compose down
+```
+
+### Syntax Check
+
+```shell
+docker compose exec frontend yarn lint
+```
+
+### Formatter
+
+#### Check
+
+```shell
+docker compose exec frontend yarn prettier
+```
+
+#### Check and Format
+
+```shell
+docker compose exec frontend yarn prettier:fix
+```
+
+### Formatter (SCSS)
+
+#### Check
+
+```shell
+docker compose exec frontend yarn stylelint
+```
+
+#### Check and Format
+
+```shell
+docker compose exec frontend yarn stylelint:fix
+```

static-site-generator/.eslintignore

@@ -0,0 +1,58 @@
+{
+  "env": {
+    "browser": true,
+    "es2021": true,
+    "node": true
+  },
+  "extends": [
+    "plugin:react/recommended",
+    "standard",
+    "plugin:@typescript-eslint/recommended",
+    "plugin:@typescript-eslint/recommended-requiring-type-checking",
+    "prettier"
+  ],
+  "parser": "@typescript-eslint/parser",
+  "parserOptions": {
+    "ecmaFeatures": {
+      "jsx": true
+    },
+    "ecmaVersion": "latest",
+    "sourceType": "module",
+    "project": "./tsconfig.json"
+  },
+  "plugins": ["react", "@typescript-eslint"],
+  "rules": {
+    "semi": [2, "never"],
+    "indent": [
+      "off",
+      2,
+      {
+        "SwitchCase": 1,
+        "offsetTernaryExpressions": true
+      }
+    ],
+    "import/no-extraneous-dependencies": ["off"],
+    // function-componentの書き方の定義
+    "react/function-component-definition": [
+      2,
+      {
+        "namedComponents": "arrow-function",
+        "unnamedComponents": "arrow-function"
+      }
+    ],
+    // オブジェクトスプレッド記法を許可
+    "react/jsx-props-no-spreading": ["off"],
+    // Reactのimportを明記しなくても良いことを許可
+    "react/react-in-jsx-scope": ["off"],
+    "@typescript-eslint/no-misused-promises": [
+      "error",
+      {
+        "checksVoidReturn": {
+          "attributes": false
+        }
+      }
+    ],
+    "@typescript-eslint/no-unsafe-member-access": "warn"
+  },
+  "ignorePatterns": [".eslintrc.*"]
+}