零基础入门web开发(0) ——— 入门浅谈

前言

欢迎你来到web开发世界的大门前，挑战者。你接下来将要看到的这一系列文字，将会慢慢为你揭开IT开发的冰山一角。但在正式的教程开始前，希望你能耐心阅读一下下面这些有些冗长的“废话”

这篇教程要讲些什么？

有关web开发的方方面面，包括但不局限于以下的技能点：

html,css,js,php,mysql,linux,nginx,框架,MVC，包管理,安全,git,HTTP，库,npm,composer....

如果这些名词你都没听说过也没关系，我将使用30天左右的时间带你学会上面的技能，成为一名见习web工程师（没错只要1个月，激不激动，刺不刺激）

为什么要出这篇教程？

首先来谈谈作者我的背景吧，本人是一名普通的大二（三）计科狗，勉强算是掌握了一些web开发的基本技能（主要做后端开发），参与过一点小小的项目开发。之所以写这篇教程，是因为作者在大一的时候，作为一个对计算机充满兴趣的宅男，一心想学点技术（拿来装装逼），但是却一直无从下手，网上的学习资源虽然多，但是也十分零碎，不成体系，于是东学西学，走了很多弯路。

（下面这段话写给NEUQ-ACM俱乐部的孩子们，看不懂的可以跳过）现在处于俱乐部的交接时期，我身为副会长很遗憾的看到新一届的孩子们当中没有一位能够担任起维护俱乐部技术支持的存在，于此同时我也看到了和当年的我一样，希望学习技术但却感到彷徨的少年少女们，因此我萌生了这个想法，那就是，把自己走向开发正路的过程浓缩出来，为你们在开发这片广袤无垠的海洋上安放一只小船，让你们有能力去了解这片崭新而又充满活力的新天地。

总而言之，我最大的一个目的就是希望大家：

少走弯路！
少走弯路！
少走弯路！

（重要的事情说三遍）

这套教程要求你：

拥有一门编程语言的基础，理解编程的基本思想（没错文章标题里的零基础都是骗你的！不过你只要上过C/C++的基础课就够用）
对IT开发感兴趣，想要学习一门专业技能
有一定的自学能力和探索精神
学会提问和善用搜索引擎（这一点很重要）

应该以什么样的姿势去学习？

自顶向下的学习路径

通俗的说，就是不要急于掌握原理和底层的东西，而是先去了解这东西怎么用，再去了解它的工作原理。

曾经我大一的时候一心想学做开发，但是因为不明白怎么学，所以最终演变成了对各种语言基本语法和协议内容的死记硬背，一年过去了，东学西学折腾了不少，看样子啥都懂一点了，然而连一个像样的东西都写不出来，还严重打击了自己的自信心。

后来才明白从一开始就不应该先试图去学会那些所谓的语法和理念，而应该在上手会用后直接实践，在实践中遇到问题再着手去深入了解，这样理解更透彻，而且节约了时间。

这个就是自顶向下的学习方式，我觉得当今web世界存在那么多的分支，想要一一理清是不可能的，所以这种方式是最为合理和高效的。
二叉树式的自我扩展

二叉树只有一个根，但是随着层次的扩展叶子节点将会越来越多，这就像是我们的学习，一开始的时候你会一项技能（比如html），但是你可以以它为根节点去不断的扩展，这样你就能学到越来越多的知识（js,css,php....），不知不觉中你就成长为一个大牛了（笑）。因此有两点需要注意，一是打好基础，根节点要稳固，而是要勇于扩展，学习更多的新知识，创建更多的叶节点。

有关学习方式这一点，在这里强推一个在线学习的网站FreeCodeCamp，作为github上star数第一的开源项目，FCC提供了一种全新的挑战式学习方式，我个人非常赞同FCC的学习理念，可以参考下面的这个知乎回答：使用 FreeCodeCamp 编程是一番怎样的体验？

感兴趣的话，不妨注册一个github账号然后使用FreeCodeCamp进行学习吧！

啥是web开发？

通俗的来讲（根据我的理解），web开发就是在制作一个利用浏览器跟用户交互的网络应用程序，它主要涉及到以下两个方面：

前端：指的是用户所能看到的界面，就是你在浏览器里看到的花花绿绿的网页，以及这个界面怎么跟你交互。
后端：指的是应用后台工作的逻辑（这个概念需要讲到后面才比较好理解）

我喜欢用一个简单的比喻来了解web开发中前后端的关系：一个web应用就好像是一块手表，前端就是表面（包括刻度，指针等等..），后端就是隐藏在内部的机械部件，是它维持着手表的正常运作。

为什么是web开发？

开发的世界里存在许许多多的分支（前端，后端，安卓，ios...）,为什么这篇教程偏偏选中了web开发这个扎堆的领域呢？

作者本人只学习过web开发（说白了就是别的我也教不了）
web开发的入门门槛相对较低（只是入门门槛，任何一个领域走到深处都不容易）
web领域相对来说是大家较为熟悉的领域，因此比较容易接受

我不想学web开发！

其实这篇教程的主要目的并不是让大家去学会web开发这一项技能，我更希望的是让大家学会如何入门开发，如何以现代而又正确的姿势去学习一项技能，培养大家的工程思想和项目意识，因此如果你现在还是一个只会写hello world而不知编程有何用处的同学，又想要入门开发的世界，那我觉得这套教程也值得你阅读。

教程结构与目录

入门篇（通用）

了解html是什么，以及网页运作的原理
学习使用现代化的开发工具！——换一个好看又好用的文本编辑器吧
前端认知：使用css和js为网页增添色彩
后端认知：使用表单和服务端交互吧！——认识HTTP和PHP以及会话
编程认知：面向对象和函数式编程
linux入门，告别windows
数据库认知：mysql入门
web应用认知：搭建wordpress
选择web前端或者web后端作为继续

工程篇（前端）

目录待修订

工程篇（后端）

学习使用库：使用bootstrap快速写出好看的页面
学习代码管理：使用git实现代码同步，注册自己的github库，尝试使用多分支进行协作开发
学习包管理：使用composer，以现代的方式构建应用并获取扩展吧
集成开发环境入门：给自己换个IDE吧!
学习设计模式：用MVC的架构去编写应用
使用框架吧：从最简单的框架(CodeIgniter)开始，了解如何使用框架开发应用

应用篇（前端）

目录待修订

应用篇（后端）

（这一章将会带大家从零构建一个完整的简易博客系统，了解一个项目的基本开发流程）

需求分析
原型设计
数据层设计
逻辑架构设计
编写后端代码
编写前端代码
上线部署和调试
高级话题：运维，web安全

进阶篇

前后端分离
前端的学习路径和技术栈
后端的学习路径和技术栈
一些简单的设计模式和架构
如何进一步学习

准备开始吧

由于时间和能力的限制，教程不会十分的详细，以及可能会有大量的扩展阅读，因此你最好明白，这并不是一个傻瓜式的教程，而更多的需要你动脑思考。

本套教程计划在以下三个平台更新：

我的个人博客：marklux.cn
github仓库：https://github.com/MarkLux/WebTurorialDemos
简书

MarkLux/WebTurorialDemos

ErrorLooks like something went wrong!

About

Resources

Uh oh!

Stars

Watchers

Forks

Releases

Packages 0

Uh oh!

Languages

Error
Looks like something went wrong!

Packages