Frontend development CI flow

[metalalive]

Discussed in #35

^{Originally posted by metalalive November 19, 2023}
Hi @wingtkw ,
I am trying to build CI (continuous integration) flow for frontend app development for the issue #32,
this would help anyone (potential contributors) build the frontend development environment by themselves without too much hassle.
我正在嘗試為前端應用程式開發建立 CI 流程, 希望這能幫助任何人（潛在的貢獻者）自己建立前端開發環境，而不會遇到太多麻煩。

I have been working on this configuration file , but it failed to build next.js and run the linter.
我一直在編輯這個配置文件，但它無法構建“next.js”並運行linter

For build logs you can see the Actions in this github codebase ,

Can you please take a look at this :

• How to build next.js ? is there any file missing to upload to this codebase ? 如何建構“next.js”？目前的 github codebase 是否缺少任何檔案 ? (之前的code reviewers 似乎沒有注意到這一點)
• How to run eslint with npm or npx ? what is the correct setup for this ? 如何使用“npm”或“npx”運行“eslint”？正確的設定/命令是什麼 ?
• Also , would you consider to write a few simple test cases and run them with some commands ? 您會考慮編寫一些簡單的測試案例並使用一些命令來運行它們嗎 ?
  • like what backend developers did with poetry and pytest in Python
  • this could also help anyone (potential contributors) understand the code works well in some situations, without relying on just launching development server (e.g. npm run dev) 這還可以幫助任何人（潛在的貢獻者）了解程式碼在某些情況下運作良好，而無需僅依賴啟動 development server 然後手動測試

Thanks for reading,
I tried to leave messages to find other contributors (for frontend app) in somewhere else,
however, this github codebase lacks sufficient context, information, or even introduction about what to do, how they can build app,
that is why I start working on this first.
謝謝閱讀，
我嘗試留言以在其他地方找到其他貢獻者（前端應用程式），
然而，這個 github 程式碼庫缺乏足夠的上下文、信息，甚至缺乏關於要做什麼、如何構建應用程式的介紹，
這就是我首先開始研究這個的原因。

btw ,
I try to help out but I don't really dedicate to (or dive deep into) frontend development,
forgive me if these are dumb questions. :)

[metalalive]

@wingtkw , thanks for the work (as discussed in #35) , if there is not much game-related logic to test , we can postpone the unit-test portion in the CI flow until you start adding game application logic to the frontend code.

Here is what I will do

• merge / squash the commits in the branch experiment/frontend/ci-setup
• rename it to feature/frontend/ci-flow
• create PR , approve it, and finally merge to main branch

Any other question ?