Web开发：我希望得到的编程学习路线图
fmms 12年前
英文原文： <a href="/misc/goto?guid=4958332063356387963">Learning to Code: The Roadmap I Wish I Had Been Given</a> <p> 对于一些没有编程经验的人来说，一开始就学习 web 开发会让人觉得非常困难。因为你的能力处于初始阶段（你根本不知道你缺少哪方面的知识），所以在你能够建立一个任意复杂的网站之前，你可能会认为你需要大概几个月的时间来夯实计算机方面的基础知识。</p> <p> 其实并非如此！web 开发和 CS 是不同的，你完全可以在没有太多计算机基础的情况下开发学习 web 开发。我这样说，完全是根据我自己的经验。</p> <p> 六个月前，当我开始学习 web 开发时，我还是一个法律学校的在读学生，而且几乎不懂任何关于编程的东西—仅仅在开始学习的前几个小时了解过一些基本知识。四个月后，我收到了来自 Pivotal Labs 的 offer，接着我离开了法律学校，搬到了旧金山。我非常的幸运地遇到了一位极为优秀导师（从黑客学校获得的收获绝对不能忽视），所以我不认为我的故事非 常具有代表性。但是我认为这很清楚的表明那些没有计算机背景的人同样可以成为 web 开发者，而且它所花费的时间可能比你想像的要少。</p> <p> 这篇博文是为了尝试帮助那些刚开始学习 web 开发的人们。这里展示了一个大概流程，这个路线图会“告诉你在最初的几月里需要做什么”，它也是我最开始编码所遵循的路线。</p> <p> 写这样一篇博文的想法已经在我脑海里有一段时间了，只是我认为自己知之甚少，所以始终没有提笔。在写这篇文章时我还是觉得自己知道的不限，所以如果你在下面的文章中发现任何错误与不正确的地方，请一定帮我指正。</p> <p style="text-align:center;"><a title="Learning to Code" rel="lightbox[15213]"><img title="Learning to Code" alt="Web开发：我希望得到的编程学习路线图" src="https://simg.open-open.com/show/9bb641d10784ccc844bb7bae3118d789.jpg" width="550" height="300" /></a></p> <p> <strong>四个部分</strong></p> <p> 这里大致列出了长短不一的四个部分知识要点，在你学习的前几个月里你需要掌握这些要点。</p> <p> 1） web 框架的基础知识（如 Ruby on Rails），又名“包含网站模块及它们之间连接结构”。</p> <p> 2） 前端开发，又名“如何使内容出现在正确的位置上，而且在<a title="浏览器" href="/misc/goto?guid=4958330453578757110" target="_blank">浏览器</a>中表现得好看”。</p> <p> 3） 版本控制，又名“如何使用免费易用的软件，使<a title="程序员的本质" href="/misc/goto?guid=4958202204547787659">程序员</a>能够有组织地保存他们的程序版本。这样他们就不用担心修改代码所带来的版本混乱，同时也能够很好地与其它程序员协同开发”。</p> <p> 4） 部署，又名“如何真正地将你的网站放到互联网上”。</p> <p> 我把这几个部分标记为 1 到4，但这并不意味着它们之间存在任何特定的顺序。你可以同时学习这些东西。</p> <p> <strong>第一部分：选择一种 web 框架，并开始学习它</strong></p> <p> 在这个部分所需要花费的时间很像这种模式，即“选择一种 web 框架”=>“大概 10 分钟之内”。“学习这种框架”=>“很多很多个（快乐的）小时”。</p> <p> 现在有很多的 web 框架可供选择。而我要讨论的是 Ruby on Rails，它是我所知道的最好的框架，因为到处都有关于它的优秀的资源。</p> <p> 那么，什么是 web 框架？我的理解是这样的：有框架之前，人们在决定做一个新的网站时，往往每次都需要添加一些相同的东西到新的网站。由于这些都是一些重复无聊的工作，所以 程序员开发出了框架（例如 Rails），这些框架能够把很多重复性的工作移到 web 开发之外。人们喜欢说，Rails 代表“约定优于配置”。它的意思是，假如你想按照约定的方式开发，那么 Rails 会使 web 开发变得简单。</p> <p> 相关的资源：</p> <p> 我刻意只选择了无数 Rails/Ruby 资源的一小部分来说，因为可选择的资源实在太多了。</p> <p> I、阅读 <a href="/misc/goto?guid=4958332848785339293" rel="nofollow" target="_blank">Michael Hartl’s精彩且免费的确 Rails 教程</a>。 一个提示：Hartl 的教程虽然非常的清晰全面，但你也不可能轻松的完全理解里面的所有内容。细细地去品味它，一旦你发现一些不能理解的东西时，你一定要弄清楚。如果你发现自 己只是盲目地去复制/粘贴它的代码，只是为了完成而完成教程，那么请你停下来。当遇到不懂的知识点时，立即去下面的资源中查找：</p> <p> ● Google。有些人在博客或论坛上写的内容可能正是你想知道的东西。当你遇到任何问题时首先去查找 Google。</p> <p> ● <a href="/misc/goto?guid=4958188962313964239" rel="nofollow" target="_blank">Stack Overflow</a>。在那里程序员回答问题的速度绝对让人吃惊（我的问题往往都在一个小时内得到答案）。</p> <p> ● <a href="/misc/goto?guid=4958332850344159353" rel="nofollow" target="_blank">Railscasts</a>。Ryan Bates 拥有超过 300 与 Rails 相关的线上直播主题。非常惊人的资源。</p> <p> ● <a href="/misc/goto?guid=4958332851141812441" rel="nofollow" target="_blank">Rails Guides</a>。这些真正的专业指南是由 Rails 的核心团队成员所写。这些里面的东西需要时间去消化理解（因为里面的大多数内容都是给有经验的程序员准备的），但是还是有一些介绍性的东西可以拿来学习。</p> <p> II、在进行I学习的同时，Hartl 将告诉你 Rails 的工作原理。但是如果你不懂 Ruby，那么太多的 Rails 会让你觉得像在变魔术。这里列出了你在学习 Ruby 时应该用到的一些资源，你应该按照资源列出的顺序来学习它们：</p> <p> ● 前往 <a href="/misc/goto?guid=4958332851943390353" target="_blank">Codecademy</a> 学习编程的基本元素（循环，数据结构）。目前 Codecademy 教程是用 Javascript 讲的，不过没关系—反正无论如何你也是要学 Javascript 的，况且现在的重点主要是熟悉编码的基本要素。（强烈建议：如果你想让学习更有挑战，登录 <a href="/misc/goto?guid=4958332852746363134" rel="nofollow" target="_blank">projecteuler.net</a>，然后用自己所学的东西来解决上面的一些问题）。</p> <p> ● 阅读浏览这个优秀的 <a href="/misc/goto?guid=4958332853544955871" rel="nofollow" target="_blank">Ruby 教程</a>。当你阅读它时，打开你的终端（如 Mac 上的 iterm），打开 irb（the interactive ruby shell），并立即开始实践你正在学习的语法。（搜索“terminal”和“irb”，如果你压根不知道它们是什么。）</p> <p> ● 在做上述工作的同时，下载并阅读 <a href="/misc/goto?guid=4958332854342077784" rel="nofollow" target="_blank">Ruby Koas</a>。它是一系列丰富有趣的练习，这些练习涵盖了大多数 Ruby 的基础知识。</p> <p> ● 最后，阅读 <a href="http://www.amazon.com/Eloquent-Ruby-Addison-Wesley-Professional-Series/dp/0321584104/ref=sr_1_1?ie=UTF8&qid=1330902043&sr=8-1" rel="nofollow" target="_blank">Eloquent Ruby</a>。Eloquent Ruby 适合那些对编程已经达到某种程度的人，所以在你读完 Koans 和 Ruby 教程之前不要去读它。Eloquent Ruby 将不仅告诉你 Ruby 的工作原理，还会告诉你应该如何使用 Ruby（例如，Ruby 程序员决定的方式就是最好的实践方式）。</p> <p> <strong>第二部分：学习前端的东西</strong></p> <p> 对于“前端”和“后端”不完整/不准确的定义可能会是这样的：web 开发中的“后端”是指你存储和组织网站数据的地方。例如 Yelp 这样的网站要存储很多东西：它的用户和用户的个人资料、大量的餐厅信息、哪个用户对一个特别的餐厅做了什么评价，等等。</p> <p> Yelp 把这些信息存储在服务器上，这些服务器就是分布在不同地方的大型计算机。当你搜索“Pizza in San Francisco”，你的计算机会发送一个请求到 Yelp 的服务器，Yelp 服务器收到后回发 HTML 形式的请求信息（Yelp 每次都以这种方式来指示服务器的行为方式）到你的浏览器，浏览器会被渲染（例如：将 HTML 分离成文本和图片，然后让这些图片和文本在浏览器窗口中以正确的方式显示出来）。这后面的一部分—有关数据应该如何出现在用户窗口的指令（而不是什么数据 应该被回送）—就是“前端”。</p> <p> 相关的资源：</p> <p> ● 在 <a href="/misc/goto?guid=4958332855934747358" rel="nofollow" target="_blank">w3schools</a> 上学习 HTML 和 CSS。编注：谢谢下面的一些评论者指出了 w3schools 的不足。大家可以转到 <a href="/misc/goto?guid=4958332856739455360" rel="nofollow" target="_blank">w3Fools</a> 获取一些更好的资源列表。HTML 是一种标记语言，用来管理页面的结构。例如，需要有一个页头，后面要跟一个段落。CSS 则决定这个页面显示出来的样式。例如，页头的字体大小为 18，跟着的段落中文字内容为蓝色。</p> <p> ● 学习 Javascript。Javascript 决定了页面上的元素如何表现。例如，页头开始时会被隐藏，但当用户点击某个按钮时又会渐渐地显示在页面上。这里有一个非常优秀的 Javascript 框架称之为 jQuery，它基本上适合每个人使用，而且学习起来有趣直观。这里有一个小型的教程，你可以从这里开始学习：<a href="/misc/goto?guid=4958332857549562049" rel="nofollow" target="_blank">http://docs.jquery.com/Tutorials</a>。</p> <p> <strong>第三部分：学习版本控制（如：Git）</strong></p> <p> 大致地说，版本控制系统使程序员能够在任何时间点及时的保存（正式命名为“提交”）他们的代码。当一个项目结束时，一个程序员可能已经积累了数百或数千份这样的代码备份。</p> <p> 我之前并没有意识到版本控制的重要性。当我在写一篇文章时，我并没有把我对文章做的每一次修改保存到 Word 文档中。当我写代码时，情况会有所不同吗？</p> <p> 事实证明，答案至少是两方面的。首先，程序员写代码时往往会导致意想不到的问题。当问题发生时，我们可以很轻松地回滚到上一个正常工作的代码版 本。然后，程序员经常工作于同一个项目中。在这种情况下，他们需要能够很轻松地合并他们的代码。类似 Git 这样的版本控制系统（目前最流行的）可以很容易地做到以上两点。</p> <p> 相关的资源：</p> <p> Hartl 会向你介绍 Git，但他不会解释得太多。要了解更多，去这里：</p> <p> <a href="/misc/goto?guid=4958332858348579648" rel="nofollow" target="_blank">● Git 介绍</a>：由 Github 的人员建立（这是一个了不起的网站，它让程序员很容易地共享代码并协同工作—你应该最先访问 Github 去学习）。</p> <p> <a href="/misc/goto?guid=4958332859145288403" rel="nofollow" target="_blank">● Git 进阶</a>：感谢评论者 Polygonchorus 提供的这个网站，看起来真的很棒。</p> <p> <a href="/misc/goto?guid=4958332859945473825" rel="nofollow" target="_blank">● Git 指南</a>：新颖且简单。在这里可以学习基本的命令。</p> <p> <a href="/misc/goto?guid=4958183580154485805" rel="nofollow" target="_blank">● Git 的社区图书</a>：一个很好的参考资料，你可能不需要从头到尾的通篇阅读它。</p> <p> <strong>第四部分：学习如何部署（如 Heroku）</strong></p> <p> 当你开发网站时，绝大多数时间你都会在你的开发环境中去验证检查—换句话说，就是在你自己的电脑上，而不是在互联网上。</p> <p> 拥有这样一个开发环境的理由很简单：将你的代码上载到一个远程服务器需要一定的时间（例如，上载到互联网中一个实际的服务器上）。由于你的网站 正处于开发阶段，你需要不断地检查你的网站，而每次当你上载新的代码时，你都需要 20-30秒去等待服务器的响应，然后才能看到新代码运行的效果，这确实很烦人。</p> <p> 当你觉得准备好了，你可以很容易地使用 Heroku 来部署你的代码（Hartl 说明了怎样去部署）。这里是在 Rails3 环境下设置 Heroku 的相关信息：<a href="/misc/goto?guid=4958332861488997896" rel="nofollow" target="_blank">http://devcenter.heroku.com/articles/rails3</a>。如果你想建立一个自定义的域名，Heroku 也提供了一个延伸的教程：<a href="/misc/goto?guid=4958332862287842483" rel="nofollow" target="_blank">http://devcenter.heroku.com/articles/custom-domains</a>。</p> <p> <strong>关于此路线图的一些重要想法</strong></p> <p> 以上的这个资源足够你学习几个月的，但它们不会带你走得更远。我只是希望，在学习过那么多知识之后，你能够从自己建立的项目中学习提高。下面是一些离别的想法：</p> <p> 选择一个能激发你兴趣的想法，并在你觉得准备好之前就付诸于实践。我甚至建议你在完成 Hartl 教程之前就开始你自己的项目。工作于自己的项目，是让你迷上 web 开发最容易的方法。</p> <p> 我在这里提到了一些优秀的学习资源，当你要建立一个自己的网站时，这些资源只涵盖了很小一部分知识。时刻保持查阅未知知识点的习惯，不用担心—即使是最好的程序员也需要这样做。</p> <p> 你会经常地遇到 bug 和其它一些问题。这可能会让人沮丧，但你要尽量保持冷静，并系统地去思考。记住实践是解决问题的最佳方法，同时记录下那些经常出现的 bug。当问题出现时，思考问题出现的可能路径（类似这样的推理过程：OK，我的用户无法正确登录。这可能由什么原因造成？嗯…这可能是A、B或C造成 的。如果是A，我可能会想到…）。写出来或者大声说出来，如果这样有帮助的话。千万不要只是坐在那里，盯着代码，并希望能够顿悟。</p> <p> 与其它程序员一起工作，并向他们学习。与其他人一起编码并讨论代码，我觉得这是最快最有趣的学习方式（我非常推荐结对编程）。当然，你能够做的对自己最好的事情可能是去<a href="/misc/goto?guid=4958332863082117276" rel="nofollow" target="_blank">黑客学校</a>。</p> <p> 祝你好运！</p> <p> —————————————-</p> <p> 有些评论指出，由于 web 开发只是编程的一个子集，本文标题用“学习 web 开发”取代“学习编程”可能更好。他们的观点非常对，所以我希望本文的标题不会误导人们认为 web 开发就是编程的全部（其实还有很多，很多我们不懂的东西）。这么理解吧，web 开发仍然是编程的一个子集，所以那些学习 web 开发的人同时也在学习如何编程。</p> <p> 编译：<a title="伯乐在线" href="/misc/goto?guid=4958185140659301754" target="_blank">伯乐</a>在线 – <a href="/misc/goto?guid=4958332864627481704" target="_blank">肖翔</a></p>