---
# System prepended metadata

title: WP 110-1 桌遊大全

---

# WP 110-1 桌遊大全
我們是不是可以參考下面這個東東...
https://www.freeboardgames.org/en

可阿，我認為我對前端的想法應該是跟他蠻像的
其它後端怎麼做之類的可以參考，然後大家要開始動工囉
總之先pull看看可不可以用
## Member
* 電機二蘇絹淇 B09901199
* 電機二陳品睿 B09901194
* 電機二江承恩 B09901099
## TODO
* Frontend
    * 登入頁面
    * 遊戲列表(可以分成一對一對戰和多人對戰)
        * 四子棋
        * 誰是牛頭王
    * 各種遊戲畫面
        * 遊戲開始畫面(開始鍵、規則)
        * 遊戲進行畫面
        * 結束畫面(回到遊戲列表的鍵)
* Backend
    * 註冊會員資料
    * 遊戲本身的規則與實行
    * 對戰紀錄(若為一對一遊戲紀錄勝利次數，多人遊戲則紀錄前三名的次數)

## Daily Progress

### 12/19

File Structure
```
final/
├── frontend/src/                                      |  
| ├── App.css                                          |
| ├── App.js                                           |
| ├── index.js                                         |
| ├── Containers/                                      |
| |                ├── SignIn.js                       |
| |                ├── GameBoard.js                    |
| |                ├── ConnectFour.js   /// Game 1     |
| |                └── SixNimmt.js      /// Game 2     |
| ├── Components/                                      |
| |                ├── SignIn/                         |
| |                |         └── SignInModal.js        |
| |                ├── ConnectFour/                    |
| |                |         ├── Baord.js              |
| |                |         ├── Cell.js               |
| |                |         ├── Cell.css              |
| |                |         └── ConnectFourModal.js   |
| |                └── SixNimmt/                       |
| |                          ├── Player.js             |
| |                          └── SixNimmtModal.js      |
| └── Hooks/                                           |
|                  ├── useBoard.js                     |
|                  ├── useConnectFour.js               |
|                  └── useSixNimmt.js                  |
└── backend/                                           |
  ├── server.js                                        |  
  ├── wssConnect.js                                    |
  ├── routes/                                          |
  |                └── router.js                       |
  ├── models/                                          |
  |                ├── connectFour_mongo.js            |
  |                └── sixNimmt_mongo.js               |
  └── uitility/                                        |
                   ├── connectFour_utility.js          |
                   └── sixNimmt_utility.js             |
```

### 12/20
Start making some frontend UI on GameBoard.
I've added both of you as the collaborator, so check it put in your github.
Make sure to pull the code!

### 12/22
Continue to do frontend UI.
Will finish the connection of GameBoard.js and ConnectFour.js later, probably.
I have no aesthetics, so please help if you think the UI is too ugly, lmao.

![](https://i.imgur.com/f41d6ET.png)

Current looking.

### 12/24
Finish moving. Now App.js serve as a file to render all kind of container.

### 12/31
Try to add board of Connect Four. I hope to finish this game frontend+backend by next week.
Also, PLEASE give me some response if you are doing the project, because i have seen NO PULL REQUEST yet, so I am not sure what's going on.

### 1/1
I have pulled the code on last weekend successfully. I am not sure why you don't see the request. And i am trying to do the frontend of six Nimmt now. BTW, happy new year.

Ok, thanks a lot!
If you need any help just tell me,  we can work together since Six Nimmt will be pretty difficult.
HNY!
P.S. May you push your recent work to the github? Since we are working synchronously, I'm afraid to miss any of your work.

### 1/2
Some sign in and connect four frontend fixed.

### 1/3
Sent pull request. Add the look like of SixNimmt, but still need a lot improvement on aesthetics.

RE: Well, I've seen you forked the profile, but I haven't seen any pull request yet, so the situation is kind of strange.
May you send PR to me again? Thank you!

### 1/4
Now we're able to add our own photo sticker on the gameboard, I think it looks pretty well.

RE: I've successfully recieved your PR and the code is merged. Well done!
Make sure to pull the newest code before you are going on your work.

### 1/5
Now every user's photo sticker will be stored in database. So each time the user log in again the picture will remember to show.
Also, any backend work can go on since I had created the structure, so go ahead if you want to modify backend!
