點我打開目錄
Alpha Camp 學期三期末團體專案，本專案採用前後分離模式開發，小組成員有四人，其中兩人負責前端，兩人負責後端。 此 repo 為前端的內容。後端 repo 點我
👀 Live demo: https://weilocus.github.io/twitter/
- Weii
- Kelly CHI
- Frank
- Wei Lin
-
註冊一個帳號來使用這個網站，帳號與 Email 皆不可與其他使用者重複
-
使用 使用者 身份登入帳號，如果帳號密碼有誤或是漏填，均可得到清楚的提示
-
在側邊欄點擊登出，會跳轉回登入頁面
-
可以發送推文
-
可以回覆推文
-
使用者可以編輯個人資料
- 在首頁可以點擊輸入框來發送推文
- 查看網站所有的推文，依推文時間由新到舊排列
- 查看特定一篇的推文，其回覆排列順序由新到舊
- 查看單一使用者的推文，排列順序由新到舊
- 查看單一使用者回覆，排列順序由新到舊
- 查看單一使用者喜歡的內容，排列順序由新到舊
- 查看自己與其他使用者的個人頁面
- 更改自己的名稱、自我介紹、封面照片、個人照片
- 更改自己註冊時的帳號、名稱、email、密碼
- 點擊與回覆其他使用者的推文
- 對自己或其他使用者的推文，點擊喜歡或取消喜歡
- 推薦跟隨區塊，可查看目前網站中粉絲數排名前十名的使用者
- 點擊跟隨或取消跟隨使用者
- 使用管理員身分登入帳號，如果帳號密碼有誤或是漏填，均可得到清楚的提示
- 登入後可以在側邊欄切換頁籤
- 推文清單頁面可瀏覽所有推文
- 在推文清單頁面點擊刪除任一筆推文時，會跳出確認視窗
- 在使用者列表可瀏覽所有註冊帳號的使用者，依照推文數量排序，最多的最前面
- 在側邊欄點擊登出，會跳轉回登入頁面
- 將專案 clone 到本地：
$ git clone "https://github.com/WeiLocus/twitter.git"- 在本地開啟之後，透過終端機進入資料夾，輸入：
$ npm install- 安裝完畢後，繼續輸入：
$ npm run dev-
打開瀏覽器輸入網址：
http://localhost:5173/twitter即可進入網站 -
前台測試帳號：
帳號：user1
密碼：12345678
- 後台測試帳號：
帳號：root
密碼：12345678
- 若要暫停使用，可在終端機輸入以下指令：
ctrl + c- node.js 16.16.0
- vite 4.2.1
- vite-plugin-svgr 2.4.0
- react 18.2.0
- react-dom 18.2.0
- react-router-dom 6.9.0
- react-spinners 0.13.8
- styled-components 5.3.9
- clsx 1.2.1
- axios 1.3.4
- eslint 8.36.0
- prettier 2.8.4
-- public
-- src
|__ app.jsx
|__ api
|__ assets
|__ icons
|__ components
|__ elements
|__ layouts
|__ contexts
|__ pages
感謝全體組員在短短兩周內以最高標準順利完成目標，很高興有你們！