摘要：一個(gè)高仿的掘金，大部分是按照掘金的來實(shí)現(xiàn)的，個(gè)別地方就根據(jù)自己想法修修改改，只做了移動(dòng)端的部分，還做的部分就要花太多時(shí)間了，支持服務(wù)端渲染等，寫這個(gè)項(xiàng)目主要是對(duì)近幾個(gè)月所學(xué)的技術(shù)做個(gè)實(shí)踐，看看有哪里還有不足，以及在實(shí)際開發(fā)的時(shí)候會(huì)踩到哪些

一個(gè)高仿的掘金，大部分是按照掘金的ui來實(shí)現(xiàn)的，個(gè)別地方就根據(jù)自己想法修修改改，只做了移動(dòng)端的部分，還做pc的部分就要花太多時(shí)間了，支持服務(wù)端渲染、pwa等，寫這個(gè)項(xiàng)目主要是對(duì)近幾個(gè)月所學(xué)的技術(shù)做個(gè)實(shí)踐，看看有哪里還有不足，以及在實(shí)際開發(fā)的時(shí)候會(huì)踩到哪些坑，該怎么解決

yarn or npm install

# development
npm run dev:client
npm run dev:server

# production
npm run build
npm start

react

react-dom

react-router-dom

react-helmet （設(shè)置title及meta）

react-loadable

react-redux

redux-connect （異步路由跳轉(zhuǎn)）

react-router-config

react-virtual-list （長(zhǎng)列表渲染）

prop-types

@rematch/core （rematch 一個(gè)更好用的redux）

@rematch/loading （調(diào)用effects時(shí)，自動(dòng)設(shè)置loading）

immer （以帶副作用的方式修改數(shù)據(jù)并返回新引用的數(shù)據(jù)，不會(huì)影響原始數(shù)據(jù)）

axios

babel-polyfill

classnames

lodash-es

react-swipe

react-toastify

react-content-loader （內(nèi)容占位的loading）

react-lazyload

react-swipe

swipe-js-is

husky （husky注冊(cè)git hook）

lint-staged （對(duì)被提交的文件依次執(zhí)行寫好的任務(wù)）

webpack

eslint

express

公共頭部

登錄

首頁

文章點(diǎn)贊

切換分類

文章頁

評(píng)論列表

評(píng)論點(diǎn)贊

推薦文章列表

沸點(diǎn)頁

小冊(cè)

開源庫

活動(dòng)頁

用戶主頁

關(guān)注用戶

用戶動(dòng)態(tài)列表

用戶專欄

用戶沸點(diǎn)

用戶的點(diǎn)贊

用戶關(guān)注的標(biāo)簽

大概就是以上的功能，登錄的話只支持手機(jī)登錄，或者可以手動(dòng)設(shè)置一個(gè)這樣的cookie，再刷新頁面就登錄成功了

const userInfo = {
    token: data.token,
    clientId: data.clientId,
    uid: data.user.uid
}
Cookies.set("userInfo", userInfo, { path: "/" })

├─.gitattributes
├─ecosystem.json    pm2部署配置
├─src
|  ├─app.jsx
|  ├─entry-client.js
|  ├─entry-server.js
|  ├─registerServiceWorker.js
|  ├─utils      工具函數(shù)
|  ├─store      store配置
|  ├─routes     路由配置
|  ├─models     store的model文件，創(chuàng)建state、reducers、effects
|  ├─containers     頁面組件
|  ├─components     展示組件
|  ├─assets     需要webpack處理的資源
|  ├─api      對(duì)請(qǐng)求庫的封裝及獲取數(shù)據(jù)的方法
├─server    服務(wù)端渲染
├─public    靜態(tài)資源
├─build     webpack配置
|   ├─dll   生成dll的配置
├─.vscode
|    └launch.json

要是感興趣的話，可以自行看代碼，大部分內(nèi)容還是比較簡(jiǎn)單的，有問題的話歡迎提出了一起討論

項(xiàng)目地址
線上地址