From 4bf9eb463d03f01d5dabc2264172a9959cc46f06 Mon Sep 17 00:00:00 2001 From: Ben Liu Date: Sun, 5 Nov 2023 22:55:25 +0700 Subject: [PATCH 01/10] remove(homepage): roadmap from repo to wiki --- homepage/ROADMAP.md | 65 --------------------------------------------- 1 file changed, 65 deletions(-) delete mode 100644 homepage/ROADMAP.md diff --git a/homepage/ROADMAP.md b/homepage/ROADMAP.md deleted file mode 100644 index c9912eab..00000000 --- a/homepage/ROADMAP.md +++ /dev/null @@ -1,65 +0,0 @@ -# Roadmap - -## CMS integration - -### Stage 1 - -1. Integrate Netlify CMS (inprogress) -2. Writers are able to add/update/delete project cards and their details in Mandarin -3. Writers are able to add/update/delete project cards and their details in English - -#### Editor flow - -```mermaid -graph LR - E[Editor] -->|Decaf CMS UI| ANC[Add new card] --> |Save| G[Git repo] -``` - -Finished by Netlify CMS integration. - -#### Website genration flow - -```mermaid -graph LR - G[Git repo] --> |Read file| P[Card Parser] --> |Generate Props| CP[Card Page] -``` - -##### TODO - -1. Create Card parser to parse Markdown file to props for Card Page. - -- team will propose at least two solutions -- Discuss and choose one - -2. Design Card Page and scratch wireframe. As a reference, see the original [google site](https://sites.google.com/ocf.tw/openstarter/Game-Cards/) -3. Create Card Page and reuse most of the Component from the project. - -### Stage 2 - -1. Writers are able to add/update/delete job cards in Mandarin & English -2. Writers are able to add/update/delete event cards in Mandarin & English -3. Writers are able to update/delete home page in Mandarin -4. Writers are able to update/delete home page in English - -### Stage 3 - -1. Writers are able to add/update/delete posts in Mandarin & English -2. Writers are able to add/update Campaign page in Mandarin & English - -## Download materials - -### Stage 1 - -As a creator, I would like to notice downloaders how to use/fork the game materials so that our copyright will be persisted. -As a creator, I would like to announce how to use/fork the game materials so that our copyright will be persisted. -As a player, I would like to download the boardgames materials so that I can print out and play. - -### Stage 2 - -As a educator, I would like share my boardgame use cases to other educators in the community. -As a open source interested ppl, I would like to find a mentor so that I can join the OOS community easily. -(form -> claire rearrange -> forward to mentor) - -### Stage 3 - -As a fork game designer, I would like to fork my rule and share to the community. From 280c1dcacdf053e1ec6e4997c99cfbbf6dc09d41 Mon Sep 17 00:00:00 2001 From: Ben Liu Date: Sun, 5 Nov 2023 22:55:52 +0700 Subject: [PATCH 02/10] remove(boardgame): roadmap to wiki --- ROADMAP.md | 232 ----------------------------------------------------- 1 file changed, 232 deletions(-) delete mode 100644 ROADMAP.md diff --git a/ROADMAP.md b/ROADMAP.md deleted file mode 100644 index c24df0f2..00000000 --- a/ROADMAP.md +++ /dev/null @@ -1,232 +0,0 @@ -# Roadmap - -This is the living document capture the current area of focus, and what needs to be done before we are ready to online. - -* Areas that need help are marked with *[help needed]*. -* Stuff that team is working on is marked with *[T]*. - -## First release - -### Host Open Star Ter Village - -* [x] serve client build -* [x] refactor build folder under webapp/build - * [x] copy client build - * [x] copy server build and host both client pages and api requests -* [x] deploy to heroku -* [x] user can see the "click-to-deploy" button on the readme file when landed in the project - * [x] user can see the "click-to-deploy" button on the readme file with comprehensive information of the webapp project - * [x] As a developer, I would like to understand how the heroku works with Open Star Ter Village webapp project - -#### implementation - -* [x] heroku single application deployment - -#### End A Game - -* [ ] Assume first player is Game Master who can end the current game *[T]* -* [x] Replace Local game with Server game - -### Basic game logics - -* [x] Victory points -* [x] Action points -* [x] Action can be executed only once (mirrored action can bypass it) -* [ ] Player closed project may score extra victory points -* [ ] Migrate settle phase into action stage. Projects are immediately closed when they reach the requirements. Then Remove Settle phase. -* [ ] Activate and deactivate Event cards -* [ ] End game - -#### Action Stage - -* [x] Play Project cards - * [x] Basic play function - * [x] Fill in jobs - * [x] Play Job card with Project card (validate, check eligible included) - * [x] Reduce player action point (validate, check eligible included) - * [x] Reduce player worker token (validate, check eligible included) - * [ ] Player play project card may score victory points -* [x] Play Job cards - * [x] basic play function - * [x] Play Job card on an Active project (includes validation and eligibility check) - * [x] Deduct player action point (includes validation and eligibility check) - * [x] Deduct player worker token (includes validation and eligibility check) - * [ ] Recruit two ppl once (in the basic rule) -* [x] contribute owned projects - * [x] basic play function - * [ ] Contribute Owned projects value adjustment -* [x] contribute joined projects - * [x] basic play function - * [ ] Contribute Joined projects value adjustment -* [x] Remove and refill job cards -* [ ] Mirror - -Move interfaces: - -```ts -function createProject(G: G, ctx: ctx, projectCardIndex: number, jobCardIndex: number): void - -function recruit(G: G, ctx: ctx, jobCardIndex: number, activeProjectIndex: number): void - -function contributeOwnedProjects(G: G, ctx: ctx, contributions: { activeProjectIndex: number; jobName: JobName; value: number }[]): void - -function contributeOtherProjects(G: G, ctx: ctx, contributions: { activeProjectIndex: number; jobName: JobName; value: number }[]): void - -function refillJobremoveAndRefillJobs(G: G, ctx: ctx, jobCardIndices: number[]): void - -function mirror(G: G, ctx: ctx, actionName: string, ...params: any[]): void -``` - -#### Settle Stage - -> TODO: migrate into action stage. Projects closed immediately when fulfilled the requirements - -* [x] Close projects - -#### Discard Stage - -* [ ] Discard project cards - -Move interfaces: - -```ts -function discardProjectCards(G: G, ctx: ctx, projectIndices: number[]): void -``` - -#### Refill Stage - -* [x] Refill and End - * [x] Refill project cards - * [x] Refill action points - -Move interface: - -```ts -// inner function -function refillProject(): void {} - -// exposed function -function refillAndEnd(G: G, ctx: ctx): void -``` - -#### Unit tests - -* [ ] Find a proper game-flows and integration tests btw different game states *[T]* - * [ ] Survey boardgame.io unit tests use cases - * [ ] Find solution and proposal - -#### User Interface / User Experience - -![wireframe.png](./wireframe.png) - -* [x] Design UI flow scratch - * references as follows - * [stone age](https://boardgamearena.com/gamepanel?game=stoneage) - * [pandemic](https://boardgamearena.com/gamepanel?game=pandemic) - * [agricola](https://boardgamearena.com/gamepanel?game=agricola) -* [x] Decide Styling tools - - Note: Principle component guildline is fully decouple the styling component with layout components. - eg. ProjectCard (layout logic) depends on Card (Component with styles) - - * Tailwind: We would love to try new things (Fancier :rocket:) - * Styled component: We would love to try new things (Classic :tada:) - * SASS: Old school - * ~~Material UI~~ - * ~~Boostrap~~ - - Highly customised is our two project directions so Material UI and Bootstrap are not fit in our roadmap -* [x] Design client folder structure - 1. feature + style - * src/ - * features/ - * ResourceCard/ - * ?styled.jsx - * ProjectCard - * EventCard - * styled/ - * CardVertical - * CardHorizontal - * ?ResourceCard.styled.jsx - - 2. feature - * src/ - * features/ - * ResourceCard/ - * ResourceCard.jsx - * ResourceCard.styled.jsx - * ProjectCard/ - * ProjectCard.jsx - * ProjectCard.styled.jsx - * EventCard/ - - Folders should be structured by features (scenario 2) but it is viable to have common styled components such as Button, Tab, or Input collected in the common folder (styled foder in scenario 1). -* [x] Header -* [x] Table - * [x] Table Layout - * [x] Projct Card (read) -* [ ] Play Project cards *[T]* -* [ ] Play Job cards -* [ ] Contribute the projects - -### Apply New Rules - -* [x] Decouple Job and Force cards in Player Hand -* [x] Split Job and Force cards deck - -```ts -// inner function -function refillProject(): void {} -function refillJob(): void {} -function refillForce(): void {} -``` - -* [x] Move Job cards from Player Hand to Table -* [x] Refactor project cards -* [x] Add victory points -* [x] Refactor worker token on project card -* [x] Remove goal cards -* [x] Remove force cards from main game - -### Advanced game logics - -* [ ] Apply Basic Rule and Advanced Rule -* [ ] Build Open Star Tree - -#### Action Stage - -* [ ] Growth Open Star Tree - -### Expansions - -#### Core Logic - -* [ ] Build Force cards - -#### Action Stage - -* [ ] Play Force cards - -#### Discard Stage - -* [ ] Discard force cards - -#### Refill Stage - -* [x] Refill force cards - -```ts -function discardForceCards(G: G, ctx: ctx, forceIndices: number[]): void -// inner function -function refillForce(): void {} -``` - -## Tech improvement - -### dependency upgrade - -1. upgrade React 18 + Chakra UI 2 - -### Merge homepage branch to main branch - -Unify the tech stack From 6c23528f9b00792e14c6f6ac2c0819734f0c82da Mon Sep 17 00:00:00 2001 From: Ben Liu Date: Mon, 6 Nov 2023 01:44:18 +0700 Subject: [PATCH 03/10] doc: update readme and readme.en --- README.en.md | 82 ++++++++++++++++++++++++++++ README.md | 149 ++++++++++++++++++--------------------------------- 2 files changed, 133 insertions(+), 98 deletions(-) create mode 100644 README.en.md diff --git a/README.en.md b/README.en.md new file mode 100644 index 00000000..c45ec6a0 --- /dev/null +++ b/README.en.md @@ -0,0 +1,82 @@ +# Open StarTer Village + +We encourage more people to participate in the open-source community through this tabletop game, helping beginners quickly grasp open-source culture, project collaboration, and the benefits of open-source initiatives. This game, whether in its physical or online version, is open for everyone to use freely. + +## Game Overview + +### Game Objectives + +Through playing the game, players will come to understand: + +- The core values of open-source culture, including open definitions and the four fundamental freedoms. +- The advantages of open-source. +- The organization and functioning of open-source communities. +- How to participate in collaborative open-source projects. +- Important and interesting open-source, open-government, and open-data projects worldwide and in Taiwan. + +### Suitable Occasions + +- Events for introducing and initiating open-source culture, such as "Open Source Newbie 101" and "Open Source Tech Training Camp." +- Gatherings of open-source communities. +- Everyday entertainment. + +### Game Specifications + +- **Number of Players:** 3-6 players +- **Game Duration:** Approximately 60 minutes + +## How to Get Started + +### Open Game Rental + +If you're interested in renting the game, please send an email to for an application and include the game lending agreement. + +- [Game Rules and Rental Application Form](https://drive.google.com/drive/folders/16FZ0F8D32D4zWGBKwP13-fnf9gr-CZJz) + +### Open Game Server + +**Under Construction!** + +## How to Contribute + +We welcome contributions in various forms, even if you don't have programming skills. Your ideas are valuable. This project includes both physical and online versions. You can check the planning and progress of all projects on our wiki page. Any item marked with "[Assistance Required]" is open for contributions. + +### Find Issues? Solve Issues! + +If you have a GitHub account, feel free to report issues or suggest improvements on our [Issues](https://github.com/ocftw/open-star-ter-village/issues) page. +If you don't have a GitHub account, you can also discuss with us through [Discord](https://discord.gg/JnTHGnxwYS). + +### Want to Add New Features? + +If you have a GitHub account, you can suggest new features in our [Discussions](https://github.com/ocftw/open-star-ter-village/discussions) or provide your solutions directly through [Pull Requests](https://github.com/ocftw/open-star-ter-village/pulls). + +### Join the Discussion + +You can join our discussions on [Discord](https://discord.gg/JnTHGnxwYS). + +## Online Project Structure + +| Sub-Project | Description | +| ----------------------------------------------- | ----------------------------------------------- | +| [google-spreadsheet](./google-spreadsheet/) | Prototype - Presented using Google Spreadsheets | +| [client](./client/) | Web frontend - Game interface | +| [server](./server/) | Web backend - Handles room allocation, player state synchronization, and game logic | +| [packages/game](./packages/game/) | Web game logic - Manages game rules | +| [homepage](./homepage/) | [Official Website](https://openstartervillage.ocf.tw/) + +## Licensing Terms + +- **Game Content:** [CC BY 4.0 License](./LICENSE) +- **Code:** [MIT License](./LICENSE-CODE) + +## Learn More + +You can gain deeper insights into this project on our [Wiki Page](https://github.com/ocftw/open-star-ter-village/wiki). + +Additional Relevant Links: + +- [Discord](https://discord.gg/JnTHGnxwYS) +- [Game Rules and Rental Application Form](https://drive.google.com/drive/folders/16FZ0F8D32D4zWGBKwP13-fnf9gr-CZJz) +- [Educator's Toolkit](https://drive.google.com/drive/folders/1fLz5wBrNFWEx7FTmyTkAJUrPibU9UvWM) +- [Visual Materials](https://drive.google.com/drive/folders/1790me8hwJVJZpusIBtICdM2YOErbRIM5) +- [Discussion of Rulebook](https://docs.google.com/document/d/16LIiWzstcg6QAppXn18WT-NbrKLKv0oJmkvpyxBwZgk/edit?usp=sharing) diff --git a/README.md b/README.md index 60c61c6d..a7609209 100644 --- a/README.md +++ b/README.md @@ -1,131 +1,84 @@ -# 開源星手村 +# 開源星手村 - Open StarTer Village -我們希望能有更多人加入開源社群的行列，因此設計了這款桌上遊戲，希望讓初次接觸開源的人能快速了解開源社群；理解開源專案是如何在社群間協作，與認識開源所帶來的好處等。整個遊戲不論是出版品或是網路版，皆會釋出給每一個人自由使用。 +English version: [README.en.md](./README.en.md) -## 桌遊說明 +我們鼓勵更多人參與開源社群，透過這款桌上遊戲，幫助初學者快速了解開源文化、專案協作，以及開源所帶來的好處。此遊戲（不論是實體版或線上版）都是開放的，任何人都可以自由使用。 -### 桌遊目的 +## 遊戲概要 -讓初次接觸開源的人可以了解 +### 遊戲目標 -* 開源文化的內涵：開放定義、四大自由等 -* 開源的好處 -* 開源社群的運作 -* 開源專案如何協作 -* 世界/臺灣影響力重大或有趣的開放原始碼/開放政府/開放資料專案 +透過遊戲，玩家將了解： -### 桌遊適用場合 +- 開源文化的核心價值，包括開放定義和四大自由 +- 開源的優勢 +- 開源社群的組織和運作方式 +- 如何參與開源專案的協作 +- 世界以及台灣重要且有趣的開放原始碼、開放政府和開放資料專案 -* 介紹及入門開源文化的聚會(開源新手村/開源科技訓練營等) -* 開源社群聚會 -* 日常休閒遊玩 +### 適用場合 -### 遊戲人數 +- 用於介紹和入門開源文化的活動，例如開源新手村、開源科技訓練營等 +- 開源社群的聚會 +- 日常娛樂 -3-6人 +### 遊戲規格 -### 遊戲時數 +- **適用玩家人數：** 3-6人 +- **遊戲時間：** 約60分鐘 -約 60 分鐘 +## 如何開始 -## 現在開始玩 +### 開放遊戲租借 -### 開放遊戲伺服器 +如果您有興趣租借遊戲，請寄信至 進行申請，同時請附上遊戲出借同意書。 -建制中！ +- [遊戲規則與借用申請書](https://drive.google.com/drive/folders/16FZ0F8D32D4zWGBKwP13-fnf9gr-CZJz) -### 打造你自己的遊戲伺服器 +### 開放遊戲伺服器 -[![Deploy](https://www.herokucdn.com/deploy/button.svg)](https://heroku.com/deploy?template=https://github.com/ocftw/open-star-ter-village) +**建置中！** -## 參與貢獻 +## 如何參與 -### 開始參與 +我們歡迎各種形式的貢獻，即使您不具備程式能力，也歡迎分享您的想法。此專案有實體和線上兩個版本，您可以在我們的維基頁面上查看所有專案的規劃和進度，任何有 "[Assistance Required]" 標記的項目都歡迎您加入貢獻。 -我們歡迎您以任何形式參與，您甚至不用會寫程式，也能夠參與貢獻你的想法！目前專案有實體桌遊與線上桌遊兩個方向，實體桌遊會根據現有的規則設計與製作卡片、圖板並發行；線上桌遊最初呈現在Google表單以驗證遊戲可行性，目前團隊正在嘗試移植到網頁上，希望可以藉此推廣至更多人。 +### 發現問題？解決問題？ -#### 發現問題 +如果您有 GitHub 帳戶，歡迎在我們的 [Issues](https://github.com/ocftw/open-star-ter-village/issues) 頁面上回報問題或提出建議。 +如果您沒有 GitHub 帳戶，也歡迎透過我們的 [Discord](https://discord.gg/JnTHGnxwYS) 與我們討論。 -#### 解決問題 +### 想要增加新功能？ -#### 增加功能 +如果您有 GitHub 帳戶，歡迎在我們的 [Discussions](https://github.com/ocftw/open-star-ter-village/discussions) 中提出您的建議，或直接透過 [Pull Requests](https://github.com/ocftw/open-star-ter-village/pulls) 提供您的解決方案。 -* 參與卡片與圖板設計 -* [加入網頁版的開發](./WEBAPP) +### 加入討論 -#### 加入我們一起討論 +您可以透過我們的 [Discord](https://discord.gg/JnTHGnxwYS) 加入我們的討論。 -#### 專案架構 +## 線上專案架構 -| 資料夾 | 說明 | -| --- | --- | -| `google-spreadsheet` | 桌遊線上版的prototype - 以google spreadsheet呈現 | -| `client` | 桌遊網頁版的前端 - 遊戲介面 | -| `server` | 桌遊網頁版的後端 - 處理遊戲房的分配、同步不同使用者間的狀態與遊戲的處理核心 | -| `packages/game` | 桌遊網頁版的遊戲邏輯 - 處理遊戲的邏輯與規則 | -| `homepage` | 專案首頁 | +| 子專案 | 說明 | +| --------------------------------------------- | --------------------------------------------------- | +| [`google-spreadsheet`](./google-spreadsheet/) | 原型版本 - 以 Google Spreadsheet 呈現 | +| [`client`](./client/) | 網頁版前端 - 遊戲界面 | +| [`server`](./server/) | 網頁版後端 - 處理遊戲房間分配、同步玩家狀態和遊戲邏輯 | +| [`packages/game`](./packages/game/) | 網頁版遊戲邏輯 - 處理遊戲規則 | +| [`homepage`](./homepage/) | [官方網站 - Official Website](https://openstartervillage.ocf.tw/) ## 授權條款 -開源星手村的出版品、內容與資料夾內容以[創用CC姓名標示4.0](./LICENSE)授權。 - -開源星手村中的原始碼會以[MIT條款](./LICENSE-CODE)授權。 - -# open-star-ter-village - -An open source board game to encourage people join open source community. You can understand more about open source community by playing this board game. It helps you practice how the open source community cooperates on the projects and acknoledge the benefits provided by the open source projects. All game design and game system are published for everyone. - -## Board game summary - -### Design Idea - -### Players - -3 to 6 people - -### Playing time - -Around 60 minutes - -## Play it now - -### Public server - -NOT READY YET - -### Deploy your own game server - -[![Deploy](https://www.herokucdn.com/deploy/button.svg)](https://heroku.com/deploy?template=https://github.com/ocftw/open-star-ter-village) - -## Contributing - -### Start contributing now - -Any participation way is welcome. Coding is not required, just contribute your idea! Current project contains physical board game publish and online. We will publish the board game accroding to the latest game rules, card and board designs. The online game was proof of concept on Google Spreadsheet and it worked in a few trials with positive feedback. So we are migrating to webapp to encourge more people to play or join open source community. - -#### Open Issue - -#### Solve Issue - -#### Add Features - -* Join to design the card and board from scratch. -* [Join the webapp development](./WEBAPP) - -#### Join us in discussions - -#### Project structure +- **遊戲內容：** [創用CC姓名標示4.0授權](./LICENSE) +- **程式碼：** [MIT條款](./LICENSE-CODE) -| Folder | Description | -| --- | --- | -| `google-spreadsheet` | Prototype of online version of the board game - using google spreadsheet | -| `client` | Frontend of the web version of the board game - user interface | -| `server` | Backend of the web version of the board game - handle the room allocation, sync the game state between users and the core game logic | -| `packages/game` | Game logic of the web version of the board game - handle the game logic and rules | -| `homepage` | Project homepage | +## 進一步了解 -## License +您可以在我們的 [Wiki 頁面](https://github.com/ocftw/open-star-ter-village/wiki) 深入了解此專案。 -The open-star-ter-village in the assets, content, and data folders are licensed under a [CC-BY-License](./LICENSE). +其他相關連結： -All other codes in this repository is licensed under a [MIT-License](./LICENSE-CODE). +- [Discord](https://discord.gg/JnTHGnxwYS) +- [遊戲規則與借用申請書](https://drive.google.com/drive/folders/16FZ0F8D32D4zWGBKwP13-fnf9gr-CZJz) +- [教學工具包](https://drive.google.com/drive/folders/1fLz5wBrNFWEx7FTmyTkAJUrPibU9UvWM) +- [視覺素材](https://drive.google.com/drive/folders/1790me8hwJVJZpusIBtICdM2YOErbRIM5) +- [討論規則書](https://docs.google.com/document/d/16LIiWzstcg6QAppXn18WT-NbrKLKv0oJmkvpyxBwZgk/edit?usp=sharing) From 032e97244dfaee647512f3d200ba34b52ce215b1 Mon Sep 17 00:00:00 2001 From: Ben Liu Date: Mon, 6 Nov 2023 01:50:22 +0700 Subject: [PATCH 04/10] doc(webapp): update webapp readme --- WEBAPP.md | 78 +++++++++++++++++++++++++++---------------------------- 1 file changed, 39 insertions(+), 39 deletions(-) diff --git a/WEBAPP.md b/WEBAPP.md index 90dbf2b4..59e3515c 100644 --- a/WEBAPP.md +++ b/WEBAPP.md @@ -1,15 +1,13 @@ -# 開源星手村 - 網頁版 - # Open Star Ter Village - Web App -Open Star Ter Village - Web App is a single page application project for playing the game online. You can find out our [road map](./ROADMAP.md) of this web site. You can freely clone this project and create your Open Star Ter Village on your machine and enjoy with your friends/teams. +Open Star Ter Village - Web App is a single-page application project designed for playing the game online. You can explore our [Web App Roadmap on the Wiki page](https://github.com/ocftw/open-star-ter-village/wiki/Webapp-Roadmap) for this website. Feel free to clone this project and create your Open Star Ter Village on your local machine to enjoy with your friends or teams. -## How to create your open-star-ter-village game +## How to Set Up Your Open Star Ter Village Game -1. visit our website *[not ready yet]* -2. clone this project, host it and enjoy! +1. Visit our website (Currently not available) +2. Clone this project, host it, and enjoy! -### clone this repository in your machine +### Clone this repository on your machine ```shell git clone git@github.com:ocftw/open-star-ter-village.git open-star-ter-village @@ -17,7 +15,7 @@ git clone git@github.com:ocftw/open-star-ter-village.git open-star-ter-village > Note: OpenStarTerVillage requires node >= 12.0.0 -### spinning up* +### Get Started ```shell yarn @@ -26,65 +24,67 @@ yarn deploy:webapp yarn start:webapp ``` -## Deploying to Heroku +## Deployment Options +### Deploying to Heroku (Please note, we are exploring alternative solutions to Heroku due to certain limitations) + +```shell +heroku create +git push heroku main +heroku open ``` -$ heroku create -$ git push heroku main -$ heroku open -``` + or -[![Deploy to Heroku](https://www.herokucdn.com/deploy/button.svg)](https://heroku.com/deploy?template=https://github.com/ocftw/open-star-ter-village/tree/main) +[![Deploy to Heroku (Exploring Alternative Solutions)](https://www.herokucdn.com/deploy/button.svg)](https://heroku.com/deploy?template=https://github.com/ocftw/open-star-ter-village/tree/main) -## How to contribute in source code +## How to Contribute to the Source Code -OpenStarTerVillage - WebApp is a typescript monorepo configure by yarn 2 with workspace-tools plugin. The core game engine is based on [boardgame.io](https://boardgame.io) on both server and client side. OpenStarTerVillage - WebApp project divides into three parts. Core game logic, client UI, and game server. Their npm project name and locations are as follow table. +OpenStarTerVillage - WebApp is a TypeScript monorepo configured with Yarn 2 using the workspace-tools plugin. The core game engine is based on [boardgame.io](https://boardgame.io) on both the server and client side. The OpenStarTerVillage - WebApp project is divided into three parts: core game logic, client UI, and the game server. Below is a table showing their npm project names and locations: -| Project name | Location | Description | -| -------------------------------------- | ---------------------------------- | ------------------- | -| `@open-star-ter-village/webapp-game` | [./packages/game](./packages/game) | The core game logic | -| `@open-star-ter-village/webapp-client` | [./client](./client) | The client UI | -| `@open-star-ter-village/webapp-server` | [./server](./server) | The game server | +| Project Name | Description | +| ---------------------------------------------- | -------------------- | +| [`@open-star-ter-village/webapp-game`](./packages/game/) | The core game logic | +| [`@open-star-ter-village/webapp-client`](./client/) | The client UI | +| [`@open-star-ter-village/webapp-server`](./server/) | The game server | -### How to start the local development environment +### How to Start the Local Development Environment -You should clone the project and dive into the webapp folder before you kick off the local development. Please [clone the project and go to the webapp folder](#how-to-create-your-open-star-ter-village-game) if you haven't done it yet. +You should clone the project and navigate to the webapp folder before starting local development. Please refer to the [instructions for creating your Open Star Ter Village game](#how-to-create-your-open-star-ter-village-game) if you haven't done that yet. -OpenStarTerVillage - Web app is using yarn 2 workspaces to manage the project. Please ensure you have [latest yarn](https://yarnpkg.com/getting-started/install) in your machine before you start it. But don't worry, the yarn 2 upgrade is by-project basis so you can still access the other project with classic yarn 1. Please note that there are some [cli command changes](https://yarnpkg.com/getting-started/migration#cli-commands) as well. +OpenStarTerVillage - Web App uses Yarn 2 workspaces to manage the project. Please ensure you have the [latest Yarn](https://yarnpkg.com/getting-started/install) installed on your machine before getting started. Don't worry, the Yarn 2 upgrade is on a per-project basis, so you can still access other projects with classic Yarn 1. Please note that there have been [CLI command changes](https://yarnpkg.com/getting-started/migration#cli-commands) as well. -The follow command would start client UI (create-react-app) in dev server, server (koa) in ts-node under watchmon, and game core (pure-typescript) in watch compile mode. +The following command will start the client UI (Create React App) on a development server, the server (Koa) using ts-node with watchmon, and the game core (pure TypeScript) in watch compile mode. ```shell yarn dev:webapp ``` -Everything is settle up. Ready, get, set, code! - -#### local build +Everything is set up and ready for you to start coding! -There are three outcome in OpenStarTerVillage - Web app. The major outcomes are `client` and `server` which are served the game on the platform. The other output would be used as library in part of `client` and `server`. +#### Local Build +OpenStarTerVillage - Web App has three primary outcomes: `client` and `server`, which serve the game on the platform, and other outputs used as libraries in parts of `client` and `server`. ```shell yarn build:webapp ``` -The project output table -| Project name | Output Location | Description | -| -------------------------------------- | -------------------- | ------------------- | -| `@open-star-ter-village/webapp-game` | ./packages/game/dist | The core game logic | -| `@open-star-ter-village/webapp-client` | ./client/build | The client UI | -| `@open-star-ter-village/webapp-server` | ./server/build | The game server | +Project output table +| Project Name | Output Location | Description | +| -------------------------------------------- | ----------------------- | ----------------------- | +| `@open-star-ter-village/webapp-game` | ./packages/game/dist | The core game logic | +| `@open-star-ter-village/webapp-client` | ./client/build | The client UI | +| `@open-star-ter-village/webapp-server` | ./server/build | The game server | -> Note: The output folders are ignored by git. You can find them after built. +> Note: The output folders are ignored by Git, but you can find them after the build process. -#### Unit test *[not ready yet]* +#### Unit Test (Currently not available) ```shell yarn test ``` -## How to contribute in assets +## How to Contribute to Assets -Please create an issue about the assets you would like to contribute in. The team may invite you to have further discussion about your idea. Then you may create a pull request to upload your contributions. +If you'd like to contribute assets, please create an issue to discuss your ideas with the team. They may invite you for further discussions. Afterward, you can create a pull request to upload your contributions. From 6f68bdac96f94b438bca3d670f08a16f76e9e14f Mon Sep 17 00:00:00 2001 From: Ben Liu Date: Tue, 7 Nov 2023 00:16:48 +0700 Subject: [PATCH 05/10] doc(homepage): update contributing document --- homepage/CONTRIBUTING.md | 141 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 141 insertions(+) create mode 100644 homepage/CONTRIBUTING.md diff --git a/homepage/CONTRIBUTING.md b/homepage/CONTRIBUTING.md new file mode 100644 index 00000000..db23c89a --- /dev/null +++ b/homepage/CONTRIBUTING.md @@ -0,0 +1,141 @@ +# 貢獻專案 + +## 系統需求 + +| 工具 | 版本 | +| ---: | ---: | +| Node | >=14 | +| yarn | >=2 | + +若尚未安裝 Node，請前往[此處](https://nodejs.org/en/)進行安裝。 +若尚未安裝 Yarn 或版本過舊，請前往[此處](https://yarnpkg.com/getting-started/install)進行安裝。 + +## 網站架構 + +```mermaid +graph TB + Public["Public Files (images, style sheet, etc.)"] + + Markdown[("Markdown files")] + + Config[Next.js Configuration] + + subgraph Components + ReusableComponents["Reusable Components"] + end + + subgraph Admin[Admin Page] + DecapCMSConfig["Decap CMS Config"] --> DecapCMS[Decap CMS] + end + + Config -->|i18n config| DecapCMSConfig + Components -->|Live Preview| DecapCMS + + subgraph Pages[All pages. Index, Cards, etc.] + NextJSClient["Next.js Client"] + Components --> NextJSClient + NextJSClient -->|Render| ClientPages["Client Pages"] + StaticPages["Static Pages"] + end + + NextJSServer -->|Generate| StaticPages + NextJSServer["Next.js Server"] -->|i18n routing| NextJSClient + Config -->|i18n auto routing &\n img optimise| NextJSServer + Config -->|Image Optimisation| StaticPages["Static Pages"] + + Public -->|Optimise & Serve| NextJSServer + DecapCMS -->|Write| Markdown + Markdown -->|Provide assets| NextJSServer + + StaticPages -->|html| User + ClientPages -->|js| User +``` + +## 部署 + +本專案使用 Netlify 與 Netlify Next.js runtime 進行部署，帶來以下優勢： + +- 分支預覽部署 (Branch Preview Deployment) 讓您可以預覽每個 Git 分支的變更。 +- 使用 Netlify Identity 和 Git Gateway 管理非 GitHub 使用者的網頁編輯權限。 + +### 主要網站 + +[https://openstartervillage.netlify.app](https://openstartervillage.netlify.app) + +### CI/CD Canary 版本 + +[https://openstartervillage-canary.netlify.app](https://openstartervillage-canary.netlify.app) + +> Canary 版本會在每次推送到 `main` 分支時自動部署。它與主要網站的環境變數相同，但其網址不會被列入搜尋引擎索引。 + +## 開發前置流程 + +### 複製專案 + +```shell +git clone https://github.com/ocftw/open-star-ter-village.git +cd open-star-ter-village +``` + +### 安裝開發環境所需的套件 + +```shell +cd homepage +yarn +``` + +## 開發專案 + +本專案使用 Next.js 架構，若您不熟悉 Next.js，請參考[Next.js 文件](https://nextjs.org/docs/getting-started)。若需更深入了解不同方面，可查看以下文件： + +- [Next.js `getStaticProps`](https://nextjs.org/docs/basic-features/data-fetching#getstaticprops-documentation) +- [i18n 設定](https://nextjs.org/docs/advanced-features/i18n-routing) +- [圖片最佳化](https://nextjs.org/docs/basic-features/image-optimization) + +### 開發模式 + +> 若要在本地端開發並測試 CMS，需要先在 **開源星手村 git 專案根目錄** 啟動 `decap-server`： +> +> ```shell +> cd ../ # 返回 open-star-ter-village (git 根目錄) +> npx decap-server +> ``` + +以下指令將立即監控 `src/` 和 `public/` 資料夾中的檔案，並啟動本地網頁伺服器，用於測試和預覽結果。伺服器預設運行於端口 3000。 + +```shell +yarn dev +``` + +### 建置發布版本 + +```shell +yarn build +``` + +### 啟動伺服器端 + +```shell +yarn start +``` + +## Decap CMS 設定 + +Decap CMS 是一個用於網站內容管理的工具。若您希望深入了解如何設定 Decap CMS 中的 collection、widget、i18n，您可以參考以下文件： + +- [Decap CMS Collection 設定](https://decapcms.org/docs/collection-types/) +- [Decap CMS Widget 設定](https://decapcms.org/docs/widgets/) +- [Decap CMS i18n 設定](https://decapcms.org/docs/beta-features/#i18n-support) + +## 其他功能設定 + +### 網站分析 + +網站分析使用 Google Tag Manager 進行設定，主要用於分析網站流量。主要的設定檔案為 [`src/lib/service/gtm.js`](./src/lib/service/gtm.js)，使用於 [`src/pages/_app.jsx`](./src/pages/_app.jsx) 與 [`src/pages/_document.jsx`](./src/pages/_document.jsx)。 + +### 網站 SEO + +網站 SEO 僅有在 [`public/sitemap.xml`](./public/sitemap.xml) 與 [`public/robots.txt`](./public/robots.txt) 中設定，由於頁面還沒擴增到完全由 CMS 產生，尚未以[`src/pages/sitemap.xml.js`](./src/pages/sitemap.xml.js)的方式即時生成 sitemap。若您希望更深入了解如何設定網站 SEO，您可以參考以下文件： + +- +- From 3c80809ced15b86c8173b4ec5472d2d6191854a8 Mon Sep 17 00:00:00 2001 From: Ben Liu Date: Tue, 7 Nov 2023 00:17:08 +0700 Subject: [PATCH 06/10] doc(homepage): update readme --- homepage/README.md | 163 ++++++++++++++++++++------------------------- 1 file changed, 71 insertions(+), 92 deletions(-) diff --git a/homepage/README.md b/homepage/README.md index 748f2d08..8bd0314e 100644 --- a/homepage/README.md +++ b/homepage/README.md @@ -1,138 +1,117 @@ # 開源星手村 首頁 -## 專案架構 +## 專案版本紀錄 + +| 版本 | 更新摘要 | +| -----------------------------------------: | :------------------------------------------------------------------- | +| [`v3.2.0`](./releases/tag/homepage-v3.2.0) | 升級 Netlify CMS 為 Decap CMS 以修復陳舊相依套件所引起的問題。 | +| [`v3.1.0`](./releases/tag/homepage-v3.1.0) | 新增多語言支援與 Netlify CMS 功能。 | +| [`v3.0.0`](./releases/tag/homepage-v3.0.0) | 轉換為 Next.js 架構。 | +| [`v2.1.0`](./releases/tag/homepage-v2.1.0) | 將 `homepage` 分支合併到 `main` 作為子專案，同時改用 Yarn 管理套件。 | +| `v2.0.0` | 移除 Gatsby 及 Contentful CMS。 | +| `v1.0.0` | 初始新增網站首頁。 |
-更新紀錄 + +詳細版本更新 + -| 版本 | 更新細節 | -| -------: | :------------------------------------------------ | -| `v1.0.0` | 增加網站首頁 | -| `v2.0.0` | 移除gatsby與contentful cms | -| `v2.1.0` | 由`homepage`分支併入`main`，套件管理由npm改用yarn | -| `v3.0.0` | 改用next.js架構 | +- `v3.2.0` 升級 Netlify CMS 為 Decap CMS，修復陳舊相依套件所引起的問題。 +- `v3.1.0` 新增多語言支援與 Netlify CMS 功能。 +- `v3.0.0` 隨著專案擴展，計劃支援多語言，考慮引入 CMS 以降低團隊維護成本，因此轉換至 Next.js 結構。 +- `v2.1.0` 將 `homepage` 分支合併至 `main`，視為子專案，同時改用 Yarn 管理套件，以維持桌遊網頁版專案一致性，並刪除 `homepage` 分支。 +- `v2.0.0` 移除 Gatsby，改為純粹的 React JS 靜態網站生成，降低專案入門門檻，同時移除 Contentful CMS 部分，減少團隊金錢支出。 +- `v1.0.0` 以 [RG-Portfolio Gatsby starter](https://github.com/Rohitguptab/rg-portfolio.git) 為基礎新增網站首頁。
-homepage 是以 [RG-Portfolio gatsby starter](https://github.com/Rohitguptab/rg-portfolio.git) 為基礎建置，移除了Gatsby並改用純粹的React JS static site generating以降低入門門檻，並移除Contentful CMS部分以減少團隊金錢花費。 +目前，模板設計基於 [首頁 wireframe](https://drive.google.com/file/d/1mHfiHLZPNvAGKtlY788Ojkmap9SXupH-/view?usp=sharing)，並使用 [Bootstrap v4.6.x](https://getbootstrap.com/docs/4.6/getting-started/introduction/) 和 [Font Awesome v5.15.4](https://fontawesome.com/v5/docs) 進行 CSS 設計。 -因為切換無相關的兩個分支容易造成開發者的困擾，因此將`homepage`分支併入`main`成為一個子專案，套件管理由npm改為yarn與桌遊網頁版專案的工具保持一致，並將`homepage`分支刪除。 +專案目前部署於 Netlify 上，Netlify有提供免費的[網域](https://openstartervillage.netlify.app/)，並且支援[自動部署](https://docs.netlify.com/site-deploys/overview/)，因此專案的部署流程相當簡單。 -隨著專案的推廣，我們需要將網站架構擴充支援多語系，同時考慮引入Netlify CMS以降低開發團隊維護成本，因此將網站架構改為Next.js，於後續版本加入多語系支援與Netlify CMS。 +同時，專案也支援[多語言](https://nextjs.org/docs/advanced-features/i18n-routing)，並且使用 [Decap CMS](https://decapcms.org/) 作為網站內容管理工具。 -模版設計上目前以[首頁 wireframe](https://drive.google.com/file/d/1mHfiHLZPNvAGKtlY788Ojkmap9SXupH-/view?usp=sharing)為開發方向，CSS延續之前的樣板繼續使用 [Bootstrap v4.6.x](https://getbootstrap.com/docs/4.6/getting-started/introduction/), [Font Awesome v5.15.4](https://fontawesome.com/v5/docs) +## 💫 部署 -目前部屬在 Netlify 上，並有[預覽網頁](https://openstartervillage-preview.netlify.app/activity-test-page)與[正式網頁](https://openstartervillage.netlify.app/) +[![部署至 Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/ocftw/open-star-ter-village/tree/homepage) ### 線上展示 -[![Netlify Status](https://api.netlify.com/api/v1/badges/2440ec97-301c-4a60-ae46-558cd2cb00b9/deploy-status)](https://app.netlify.com/sites/openstartervillage/deploys) +[![Netlify 狀態](https://api.netlify.com/api/v1/badges/2440ec97-301c-4a60-ae46-558cd2cb00b9/deploy-status)](https://app.netlify.com/sites/openstartervillage/deploys) [https://openstartervillage.netlify.app/](https://openstartervillage.netlify.app/) -### 如何參與合作/貢獻 - -你可以在[共用資料夾的坑區](https://drive.google.com/drive/folders/1JgqEh5gkf9nzqwznLLAo1vtgHWi3o7gw)以及[試算表中的Story mapping](https://docs.google.com/spreadsheets/d/1QBjG9JozOvP1TOwg33h0Gs6yIdifd1sJ6CJTZZHZr7I/edit?usp=sharing)找到我們目前需要幫忙的內容。 - -> 公用資料夾的坑主要為網頁內容或需要與工程師進一步確認的事項；試算表中的Story mapping主要是以工程師的任務為主 - -也歡迎加入[discord](https://discord.gg/JnTHGnxwYS)與大家一起討論，你可以在 #村長辦公室 與 #基礎建設部 提出各種見解與參與討論喔！ - -#### 語法練習 - -- Markdown - - 可以到這兩個網頁知道如何撰寫markdown語法，以及我們的 [markdown playground](https://hackmd.io/2OBWFw_FSiazt4JxoINNlQ?both) 進行練習。 - - - （網頁排版不支援手機/小螢幕裝置） - - - -- 將Markdown轉為html - - 可以直接藉由這兩個網站輸入markdown得到html語法，也可以在 [markdown playground](https://hackmd.io/2OBWFw_FSiazt4JxoINNlQ?both) 找到簡易的對照表。 - - - - - - -- 增加html的attributes - -- 在jsx中使用html +## 網域設定 -- 在jsx中使用React component +開源星手村在ocf.tw底下有一個子網域，網址為[https://openstartervillage.ocf.tw/](https://openstartervillage.ocf.tw/)，目前已經將此網址導向至Netlify。 -- 在jsx中使用expression +## 🚀 快速開始 -#### 各種有用的連結 +### 參與合作/貢獻方式 -- [開源新手村 ★ 入村總綱領](https://hackmd.io/1B3eCm8sSbqDTdcMI7o85g) -- [共用資料夾區](https://drive.google.com/drive/folders/1d2rlxRLQ_iUVhq9-ZO7BGCjTl1ES2zf6) +歡迎加入[Discord](https://discord.gg/JnTHGnxwYS)，於 #村長辦公室 與 #基礎建設部 提出您的見解並參與討論！ -### 開發前須知 +### 網站開發 -#### 系統需求 +若您對網站開發有興趣，歡迎參考以下資訊。 -| tool | version | -| ---: | ------: | -| node | >=14 | -| npm | >=8 | +- [官方網站進度規劃](https://github.com/ocftw/open-star-ter-village/wiki/Homepage-Roadmap) -如果沒有 node，可以到[這裡](https://nodejs.org/en/)安裝 +#### 開發前需了解的事項 -### 開發建議流程 +請參考[CONTRIBUTING.md](./CONTRIBUTING.md)。 -#### clone 專案 +### 網站內容編輯 -```shell -git clone https://github.com/ocftw/open-star-ter-village.git -cd open-star-ter-village -``` +- [網站編輯說明](https://github.com/ocftw/open-star-ter-village/wiki/%E7%B6%B2%E7%AB%99%E7%B7%A8%E8%BC%AF%E8%AA%AA%E6%98%8E-%E2%80%90-How-to-Edit-Homepage) -#### 下載開發環境所需的packages +Decap CMS 支援 Markdown 語法，如對此不熟悉可參考以下兩個網站學習 Markdown 語法，並透過 [markdown playground](https://hackmd.io/2OBWFw_FSiazt4JxoINNlQ?both) 進行練習。 -```shell -cd homepage -yarn -``` +- （注意：此網頁在手機和小螢幕裝置上的排版支援有限） +- -#### 開發專案 +### 增加新語言/修改語言代碼/刪除語言 -我們以建置靜態網站為主要目的，如果要知道如何建置靜態網站請參考[連結](#建置專案)。 +1. 增加語言於 [`next.config.js`](./next.config.js) 中的 `i18n.locales` 陣列中。語言代碼請參考 [BCP 47](https://www.w3.org/International/questions/qa-choosing-language-tags#question), [ISO 639-1](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes), [ISO 639-2](https://en.wikipedia.org/wiki/List_of_ISO_639-2_codes), [ISO 639-3](https://en.wikipedia.org/wiki/List_of_ISO_639-3_codes) -下面的指令提供了即時監看 `src/` 與 `public/` 底下的檔案，並開啟一個本機的網頁伺服器用來測試與瀏覽建置的結果。開啟後，預設的port為3000。 +目前支援的語言有 `zh-tw`, `en`。 -```shell -yarn dev -``` - -#### 建置production專案 +```js +// next.config.js +i18n: { + locales: ['zh-tw', 'en'], + defaultLocale: 'zh-tw', +}, -```shell -yarn build +// decap-cms.config.js +// decap cms i18n inherits from next.config.js +i18n: { + structure: 'multiple_folders', + locales: nextConfig.i18n.locales, + default_locale: nextConfig.i18n.defaultLocale, +}, ``` -#### serve server side專案 +> Decap cms中的語言陣列與預設語言是沿用next.config.js中的設定，因此在next.config.js中新增語言後，decap cms會自動套用新增的語言。 +> +> 語言陣列中的語言順序為decap cms中的編輯文件的語言順序。 -```shell -yarn start -``` +2. 修改語言代碼需同時修改 `next.config.js` 中的 `i18n.locales` 並將 [`_cards`](./_cards/), [`_footer`](./_footer/), [`_pages`](./_pages/) 資料夾中底下的語言資料夾名稱一併修改。 -#### 產生靜態網頁 +例如：將 `zh-tw` 修改為 `zh-hant`，則 `_cards`, `_footer`, `_pages` 底下的 `zh-tw` 資料夾名稱也需一併修改為 `zh-hant`。 -```shell -yarn export -``` - -#### serve 靜態網頁 - -```shell -npx serve out -``` +> Decap cms中的語言陣列與預設語言是沿用next.config.js中的設定，因此在next.config.js中修改語言後，decap cms會自動套用修改。 +> +> 語言資料夾名稱需與 `next.config.js` 中的 `i18n.locales` 陣列中的語言代碼一致。 +> +> 如果`defaultLocale`是`zh-tw`，則在`zh-tw`修改為`zh-hant`時，需要同時修改`defaultLocale`為`zh-hant`。 -## 💫 Deploy +## 其他連結 -[![Deploy to Netlify](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/ocftw/open-star-ter-village/tree/homepage) +- [開源新手村 ★ 入村總綱領](https://hackmd.io/1B3eCm8sSbqDTdcMI7o85g) +- [共用資料夾區](https://drive.google.com/drive/folders/1d2rlxRLQ_iUVhq9-ZO7BGCjTl1ES2zf6) -## Inspired +## 靈感來源 - [RG-Portfolio gatsby starter](https://github.com/Rohitguptab/rg-portfolio.git) - [Creating a static website with ReactJS and renderToStaticMarkup()](https://www.codemzy.com/blog/static-website-react-rendertostaticmarkup) @@ -152,4 +131,4 @@ npx serve out ## 特別感謝 -@binaryluke +[@binaryluke](https://github.com/binaryluke) 在 v2.0.0 階段提供網站架構想法。 From ea663467a873ecfbb5165c2f8f8c8377aa84fbf8 Mon Sep 17 00:00:00 2001 From: Ben Liu Date: Tue, 7 Nov 2023 00:18:49 +0700 Subject: [PATCH 07/10] chore(homepage): remove unused contstants file to not confuse devs --- homepage/src/constants.js | 5 ----- 1 file changed, 5 deletions(-) delete mode 100644 homepage/src/constants.js diff --git a/homepage/src/constants.js b/homepage/src/constants.js deleted file mode 100644 index 44cd5f76..00000000 --- a/homepage/src/constants.js +++ /dev/null @@ -1,5 +0,0 @@ -export const siteData = { - title: `開源星手村`, - description: `科技怎麼改變世界？玩桌遊、就知道！`, - logo: `/images/logo.png`, -}; From 45ed8ae77e9c5865b5d724bbe57b79872687e794 Mon Sep 17 00:00:00 2001 From: Ben Liu Date: Tue, 7 Nov 2023 09:25:50 +0700 Subject: [PATCH 08/10] doc(homepage): update i18n renmaing redirect process --- homepage/README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/homepage/README.md b/homepage/README.md index 8bd0314e..0d485390 100644 --- a/homepage/README.md +++ b/homepage/README.md @@ -105,6 +105,8 @@ i18n: { > 語言資料夾名稱需與 `next.config.js` 中的 `i18n.locales` 陣列中的語言代碼一致。 > > 如果`defaultLocale`是`zh-tw`，則在`zh-tw`修改為`zh-hant`時，需要同時修改`defaultLocale`為`zh-hant`。 +> +> 在 [`public/_redirects`](./public/_redirects) 中新增一個重新導向規則，將舊的語言代碼導向到新的語言代碼。例如，如果您將 `zh-tw` 更改為 `zh-hant`，則應在 `public/_redirects` 中添加 `/zh-tw/* /zh-hant/:splat 301!`。 ## 其他連結 From 075bb07571d13e9f8621586a15545826ec321d3b Mon Sep 17 00:00:00 2001 From: Ben Liu Date: Tue, 7 Nov 2023 09:26:35 +0700 Subject: [PATCH 09/10] doc(homepage): update contributing document to mention netlify docs and canary stack purpose --- homepage/CONTRIBUTING.md | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/homepage/CONTRIBUTING.md b/homepage/CONTRIBUTING.md index db23c89a..2fd6c637 100644 --- a/homepage/CONTRIBUTING.md +++ b/homepage/CONTRIBUTING.md @@ -56,17 +56,21 @@ graph TB 本專案使用 Netlify 與 Netlify Next.js runtime 進行部署，帶來以下優勢： - 分支預覽部署 (Branch Preview Deployment) 讓您可以預覽每個 Git 分支的變更。 -- 使用 Netlify Identity 和 Git Gateway 管理非 GitHub 使用者的網頁編輯權限。 +- 使用 [Netlify Identity](https://docs.netlify.com/security/secure-access-to-sites/identity/) 和 [Git Gateway](https://docs.netlify.com/security/secure-access-to-sites/git-gateway/) 管理非 GitHub 使用者的網頁編輯權限。 + +如果您不熟悉 Netlify，請參考[Netlify 文件](https://docs.netlify.com/)。 ### 主要網站 [https://openstartervillage.netlify.app](https://openstartervillage.netlify.app) -### CI/CD Canary 版本 +### Canary 版本 + +為了在不直接影響主要網站的情況下測試新的 CI/CD 流程，我們使用 Canary 版本。 [https://openstartervillage-canary.netlify.app](https://openstartervillage-canary.netlify.app) -> Canary 版本會在每次推送到 `main` 分支時自動部署。它與主要網站的環境變數相同，但其網址不會被列入搜尋引擎索引。 +> Canary 版本會在每次推送到 `main` 分支時自動部署。它具有與主要網站相同的環境變數，但其網址不會被列入搜尋引擎索引。 ## 開發前置流程 @@ -123,6 +127,7 @@ yarn start Decap CMS 是一個用於網站內容管理的工具。若您希望深入了解如何設定 Decap CMS 中的 collection、widget、i18n，您可以參考以下文件： +- [Decap CMS local backend 設定](https://decapcms.org/docs/beta-features/#working-with-a-local-git-repository) - [Decap CMS Collection 設定](https://decapcms.org/docs/collection-types/) - [Decap CMS Widget 設定](https://decapcms.org/docs/widgets/) - [Decap CMS i18n 設定](https://decapcms.org/docs/beta-features/#i18n-support) From 54cae2494976c4fa5c540b31a8a798f948d5ff5b Mon Sep 17 00:00:00 2001 From: Ben Liu Date: Mon, 13 Nov 2023 16:14:02 +0700 Subject: [PATCH 10/10] doc: unify project name to be open starter village --- WEBAPP.md | 16 ++++++++-------- app.json | 4 ++-- google-spreadsheet/README.md | 4 ++-- homepage/package.json | 2 +- 4 files changed, 13 insertions(+), 13 deletions(-) diff --git a/WEBAPP.md b/WEBAPP.md index 59e3515c..43026f3c 100644 --- a/WEBAPP.md +++ b/WEBAPP.md @@ -1,8 +1,8 @@ -# Open Star Ter Village - Web App +# Open StarTer Village - Web App -Open Star Ter Village - Web App is a single-page application project designed for playing the game online. You can explore our [Web App Roadmap on the Wiki page](https://github.com/ocftw/open-star-ter-village/wiki/Webapp-Roadmap) for this website. Feel free to clone this project and create your Open Star Ter Village on your local machine to enjoy with your friends or teams. +Open StarTer Village - Web App is a single-page application project designed for playing the game online. You can explore our [Web App Roadmap on the Wiki page](https://github.com/ocftw/open-star-ter-village/wiki/Webapp-Roadmap) for this website. Feel free to clone this project and create your Open StarTer Village on your local machine to enjoy with your friends or teams. -## How to Set Up Your Open Star Ter Village Game +## How to Set Up Your Open StarTer Village Game 1. Visit our website (Currently not available) 2. Clone this project, host it, and enjoy! @@ -13,7 +13,7 @@ Open Star Ter Village - Web App is a single-page application project designed fo git clone git@github.com:ocftw/open-star-ter-village.git open-star-ter-village ``` -> Note: OpenStarTerVillage requires node >= 12.0.0 +> Note: Open StarTer Village Game requires node >= 12.0.0 ### Get Started @@ -40,7 +40,7 @@ or ## How to Contribute to the Source Code -OpenStarTerVillage - WebApp is a TypeScript monorepo configured with Yarn 2 using the workspace-tools plugin. The core game engine is based on [boardgame.io](https://boardgame.io) on both the server and client side. The OpenStarTerVillage - WebApp project is divided into three parts: core game logic, client UI, and the game server. Below is a table showing their npm project names and locations: +Open StarTer Village - WebApp is a TypeScript monorepo configured with Yarn 2 using the workspace-tools plugin. The core game engine is based on [boardgame.io](https://boardgame.io) on both the server and client side. The Open StarTer Village - WebApp project is divided into three parts: core game logic, client UI, and the game server. Below is a table showing their npm project names and locations: | Project Name | Description | | ---------------------------------------------- | -------------------- | @@ -50,9 +50,9 @@ OpenStarTerVillage - WebApp is a TypeScript monorepo configured with Yarn 2 usin ### How to Start the Local Development Environment -You should clone the project and navigate to the webapp folder before starting local development. Please refer to the [instructions for creating your Open Star Ter Village game](#how-to-create-your-open-star-ter-village-game) if you haven't done that yet. +You should clone the project and navigate to the webapp folder before starting local development. Please refer to the [instructions for creating your Open StarTer Village game](#how-to-create-your-open-star-ter-village-game) if you haven't done that yet. -OpenStarTerVillage - Web App uses Yarn 2 workspaces to manage the project. Please ensure you have the [latest Yarn](https://yarnpkg.com/getting-started/install) installed on your machine before getting started. Don't worry, the Yarn 2 upgrade is on a per-project basis, so you can still access other projects with classic Yarn 1. Please note that there have been [CLI command changes](https://yarnpkg.com/getting-started/migration#cli-commands) as well. +Open StarTer Village - Web App uses Yarn 2 workspaces to manage the project. Please ensure you have the [latest Yarn](https://yarnpkg.com/getting-started/install) installed on your machine before getting started. Don't worry, the Yarn 2 upgrade is on a per-project basis, so you can still access other projects with classic Yarn 1. Please note that there have been [CLI command changes](https://yarnpkg.com/getting-started/migration#cli-commands) as well. The following command will start the client UI (Create React App) on a development server, the server (Koa) using ts-node with watchmon, and the game core (pure TypeScript) in watch compile mode. @@ -64,7 +64,7 @@ Everything is set up and ready for you to start coding! #### Local Build -OpenStarTerVillage - Web App has three primary outcomes: `client` and `server`, which serve the game on the platform, and other outputs used as libraries in parts of `client` and `server`. +Open StarTer Village - Web App has three primary outcomes: `client` and `server`, which serve the game on the platform, and other outputs used as libraries in parts of `client` and `server`. ```shell yarn build:webapp diff --git a/app.json b/app.json index 032f858c..7a5d5484 100644 --- a/app.json +++ b/app.json @@ -1,6 +1,6 @@ { - "name": "Open Star Ter Village - Web App", - "description": "Open Star Ter Village - Web App", + "name": "Open StarTer Village - Web App", + "description": "Open StarTer Village - Web App", "repository": "https://github.com/kuoabu/open-star-ter-village", "logo": "https://cdn.rawgit.com/heroku/node-js-getting-started/main/public/node.svg", "keywords": [ diff --git a/google-spreadsheet/README.md b/google-spreadsheet/README.md index 9342f5a1..1e5f61ba 100644 --- a/google-spreadsheet/README.md +++ b/google-spreadsheet/README.md @@ -1,8 +1,8 @@ # 開源星手村 - Google 表單 -# Open Star Ter Village - Google Spreadsheet +# Open StarTer Village - Google Spreadsheet -Open Star Ter Village - Google spreadsheet is a standalone prototype project for playing the game online during the COVID restriction. It is a Google-script plugin on a [spreadsheet](https://docs.google.com/spreadsheets/d/1xnuGOg5xSfGYNmfHm7EeSpFB-QRtlG-Kq8t53B7cmUU/edit#gid=695693469) and it requires your authentication before the game starts. You can freely clone the spreadsheet and this project and create your Open Star Ter Village on your Google drive and enjoy with your friends/teams. +Open StarTer Village - Google spreadsheet is a standalone prototype project for playing the game online during the COVID restriction. It is a Google-script plugin on a [spreadsheet](https://docs.google.com/spreadsheets/d/1xnuGOg5xSfGYNmfHm7EeSpFB-QRtlG-Kq8t53B7cmUU/edit#gid=695693469) and it requires your authentication before the game starts. You can freely clone the spreadsheet and this project and create your Open StarTer Village on your Google drive and enjoy with your friends/teams. ## how to create your open-star-ter-village game diff --git a/homepage/package.json b/homepage/package.json index 08e3ef24..ed459d2c 100644 --- a/homepage/package.json +++ b/homepage/package.json @@ -1,7 +1,7 @@ { "name": "@open-starter-village/homepage", "private": true, - "description": "Open Star Ter Village home page", + "description": "Open StarTer Village home page", "version": "3.0.0", "author": "Ben Liu ", "keywords": [],