Showing
1 changed file
with
52 additions
and
53 deletions
1 | -# 个人博客 | 1 | +# Running Football Blog |
2 | 2 | ||
3 | ## About the Project | 3 | ## About the Project |
4 | 4 | ||
... | @@ -8,20 +8,19 @@ | ... | @@ -8,20 +8,19 @@ |
8 | 8 | ||
9 | #### Client | 9 | #### Client |
10 | 10 | ||
11 | - Article function: the content of the article supports Markdown syntax and the code is highlighted; | 11 | + 1. Article function: the content of the article supports `Markdown` syntax and the code is highlighted; |
12 | -Tag function: retrieve article data by tag classification; | 12 | + 2. Tag function: retrieve article data by tag classification; |
13 | -Sidebar function: click ranking, webmaster recommendation, tag classification, etc.; | 13 | + 3. Sidebar function: click ranking, webmaster recommendation, tag classification, etc.; |
14 | -Search function: search the title and abstract of the article by keywords, and support search highlighting; | 14 | + 4. Search function: search the title and abstract of the article by keywords, and support search highlighting; |
15 | -Message function: you can like, reply to comments, count comments and the total number of replies, support Emoji emoticons; | 15 | + 5. Message function: you can like, reply to comments, count comments and the total number of replies, support `Emoji` emoticons; |
16 | -Other functions: image lazy loading, paging, sidebar top and one-click top, etc.; | 16 | + 6. Other functions: image lazy loading, paging, sidebar top and one-click top, etc. |
17 | 17 | ||
18 | #### Management | 18 | #### Management |
19 | 19 | ||
20 | - Authority management: CRUD administrator, who can assign authority; | 20 | + 1. Authority management: CRUD administrator, who can assign authority; |
21 | - Article management: CRUD articles, article covers support local upload, article content supports Markdown syntax editing; | 21 | + 2. Article management: CRUD articles, article covers support local upload, article content supports `Markdown` syntax editing; |
22 | - Label management: CRUD label, label background color supports custom selection with Vue-Color plug-in; | 22 | + 3. Label management: CRUD label, label background color supports custom selection with `Vue-Color` plug-in; |
23 | - Message management: CRUD comments and replies; | 23 | + 4. Message management: RD comments and replies |
24 | - | ||
25 | 24 | ||
26 | 25 | ||
27 | #### Built With | 26 | #### Built With |
... | @@ -42,92 +41,92 @@ Other functions: image lazy loading, paging, sidebar top and one-click top, etc. | ... | @@ -42,92 +41,92 @@ Other functions: image lazy loading, paging, sidebar top and one-click top, etc. |
42 | 41 | ||
43 | ## Getting Started | 42 | ## Getting Started |
44 | 43 | ||
45 | -1.安装配置git环境,使用git clone指令下载项目 | 44 | +1. Install and configure the git environment, use the git clone command to download the project |
46 | 45 | ||
47 | -2.安装、配置node、vue、mongodb环境 | 46 | +2. Install and configure node, vue, mongodb environment |
48 | 47 | ||
49 | -3.查看项目结构,导入相关依赖,加载项目配置 | 48 | +3. View the project structure, import related dependencies, load the project configuration |
50 | 49 | ||
51 | -4.配置数据库环境和初始化用户信息 | 50 | +4. Configure the database environment and initialize user information |
52 | 51 | ||
53 | -5.启动项目 | 52 | +5. Start the project |
54 | 53 | ||
55 | 54 | ||
56 | 55 | ||
57 | ### Installation | 56 | ### Installation |
58 | 57 | ||
59 | -#### 环境准备 | 58 | +#### Environmental preparation |
60 | 59 | ||
61 | - node.js环境配置安装 | 60 | + node.js Environment configuration installation |
62 | 61 | ||
63 | - vue、vue-cli环境配置安装 | 62 | + vue、vue-cli Environment configuration installation |
64 | 63 | ||
65 | - mongodb、mongodb Compass环境配置安装 | 64 | + mongodb、mongodb Compass Environment configuration installation |
66 | 65 | ||
67 | 66 | ||
68 | 67 | ||
69 | -#### 运行说明 | 68 | +#### Operating instructions |
70 | 69 | ||
71 | -> vue项目配置启动 | 70 | +> Vue project configuration start |
72 | 71 | ||
73 | ```shell | 72 | ```shell |
74 | --- yarn指令安装 | 73 | +-- yarn Instruction to install |
75 | npm install -g yarn | 74 | npm install -g yarn |
76 | npm install yarn --save | 75 | npm install yarn --save |
77 | 76 | ||
78 | --- vue项目依赖引入 | 77 | +-- Vue project dependency introduction |
79 | npm install | 78 | npm install |
80 | cnpm install | 79 | cnpm install |
81 | 80 | ||
82 | --- 扩展组件依赖引入 | 81 | +-- Extension component dependency introduction |
83 | -vue-lazyload插件:yarn add vue-lazyload -S | 82 | +vue-lazyload Plugin:yarn add vue-lazyload -S |
84 | -vue-color插件:yarn add vue-color -S | 83 | +vue-color plugin:yarn add vue-color -S |
85 | -style-resources-loader插件:yarn add style-resources-loader -D | 84 | +style-resources-loader plugin:yarn add style-resources-loader -D |
86 | -mdrkdown语法支撑相关插件:marked、highlightJs yarn add marked highlightJs -S | 85 | +mdrkdown syntax support related plugins:marked、highlightJs yarn add marked highlightJs -S |
87 | ``` | 86 | ``` |
88 | 87 | ||
89 | 88 | ||
90 | 89 | ||
91 | -> mongodb配置: | 90 | +>mongodb configuration: |
92 | 91 | ||
93 | - mongodb配置信息对应:`code/server/config.js`文件配置数据库信息 | 92 | + Mongodb configuration information correspondence:`code/server/config.js`File configuration database information |
94 | 93 | ||
95 | 94 | ||
96 | ```powershell | 95 | ```powershell |
97 | -// 进入mongodb安装目录,执行指令开启mongo服务 | 96 | +// Enter the ‘mongodb’ installation directory and execute the command to start the ‘mongo’ service |
98 | > mongo | 97 | > mongo |
99 | 98 | ||
100 | -// 显示数据库列表 | 99 | +// Display database list |
101 | > show dbs | 100 | > show dbs |
102 | 101 | ||
103 | -// 新建一个rfBlog数据库 | 102 | +// Create a new ‘rfBlog’ database |
104 | > use rfBlog | 103 | > use rfBlog |
105 | 104 | ||
106 | -// 在rfBlog数据库创建一个rf用户,密码为123456 | 105 | +// Create an rf user in the ‘rfBlog’ database with a password of 123456 |
107 | > db.createUser({user:"rf",pwd:"123456",roles:[{role:"readWrite",db:'rfBlog'}]}) | 106 | > db.createUser({user:"rf",pwd:"123456",roles:[{role:"readWrite",db:'rfBlog'}]}) |
108 | 107 | ||
109 | -// 展示该库有哪些用户 | 108 | +// Show who the library has users |
110 | > show users | 109 | > show users |
111 | 110 | ||
112 | -// 数据库认证一下用户、密码,结果返回 1 表示认证成功 | 111 | +// The database authenticates the user and password, and the result returns 1 to indicate successful authentication |
113 | > db.auth("rf", "123456"); | 112 | > db.auth("rf", "123456"); |
114 | ``` | 113 | ``` |
115 | 114 | ||
116 | 115 | ||
117 | 116 | ||
118 | -> 初始化系统用户信息 | 117 | +> Initialize system user information |
119 | 118 | ||
120 | ```powershell | 119 | ```powershell |
121 | -// 开启mongo服务 | 120 | +// Start ‘mongo’ service |
122 | > mongo | 121 | > mongo |
123 | 122 | ||
124 | -// 显示数据库列表 | 123 | +// Display database list |
125 | > show dbs | 124 | > show dbs |
126 | 125 | ||
127 | -// 进入到wallBlog数据库 | 126 | +// Access to the ‘wallBlog’ database |
128 | > use rfBlog | 127 | > use rfBlog |
129 | 128 | ||
130 | -// 往该库的users集合插入一条数据,账号:admin 密码:123456 | 129 | +// Insert a piece of data into the ‘users’ collection of the library, account number: admin password: 123456 |
131 | > db.users.insert({ | 130 | > db.users.insert({ |
132 | "pwd" : "e10adc3949ba59abbe56e057f20f883e", | 131 | "pwd" : "e10adc3949ba59abbe56e057f20f883e", |
133 | "username" : "admin", | 132 | "username" : "admin", |
... | @@ -136,36 +135,36 @@ mdrkdown语法支撑相关插件:marked、highlightJs yarn add marked highlig | ... | @@ -136,36 +135,36 @@ mdrkdown语法支撑相关插件:marked、highlightJs yarn add marked highlig |
136 | ] | 135 | ] |
137 | }) | 136 | }) |
138 | 137 | ||
139 | - // 查询该库下的集合(类似于关系型数据表) | 138 | + // Query the collection under the library (similar to a relational data table) |
140 | > show collections | 139 | > show collections |
141 | 140 | ||
142 | -// 查询users集合下的所有数据 | 141 | +// Query all data in the ‘users’ collection |
143 | > db.users.find() | 142 | > db.users.find() |
144 | ``` | 143 | ``` |
145 | 144 | ||
146 | 145 | ||
147 | 146 | ||
148 | -> 项目启动(前后端分离概念,需对应分别启动前端界面和后台接口服务) | 147 | +> Project start (the concept of front-end and back-end separation, the front-end interface and back-end interface services need to be started respectively) |
149 | 148 | ||
150 | ```powershell | 149 | ```powershell |
151 | -// 本地开发管理端页面 | 150 | +// Local development management page |
152 | yarn dev:admin | 151 | yarn dev:admin |
153 | -// 本地开发客户端页面 | 152 | +// Local development of the client page |
154 | yarn dev:client | 153 | yarn dev:client |
155 | -// 启动后台接口服务 | 154 | +// Start the background interface service |
156 | yarn server | 155 | yarn server |
157 | ``` | 156 | ``` |
158 | 157 | ||
159 | 158 | ||
160 | 159 | ||
161 | -> 项目打包 | 160 | +> Project packaging |
162 | 161 | ||
163 | ```powershell | 162 | ```powershell |
164 | -// 项目打包 - 管理端 | 163 | +// Project packaging-management side |
165 | yarn build:admin | 164 | yarn build:admin |
166 | -// 项目打包 - 客户端 | 165 | +// Project packaging-client |
167 | yarn build:client | 166 | yarn build:client |
168 | -// 查看打包信息 | 167 | +// View packaging information |
169 | yarn analyz | 168 | yarn analyz |
170 | ``` | 169 | ``` |
171 | 170 | ... | ... |
-
Please register or login to post a comment