/mbti-talk

Primary LanguageJavaScript

MBTI Talk

利用 React 及 Socket.io 製作一個匿名聊天網站，使用者進入後自行選擇或玩心理測驗獲得 MBTI 與他人配對聊天。

專案功能

  • 可以自己選擇自己的 MBTI 進入聊天大廳
  • 可以使用心理測驗得知自己的 MBTI 類型並進入聊天大廳
  • 可以隨機配對並匿名即時聊天

專案主頁

https://u88872625.github.io/mbti-talk/

頁面呈現

1. 首頁

img

2. 點擊 YES 進入身分選擇

img

3. 點擊 NO 進入心理測驗

img

4. 獲得身分後，可以進入聊天大廳(目前只開放隨機聊天)

img

5. 進入聊天室

img

如何使用

  1. 安裝 Node.js 及 npm

  2. clone 專案到本地

  3. 在本地開啟後，透過終端機進入資料夾，輸入：

npm install
  1. 安裝完畢，繼續輸入:
npm start
  1. 接著瀏覽器將會自動開啟 "http://localhost:3000/mbti-talk" 若成功運行，則會看到底下訊息:
webpack compiled successfully
  1. 要停止時則按 ：
ctrl + c

開發工具

  • Node.js
  • react: v18.2.0
  • socket.io: v4.7.2
  • react-bootstrap: v2.8.0
  • react-router-dom: v6.4.1
  • sass: v1.66.1