博客

当一名 Web 工程师，并不需要成为网络工程师，整个思科认证啥的。不过，多少得懂一点网络的基础，比如 IP 地址是干啥的，公网 IP 与内网 IP 的区别，DNS 怎么配置，局域网是什么意思，什么是 http，ftp，端口号 等等。我们并不需要知道这些东西具体是怎么实现的，只要有个自己的理解就行。

网络

网络就是一些设备，用某种方式连接到了一块儿，你知道我在这，我也知道你在那儿，连接到一块儿的设备现在太多样化了，随处可见的电脑，手机，平板，越来越多的像手表，电冰箱，热水器 ...

互联网

世界范围的网络。

局域网

小范围的网络。你家里可能就会有一个局域网，这个网络通过一个家用的路由器搭建，你的电脑，平板，手机这些设备都在家里的局域网上，它们之间可以直接通过局域网进行交流，比如手机发个图片或者视频给你的电脑。

IP 地址

在网络上的设备都需要一个地址，这个地址有点像手机号，拨通朋友的手机号可以跟朋友聊聊天，你的朋友也可以通过你的手机号找到你。这个地址就是 IP 地址，它相当于是网络上的设备的手机号。

现在，你需要一个现代的文本编辑软件，它会陪你相当长的时间。可以选择的太多了，我建议用一款开源的，跨平台，用现代技术开发的编辑器，比如 Brackets ，它的背后是著名的 Adobe 公司，或者也可以选择 Atom ，它是 Github 领头开发的，Github 的团队应该知道自己在干什么，也了解开发者的真正需求。

任何一款编辑器都有自己的特点，我觉得没必要在选择上花太多时间，来回比较也没太大意义，习惯可以干掉一切。我们就先用 Atom 这款吧 ：）

Atom

一款编辑器入门还是很简单的，学会怎么样创建，打开，编辑，保存文件就行。剩下的就是慢慢熟悉，Atom 会不断带给你惊喜，如果你想简化或者加快平时工作中的某些任务或者动作，你就可以去搜索一下，Atom 要么本身就为你提供你需要的功能，没有的话，也可以通过现成的插件（Packages）或者自定义的方式解决。

你决定要把 Web 当成自己的事业，并且已经开始学习了。你听到的，看到的，或者自己感觉的，很可能是错的。一开始，我们就用更好的方法去学习与做事，会节省很多时间，也能减轻痛苦。找不到方向，不知道从哪里下手，今天就跟宁皓一起，一切都在这里开始：）

遇到的问题

学习 Web 设计与开发得去安装很多软件，Git，Node，Ruby，Virtualbox，Vagrant，Atom，Brackets，Chrome...  有些软件是你要直接用的，有些是其它软件所依赖的。安装这些东西，你得先找到它们的官方网站，然后下载适合自己系统的版本，双击安装，Next，Next，下一步，下一步  ...  完成！安装完以后，你发现还不能用，因为你不知道这个软件还需要你去安装一个其它的东西。

命令行工具是做 Web 设计与开发的必备工具。通过输入一些命令，去做你要做的事情。不同的命令可以做不同的事情，比如基本的文件与目录的操作，去安装，更新，删除软件，控制与管理服务器等等。

很多 Web 项目都自带了命令行工具，会提供一些跟项目相关的命令，可以用到平时的开发流程里面。比如 Drupal 的 drush ，WordPress 的 WP-CLI，Laravel 的 artisan  等等，基本上一个现代的 Web 项目都会附带一个命令行工具。

准备

在哪里输入要执行的命令？不同的操作系统提供了不同的软件，Windows 上可以使用 系统自带的 命令提示符（cmd） 或者 Powershell（win7 以上的版本，推荐使用） ，在 Mac 上用的是系统自带的 终端（Terminal）。

《 Remote 》是一本关于在公司实行远程办公的书，书中介绍了远程办公的好处，挑战，与方法。宁皓 QQ 群（240746680）里的 Cooper 推荐。我离开传统的办公室也快十年了，一直也是用这种远程办公的方式工作，读了这本书，对我又有了新的启发。

中文版在线阅读《 Remote 》

中文版翻译：梅晨斐

不断完善中...

学习前端

所有的 Web 项目都离不开前端开发，前端的设计决定了项目的界面，与用户的交互功能。HTML，CSS，JavaScript 这几样东西是前端开发的重要组成部分，一个高效的工作流程也是必不可少的。

语言

HTML，CSS，JavaScript。

HTML 与 CSS

很难把 HTML 与 CSS 分开，通过下面这几个课程，你可以了解 HTML 与 CSS 的基础，去创建一般的静态页面。

一个网页的结构，是用 HTML 创建的，网页上的不同部分与内容，需要用到不同的 HTML标签去标记，比如网页上的一段文字，要用 <p> 标签去包装一下，内容的标题需要用到标题标签，像 <h1> ... <h6> ，表示不同级别的标签。

Gulp 与 Grunt 都是可以自动化执行任务的工具。在平时开发的流程里面，一定有一些动作需要手工的重复的去执行，比如把一个文件复制到一个指定的地方，把多个 JS 或者 CSS 文件合并成一个文件，并且最小化一下，去把写好的 Sass 或者 Less 编译成 CSS，最小化处理图像文件，创建一个可以实时刷新的本地服务器等等。

只要你觉得有些动作是要重复去做的，一般你就可以把这些动作创建成一个 Gulp 或者 Grunt 的任务，然后在指定的条件下，比如文件发生变化以后，自动去执行这些任务。

Gulp 与 Grunt 选择哪个？

Gulp 与 Grunt 做的事情都差不多，只不过背后的原理还有方法不同。在项目里用哪个都可以，完全取决于个人喜好。另外也可以根据你的项目用到的其它的东西来决定，比如 Bootstrap 这个前端框架就用到了 Grunt，Semantic UI，AngularJS  用的是 Gulp 。相比，Grunt 比较老牌，根据在 Github 上的星星数，Gulp 更受欢迎。

新年了，小雪给大伙挑了几个礼物（保温杯），数量是有限地，您在文章下面留下评论，然后把您的快递信息发到 53166188 这个 qq 的邮箱里，下礼拜一，由犬女随机选出几位朋友，在新年之前给您寄过去，到时候我在您的评论下面会留下快递单号。没能得到杯子的朋友，请收下我们的祝福吧，新年快乐：）图片上这只杯子是我自个儿用的，也是小雪给买的，快一年了，我觉得挺好，送您的是比这个更可爱一点的（小一些）。

家，给人安心。最近我又搬到了第十三个被自己称为是家的地方。让我回想起所有以前的家。

草房

84 年春节过后几天，我见到了第一个家，在黑龙江的一个小地方，她是泥跟草混到一块儿建成的，东北叫草房，墙是泥做的，顶是厚厚的草。这是爷爷的房子，一进门左右是两间屋，左边是我的家，右边是爷爷家，往里走是厨房，有两个大铁锅，得点柴火做饭，中间有口压水井，想把水从地下抽出来，得先往井里倒点水，然后不停的压，一会儿冰凉的水就出来了。

屋子后面有个小院子，里面有奶奶种的罂粟，黄瓜，还有我埋的一个盒子。一到七夕，奶奶会给我讲牛郎跟织女的故事，她说那一天你可以在黄瓜架下面听到她们说的话，我都会跑到黄瓜架下面去努力的听，有时候真的感觉听到了一些什么。然后我会去把自己埋的盒子挖出来，假装找到了宝藏。我家在林区，经常得注意防火，有时候风大，做饭前，妈会叫我出去看看，别人家的烟囱有冒烟的吗，我很认真，看到了冒烟的烟囱就回来跟妈汇报。