[add] GitHub repository settings & Best Practice document (#31)

.github/settings.yml

@@ -0,0 +1,85 @@
+# These settings are synced to GitHub by https://probot.github.io/apps/settings/
+
+repository:
+  allow_merge_commit: false
+
+  delete_branch_on_merge: true
+
+  enable_vulnerability_alerts: true
+
+labels:
+  - name: bug
+    color: '#d73a4a'
+    description: Something isn't working
+
+  - name: documentation
+    color: '#0075ca'
+    description: Improvements or additions to documentation
+
+  - name: duplicate
+    color: '#cfd3d7'
+    description: This issue or pull request already exists
+
+  - name: enhancement
+    color: '#a2eeef'
+    description: Some improvements
+
+  - name: feature
+    color: '#16b33f'
+    description: New feature or request
+
+  - name: good first issue
+    color: '#7057ff'
+    description: Good for newcomers
+
+  - name: help wanted
+    color: '#008672'
+    description: Extra attention is needed
+
+  - name: invalid
+    color: '#e4e669'
+    description: This doesn't seem right
+
+  - name: question
+    color: '#d876e3'
+    description: Further information is requested
+
+  - name: wontfix
+    color: '#ffffff'
+    description: This will not be worked on
+
+branches:
+  - name: main
+    # https://docs.github.com/en/rest/reference/repos#update-branch-protection
+    protection:
+      # Required. Require at least one approving review on a pull request, before merging. Set to null to disable.
+      required_pull_request_reviews:
+        # The number of approvals required. (1-6)
+        required_approving_review_count: 1
+        # Dismiss approved reviews automatically when a new commit is pushed.
+        dismiss_stale_reviews: true
+        # Blocks merge until code owners have reviewed.
+        require_code_owner_reviews: true
+        # Specify which users and teams can dismiss pull request reviews.
+        # Pass an empty dismissal_restrictions object to disable.
+        # User and team dismissal_restrictions are only available for organization-owned repositories.
+        # Omit this parameter for personal repositories.
+        dismissal_restrictions:
+          # users: []
+          # teams: []
+      # Required. Require status checks to pass before merging. Set to null to disable
+      required_status_checks:
+        # Required. Require branches to be up to date before merging.
+        strict: true
+        # Required. The list of status checks to require in order to merge into this branch
+        contexts: []
+      # Required. Enforce all configured restrictions for administrators.
+      # Set to true to enforce required status checks for repository administrators.
+      # Set to null to disable.
+      enforce_admins: true
+      # Prevent merge commits from being pushed to matching branches
+      required_linear_history: true
+      # Required. Restrict who can push to this branch.
+      # Team and user restrictions are only available for organization-owned repositories.
+      # Set to null to disable.
+      restrictions: null

.github/workflows/deploy-production.yml

@@ -20,7 +20,7 @@ jobs:
       packages: write
       contents: read
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       - name: Inject Environment variables
         run: |

.github/workflows/pull-request.yml

@@ -13,7 +13,7 @@ jobs:
     permissions:
       contents: write
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
         if: ${{ env.VERCEL_TOKEN && env.VERCEL_ORG_ID && env.VERCEL_PROJECT_ID }}
 
       - name: Deploy to Vercel

Dockerfile

@@ -8,14 +8,15 @@ COPY . /app
 WORKDIR /app
 
 FROM base AS prod-deps
-RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm install --prod --frozen-lockfile
+RUN --mount=type=cache,id=pnpm,target=/pnpm/store  pnpm i --P --frozen-lockfile --ignore-scripts
 
 FROM base AS build
-RUN --mount=type=cache,id=pnpm,target=/pnpm/store pnpm install --frozen-lockfile
+RUN --mount=type=cache,id=pnpm,target=/pnpm/store  pnpm i --frozen-lockfile
 RUN pnpm build
 
 FROM base
-COPY --from=prod-deps /app/node_modules /app/node_modules
-COPY --from=build /app/.next /app/.next
+COPY --from=prod-deps /app/node_modules ./node_modules
+COPY --from=build /app/public ./public
+COPY --from=build /app/.next ./.next
 EXPOSE 3000
 CMD ["npm", "start"]

README.md

@@ -4,17 +4,16 @@
 
 [![CI & CD](https://github.com/idea2app/Next-Bootstrap-ts/actions/workflows/main.yml/badge.svg)][7]
 
-[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)][8]
-[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)][9]
+[![Open in GitHub Codespaces](https://github.com/codespaces/badge.svg)][8] [![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)][9]
 
 ## Technology stack
 
-- Language: [TypeScript v5][2] + [MDX v3][11]
-- Component engine: [Nextjs v14][3]
-- Component suite: [Bootstrap v5][4]
-- PWA framework: [Workbox v6][5]
-- State management: [MobX v6][10]
-- CI / CD: GitHub [Actions][12] + [Vercel][13]
+- Language: [TypeScript v5][10] + [MDX v3][11]
+- Component engine: [Nextjs v14][12]
+- Component suite: [Bootstrap v5][13]
+- PWA framework: [Workbox v6][14]
+- State management: [MobX v6][15]
+- CI / CD: GitHub [Actions][16] + [Vercel][17]
 
 ## Major examples
 
@@ -23,6 +22,22 @@
 3. [Pagination table](pages/pagination.tsx)
 4. [Scroll list](pages/scroll-list.tsx)
 
+## Best practice
+
+1.  Install **[Settings][18] GitHub app** in your account or organization
+
+2.  Click the **[<kbd>Use this template</kbd>][19] button** on the top of this GitHub repository's home page, then create your own repository in the app-installed namespace above
+
+3.  Click the **[<kbd>Open in GitHub codespaces</kbd>][20] button** on the top of ReadMe file, then an **online VS Code development environment** will be started immediately
+
+4.  Set [Vercel variables][21] as [Repository secrets][22], then every commit will get an independent **Preview URL**
+
+5.  Recommend to add a [Notification step in GitHub actions][23] for your Team IM app
+
+6.  Remind the PMs & users of your product to submit **Feature/Enhancement** requests or **Bug** reports with [Issue forms][24] instead of IM messages or Mobile Phone calls
+
+7.  Collect all these issues into [Project kanbans][25], then create **Pull requests** & add `closes #issue_number` into its description for automation
+
 ## Getting Started
 
 First, run the development server:
@@ -36,26 +51,26 @@ Open http://localhost:3000 with your browser to see the result.
 
 You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
 
-[API routes][14] can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in `pages/api/hello.ts`.
+[API routes][26] can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in `pages/api/hello.ts`.
 
-The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes][14] instead of React pages.
+The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes][27] instead of React pages.
 
 ## Learn More
 
 To learn more about Next.js, take a look at the following resources:
 
-- [Next.js Documentation][15] - learn about Next.js features and API.
-- [Learn Next.js][16] - an interactive Next.js tutorial.
+- [Next.js Documentation][28] - learn about Next.js features and API.
+- [Learn Next.js][29] - an interactive Next.js tutorial.
 
-You can check out [the Next.js GitHub repository][17] - your feedback and contributions are welcome!
+You can check out [the Next.js GitHub repository][30] - your feedback and contributions are welcome!
 
 ## Deployment
 
 ### Vercel
 
-The easiest way to deploy your Next.js app is to use the [Vercel Platform][13] from the creators of Next.js.
+The easiest way to deploy your Next.js app is to use the [Vercel Platform][17] from the creators of Next.js.
 
-Check out our [Next.js deployment documentation][18] for more details.
+Check out our [Next.js deployment documentation][31] for more details.
 
 ### Docker
 
@@ -73,12 +88,25 @@ pnpm container
 [7]: https://github.com/idea2app/Next-Bootstrap-ts/actions/workflows/main.yml
 [8]: https://codespaces.new/idea2app/Next-Bootstrap-ts
 [9]: https://gitpod.io/?autostart=true#https://github.com/idea2app/Next-Bootstrap-ts
-[10]: https://github.com/mobxjs/mobx/tree/mobx4and5/docs
+[10]: https://www.typescriptlang.org/
 [11]: https://mdxjs.com/
-[12]: https://github.com/features/actions
-[13]: https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme
-[14]: https://nextjs.org/docs/api-routes/introduction
-[15]: https://nextjs.org/docs
-[16]: https://nextjs.org/learn
-[17]: https://github.com/vercel/next.js/
-[18]: https://nextjs.org/docs/deployment
+[12]: https://nextjs.org/
+[13]: https://getbootstrap.com/
+[14]: https://developers.google.com/web/tools/workbox
+[15]: https://mobx.js.org/
+[16]: https://github.com/features/actions
+[17]: https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme
+[18]: https://github.com/apps/settings
+[19]: https://github.com/new?template_name=Next-Bootstrap-ts&template_owner=idea2app
+[20]: https://codespaces.new/idea2app/Next-Bootstrap-ts
+[21]: https://github.com/idea2app/Next-Bootstrap-ts/blob/80967ed49045af9dbcf4d3695a2c39d53a6f71f1/.github/workflows/pull-request.yml#L9-L12
+[22]: https://github.com/idea2app/Next-Bootstrap-ts/settings/secrets/actions
+[23]: https://github.com/kaiyuanshe/kaiyuanshe.github.io/blob/bb4675a56bf1d6b207231313da5ed0af7cf0ebd6/.github/workflows/pull-request.yml#L32-L56
+[24]: https://github.com/idea2app/Next-Bootstrap-ts/issues/new/choose
+[25]: https://github.com/idea2app/Next-Bootstrap-ts/projects
+[26]: https://nextjs.org/docs/api-routes/introduction
+[27]: https://nextjs.org/docs/api-routes/introduction
+[28]: https://nextjs.org/docs
+[29]: https://nextjs.org/learn
+[30]: https://github.com/vercel/next.js/
+[31]: https://nextjs.org/docs/deployment

docker-compose.yml

@@ -6,11 +6,6 @@ networks:
 services:
   next-bootstrap-ts:
     image: idea2app/next-bootstrap-ts
-    environment:
-      - NODE_ENV=production
-      - PORT=3000
-    ports:
-      - 3000:3000
     networks:
       - idea2app
     healthcheck:

package.json

@@ -17,7 +17,7 @@
     "@editorjs/quote": "^2.6.0",
     "@mdx-js/loader": "^3.0.0",
     "@mdx-js/react": "^3.0.0",
-    "@next/mdx": "^14.0.3",
+    "@next/mdx": "^14.0.4",
     "copy-webpack-plugin": "^11.0.0",
     "editorjs-html": "^3.4.3",
     "idea-react": "^1.0.0-rc.30",
@@ -30,7 +30,7 @@
     "mobx-react": "~9.0.2",
     "mobx-restful": "^0.6.12",
     "mobx-restful-table": "^1.2.2",
-    "next": "^14.0.3",
+    "next": "^14.0.4",
     "next-pwa": "~5.6.0",
     "next-ssr-middleware": "^0.6.1",
     "next-with-less": "^3.0.1",
@@ -47,19 +47,18 @@
     "webpack": "^5.89.0"
   },
   "devDependencies": {
-    "@octokit/openapi-types": "^19.0.2",
+    "@octokit/openapi-types": "^19.1.0",
     "@types/lodash": "^4.14.202",
-    "@types/node": "^18.18.13",
-    "@types/react": "^18.2.38",
-    "eslint": "^8.54.0",
-    "eslint-config-next": "^14.0.3",
-    "eslint-config-prettier": "^9.0.0",
+    "@types/node": "^18.19.3",
+    "@types/react": "^18.2.45",
+    "eslint": "^8.55.0",
+    "eslint-config-next": "^14.0.4",
+    "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-simple-import-sort": "^10.0.0",
     "husky": "^8.0.3",
-    "lint-staged": "^15.1.0",
-    "prettier": "^3.1.0",
-    "ts-node": "^10.9.1",
-    "typescript": "~5.3.2"
+    "lint-staged": "^15.2.0",
+    "prettier": "^3.1.1",
+    "typescript": "~5.3.3"
   },
   "prettier": {
     "singleQuote": true,
@@ -78,7 +77,7 @@
     "start": "next start",
     "lint": "next lint",
     "test": "lint-staged  &&  npm run lint",
-    "pack-image": "docker build -t next-bootstrap-ts:latest .",
-    "container": "docker rm -f next-bootstrap-ts  &&  docker run --name next-bootstrap-ts -p 3000:3000 -d next-bootstrap-ts:latest"
+    "pack-image": "docker build -t idea2app/next-bootstrap-ts:latest .",
+    "container": "docker rm -f next-bootstrap-ts  &&  docker run --name next-bootstrap-ts -p 3000:3000 -d idea2app/next-bootstrap-ts:latest"
   }
 }