├── images ├── 10.png ├── 8.png ├── 9.png ├── vim.png ├── vscode-code.png └── vscode-icons.png ├── keybindings.json ├── LICENSE ├── .gitignore └── README.md /images/10.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dev-reading/practical-node-tutorial/HEAD/images/10.png -------------------------------------------------------------------------------- /images/8.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dev-reading/practical-node-tutorial/HEAD/images/8.png -------------------------------------------------------------------------------- /images/9.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dev-reading/practical-node-tutorial/HEAD/images/9.png -------------------------------------------------------------------------------- /images/vim.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dev-reading/practical-node-tutorial/HEAD/images/vim.png -------------------------------------------------------------------------------- /images/vscode-code.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dev-reading/practical-node-tutorial/HEAD/images/vscode-code.png -------------------------------------------------------------------------------- /images/vscode-icons.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dev-reading/practical-node-tutorial/HEAD/images/vscode-icons.png -------------------------------------------------------------------------------- /keybindings.json: -------------------------------------------------------------------------------- 1 | // 将键绑定放入此文件中以覆盖默认值 2 | [ 3 | { "key": "cmd+1", "command": "workbench.view.explorer" }, 4 | { "key": "cmd+2", "command": "workbench.view.search" }, 5 | { "key": "cmd+3", "command": "workbench.view.scm" }, 6 | { "key": "cmd+4", "command": "workbench.view.debug" }, 7 | { "key": "cmd+5", "command": "workbench.view.extensions" } 8 | ] -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2017 他们叫我狼叔 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | 8 | # Runtime data 9 | pids 10 | *.pid 11 | *.seed 12 | *.pid.lock 13 | 14 | # Directory for instrumented libs generated by jscoverage/JSCover 15 | lib-cov 16 | 17 | # Coverage directory used by tools like istanbul 18 | coverage 19 | 20 | # nyc test coverage 21 | .nyc_output 22 | 23 | # Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files) 24 | .grunt 25 | 26 | # Bower dependency directory (https://bower.io/) 27 | bower_components 28 | 29 | # node-waf configuration 30 | .lock-wscript 31 | 32 | # Compiled binary addons (http://nodejs.org/api/addons.html) 33 | build/Release 34 | 35 | # Dependency directories 36 | node_modules/ 37 | jspm_packages/ 38 | 39 | # Typescript v1 declaration files 40 | typings/ 41 | 42 | # Optional npm cache directory 43 | .npm 44 | 45 | # Optional eslint cache 46 | .eslintcache 47 | 48 | # Optional REPL history 49 | .node_repl_history 50 | 51 | # Output of 'npm pack' 52 | *.tgz 53 | 54 | # Yarn Integrity file 55 | .yarn-integrity 56 | 57 | # dotenv environment variables file 58 | .env 59 | 60 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Practical Node Tutorial 2 | 3 | 实用Node.js，简单粗暴，新手学习的最短曲线 4 | 5 | 目录 6 | 7 | - 安装环境 8 | - 准备工作目录 9 | - 常用软件 10 | - 编辑器推荐VSCode 11 | - 学会VSCode调试 12 | - Mongo数据库 13 | - ... 14 | 15 | ## 安装环境 16 | 17 | 3m安装法 18 | 19 | - nvm（node version manager）【需要使用npm安装，替代品是yrm（支持yarn）】 20 | - nrm（node registry manager）【需要使用npm安装，替代品是yrm（支持yarn）】 21 | - npm（node packages manager）【内置，替代品是n或nvs（对win也支持）】 22 | 23 | ### nvm 24 | 25 | node版本发布非常快，而且多版本共存可能性较大，推荐使用nvm来安装node 26 | 27 | ```shell 28 | $ curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.6/install.sh | bash 29 | 30 | $ echo 'export NVM_DIR="$HOME/.nvm"' >> ~/.zshrc 31 | $ echo '[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm' >> ~/.zshrc 32 | $ source ~/.zshrc 33 | 34 | $ nvm install 0.10 35 | $ nvm install 4 36 | $ nvm install 6 37 | $ nvm install 8 38 | ``` 39 | 40 | ### nrm 41 | 42 | https://registry.npmjs.com 是node官方的源（registry），服务器在国外，下载速度较慢，推荐安装nrm来切换源，国内的cnpm和taobao的源都非常快，当然，如果你想自建源也是支持的。 43 | 44 | ```shell 45 | $ npm install --global nrm --registry=https://registry.npm.taobao.org 46 | $ nrm use cnpm 47 | ``` 48 | 49 | ### npm 50 | 51 | nrm切换完源之后，你安装npm模块的速度会更快。 52 | 53 | ```shell 54 | $ npm install --global yarn 55 | ``` 56 | 57 | npm基本命令 58 | 59 | | 名称 | 描述 | 简写 | 60 | | --- | --- | --- | 61 | | npm install xxx | 安装xxx模块，但不记录到package.json里 | npm i xxx | 62 | | npm install --save xxx | 安装xxx模块，并且记录到package.json里，字段对应的dependency，是产品环境必须依赖的模块 | npm i -s xxx | 63 | | npm install --save-de xxx | 安装xxx模块，并且记录到package.json里，字段对应的dev-dependency，是开发环境必须依赖的模块，比如测试类的（mocha、chai、sinon、zombie、supertest等）都在 | npm i -D xxx | 64 | | npm install --global xxx | 全局安装xxx模块，但不记录到package.json里，如果模块里package.json有bin配置，会自动链接，作为cli命令 | npm i -g xxx | 65 | 66 | ## 准备工作目录 67 | 68 | 我的工作目录一般是 `~/workspace/github` 69 | 70 | ## 常用软件 71 | 72 | - 1）oh my zsh是我最习惯的shell，终端下非常好用 73 | 74 | 配合iterm2分屏 + spectacle全屏，几乎无敌 75 | 76 | - 2）brew是mac装软件非常好的方式，和apt-get、rpm等都非常类似 77 | 78 | 安装4个必备软件 79 | 80 | - brew install git 最流行的SCM源码版本控制软件 81 | - brew install wget 下载、扒站神器 82 | - brew install ack 搜索代码神器 83 | - brew install autojump 终端下多目录跳转神器 84 | 85 | - 3）vim 86 | 87 | 我虽然不算vim党，但也深爱着。janus是一个非常好用的vim集成开发环境。比如ctrl-p、nerdtree等插件都集成了，对我这种懒人足够了。 88 | 89 | ![Vim](images/vim.png) 90 | 91 | ## 编辑器推荐VSCode 92 | 93 | Visual Studio Code（以下简称vsc） 94 | 95 | - vsc是一个比较潮比较新的编辑器（跨平台Mac OS X、Windows和 Linux ） 96 | - vsc功能和textmate、sublime、notepad++，ultraedit等比较，毫不逊色 97 | - vsc尤其是在nodejs（调试）和typescript、go上支持尤其好 98 | - vsc提供了自定义 Debugger Adapter 和 VSCode Debug Protocol 从而实现自己的调试器 99 | 100 | 值得一学 101 | 102 | 下载安装VScode 103 | 104 | - 配置code命令 105 | - 配置快捷键 106 | - 安装vsconde-icons插件 107 | 108 | 配置code命令 109 | 110 | ![Vscode Code](images/vscode-code.png) 111 | 112 | 配置快捷键，最喜欢cmd + [1-5]，这和xcode习惯一直，非常棒 113 | 114 | ``` 115 | // 将键绑定放入此文件中以覆盖默认值 116 | [ 117 | { "key": "cmd+1", "command": "workbench.view.explorer" }, 118 | { "key": "cmd+2", "command": "workbench.view.search" }, 119 | { "key": "cmd+3", "command": "workbench.view.scm" }, 120 | { "key": "cmd+4", "command": "workbench.view.debug" }, 121 | { "key": "cmd+5", "command": "workbench.view.extensions" } 122 | ] 123 | ``` 124 | 125 | 安装vsconde-icons插件，对各种文件扩展都有icon显示，更直观 126 | 127 | ![Vscode Icons](images/vscode-icons.png) 128 | 129 | ## 学会VSCode调试 130 | 131 | express调试实例 132 | 133 | 这是我们最常用的调试 134 | 135 | 通过创建express项目构建，调试来演示vsc的具体用法 136 | 137 | ### 创建express项目 138 | 139 | 使用express-generator 140 | 141 | ``` 142 | ➜ examples git:(master) ✗ express helloworld 143 | 144 | create : helloworld 145 | create : helloworld/package.json 146 | create : helloworld/app.js 147 | create : helloworld/public 148 | create : helloworld/public/javascripts 149 | create : helloworld/public/images 150 | create : helloworld/public/stylesheets 151 | create : helloworld/public/stylesheets/style.css 152 | create : helloworld/routes 153 | create : helloworld/routes/index.js 154 | create : helloworld/routes/users.js 155 | create : helloworld/views 156 | create : helloworld/views/index.jade 157 | create : helloworld/views/layout.jade 158 | create : helloworld/views/error.jade 159 | create : helloworld/bin 160 | create : helloworld/bin/www 161 | 162 | install dependencies: 163 | $ cd helloworld && npm install 164 | 165 | run the app: 166 | $ DEBUG=helloworld:* npm start 167 | 168 | ➜ examples git:(master) ✗ cd helloworld 169 | ➜ helloworld git:(master) ✗ npm install 170 | ➜ helloworld git:(master) ✗ npm start 171 | ``` 172 | 173 | 测试express项目是正常的。 174 | 175 | 说明：如果是自己的项目，需要自己构建git版本控制的，faq里有具体说明。 176 | 177 | ### 修改launch.json的内容 178 | 179 | 输入command + t快速定位文件：.vscode/launch.json 180 | 181 | 修改launch.json的内容 182 | 183 | ``` 184 | { 185 | "version": "0.1.0", 186 | // List of configurations. Add new configurations or edit existing ones. 187 | // ONLY "node" and "mono" are supported, change "type" to switch. 188 | "configurations": [ 189 | { 190 | // Name of configuration; appears in the launch configuration drop down menu. 191 | "name": "Launch helloworld", 192 | // Type of configuration. Possible values: "node", "mono". 193 | "type": "node", 194 | // Workspace relative or absolute path to the program. 195 | "program": "examples/helloworld/bin/www", 196 | // Automatically stop program after launch. 197 | "stopOnEntry": false, 198 | // Command line arguments passed to the program. 199 | "args": [], 200 | // Workspace relative or absolute path to the working directory of the program being debugged. Default is the current workspace. 201 | "cwd": ".", 202 | // Workspace relative or absolute path to the runtime executable to be used. Default is the runtime executable on the PATH. 203 | "runtimeExecutable": null, 204 | // Optional arguments passed to the runtime executable. 205 | "runtimeArgs": ["--nolazy"], 206 | // Environment variables passed to the program. 207 | "env": { 208 | "NODE_ENV": "development" 209 | }, 210 | // Use JavaScript source maps (if they exist). 211 | "sourceMaps": false, 212 | // If JavaScript source maps are enabled, the generated code is expected in this directory. 213 | "outDir": null 214 | }, 215 | { 216 | "name": "Attach", 217 | "type": "node", 218 | // TCP/IP address. Default is "localhost". 219 | "address": "localhost", 220 | // Port to attach to. 221 | "port": 5858, 222 | "sourceMaps": false 223 | } 224 | ] 225 | } 226 | ``` 227 | 228 | 核心内容 229 | 230 | ``` 231 | "name": "Launch helloworld", 232 | "type": "node", 233 | "program": "examples/helloworld/bin/www", 234 | ``` 235 | 236 | program是要执行的express的入口。 237 | 238 | 这里的helloworld是项目，所以找到/bin/www目录即可。 239 | 240 | ### 点击调试按钮 241 | 242 | ![](images/8.png) 243 | 244 | 会弹出一个窗口，执行如下命令 245 | 246 | ``` 247 | cd '/Users/sang/workspace/github/vsc-doc'; env 'NODE_ENV=development' 'node' '--debug-brk=44412' '--nolazy' 'examples/helloworld/bin/www' 248 | Debugger listening on port 44412 249 | ``` 250 | 251 | 其实node-inspector也是这个原理的。 252 | 253 | ### 增加断点 254 | 255 | ![](images/9.png) 256 | 257 | ### 此时访问 258 | 259 | ``` 260 | curl http://127.0.0.1:3200/ 261 | ``` 262 | 263 | ### 进入调试界面 264 | 265 | ![](images/10.png) 266 | 267 | 和chrome的调试是一样的。 268 | 269 | 点击1）处按钮，打开控制台，配合调试，在控制台里查看对应的变量值 270 | 271 | 另外值得说明的是二级菜单里4个部分 272 | 273 | - a）variables变量 274 | - b）watch观察 275 | - c）call stack 调用栈 276 | - d）break points 断点 277 | 278 | 它和chrome的调试也是一样的，此处就不多讲了。 279 | 280 | ### VSCode的其他调试方式 281 | 282 | - 当前文件 283 | - 附加到进程 284 | - 附加到远程服务器 285 | - 前端：推荐debugger for chrome插件 286 | - 其他语言调试 287 | 288 | 课后作业：亲手debug一次，感受一下vsc的魅力 289 | 290 | ### 更多 291 | 292 | - [node-debug 三法三例之node debugger + node inspector](https://github.com/i5ting/node-debug-tutorial/) 293 | - 通过旧版本协议附加（node debug），Node.js 6.3- 294 | - 通过检查器协议附加（v8-inspector），版本依赖是Node.js 6.3+ 295 | - [node-inspector视频](http://i5ting.github.io/nodejs-video/node-inspector.mov) 296 | - [node-debug视频](http://i5ting.github.io/nodejs-video/node-debug.mov) 297 | 298 | 更多vsc用法，参见 https://github.com/i5ting/vsc 299 | 300 | ## Mongo数据库 301 | 302 | 为什么要用mongodb？ 303 | 304 | - 它是mean架构里的m（mongo） 305 | - 它是最像rdbms（mysql、oracle、db2）的nosql 306 | - 它的性能非常好，nosql天生优势，同时支持大数据处理和文件系统支持 307 | - 它对运维要求非常低，一般开发就可以 308 | - 它对事务支持不够好，但可以 309 | - 利用冗余，单个collection的事务处理做，宽表打扁 310 | - 通过二阶段法提交事务 311 | 312 | 安装 313 | 314 | ``` 315 | $ brew install mongo 316 | ``` 317 | 318 | 启动 319 | 320 | ``` 321 | $ npm i -g mh 322 | $ mh 323 | ``` 324 | 325 | mh内置2个命令 326 | 327 | - mh是当前目录启动，数据独立 328 | - mhg是在~下启动，共享数据 329 | 330 | 最好的mongodb管理客户端 331 | 332 | - https://robomongo.org/（mac） 333 | --------------------------------------------------------------------------------