Skip to content

archergo1/Work-Exchanger

Repository files navigation

Work Exchanger

此專案源於作者本身兩次打工換宿經驗,在找尋換宿資訊時,常常要在不同平台,如臉書、Dcard 等,來回整理資訊。有感於這樣的方式要花上許多時間和精力,因此便想以架設網站平台的方式,整合資訊。期望未來有越來越多人使用,將可以造福更多想換宿的小幫手們。

Logo 設計理念

鼓勵有換宿經驗的前人分享心得,讓未來想換宿的朋友們可以更瞭解想選擇的店家

功能介紹

  • 會員註冊登入
  • 會員發表評論
  • 訪客瀏覽評論資訊
  • 換宿商家搜尋

測試

測試帳號密碼

帳號: user123@gmail.com
密碼: user123

實際畫面

demo1 demo2 demo3
首頁 會員登入 撰寫評論

安裝

以下將會引導你如何安裝此專案到你的電腦上。

Node.js 版本建議為:16.15.0 以上

取得專案

git clone https://github.com/archergo1/Work-Exchanger.git

移動到專案內

cd Work-Exchanger

安裝套件

npm install

運行專案

npm run dev

開啟專案

在瀏覽器網址列輸入以下即可看到畫面

http://localhost:5173/

資料夾結構

Work Exchange/
├── README.md
├── index.html
├── package-lock.json
├── package.json
├── public
│   └── static
│       └── images
│           ├── 404.jpg
│           ├── chat.png
│           ├── demo
│           │   ├── demo1.png
│           │   ├── demo2.png
│           │   └── demo3.png
│           ├── facebook.png
│           ├── instagram.png
│           ├── logo.png
│           ├── logo.svg
│           ├── spring.jpg
│           ├── storeImage
│           │   ├── beachcastle.jpg
│           │   ├── beishan.png
│           │   ├── bigfish.jpg
│           │   ├── catbooks.jpg
│           │   ├── hostel.png
│           │   ├── lake.jpg
│           │   ├── mermaid.jpg
│           │   ├── oceandiary.jpg
│           │   ├── song.jpg
│           │   ├── summer.jpg
│           │   ├── sunshine.jpg
│           │   └── tornado.jpg
│           ├── thumbup.png
│           ├── userMug
│           │   ├── archer.jpg
│           │   ├── defaultMug.png
│           │   ├── gege.jpg
│           │   ├── green.jpg
│           │   ├── mei.jpg
│           │   ├── rou.jpg
│           │   ├── wayne.jpg
│           │   └── welly.jpg
│           ├── whiteStar.png
│           └── youtube.png
├── src
│   ├── App.jsx
│   ├── components
│   │   ├── BannerArea.jsx
│   │   ├── Button.jsx
│   │   ├── Footer.jsx
│   │   ├── HashTags.jsx
│   │   ├── Header.jsx
│   │   ├── MySetting.jsx
│   │   ├── OurLatest.jsx
│   │   ├── OurSelect.jsx
│   │   ├── Post.jsx
│   │   ├── Rating.jsx
│   │   └── contexts
│   │       ├── GlobalState.js
│   │       └── apiUrl.js
│   ├── index.css
│   ├── main.jsx
│   ├── pages
│   │   ├── About.jsx
│   │   ├── Contact.jsx
│   │   ├── FAQ.jsx
│   │   ├── Home.jsx
│   │   ├── LogIn.jsx
│   │   ├── Member.jsx
│   │   ├── PageNotFound.jsx
│   │   ├── SearchResults.jsx
│   │   ├── SignUp.jsx
│   │   ├── StoreBriefAndPosts.jsx
│   │   └── WritePost.jsx
│   └── tailwind.css
├── tailwind.config.cjs
└── vite.config.js

專案技術

  • Node.js v16.15.0
  • React.js v18.2.0-frontend development with functional component separation
  • React Router v6.9.0-Route switching and page navigation
  • React Hook Form v7.43.7-Form validation tool for member registration, login, and comment posting functionality
  • Vite v4.1.0
  • Axios v1.3.4
  • Tailwind CSS v3.2.7-layout and custom styling for components
  • SweetAlert2 v11.7.3
  • Flowbite v1.6.4

開發工具

Vercel Visual Studio Code NPM Git GitHub Postman

聯絡作者

你可以透過以下方式與我聯絡

Releases

No releases published

Packages

 
 
 

Contributors