我与《前端小课》- 前端从 0 到 1（漫画） | 掘金年度征文

2019 年对于我来讲就想上图中的对话 ——“变化莫测”的一年。对于这种变化，我心里并不抵触，反而再次激发起了我对编程的兴趣。作前端将近半年的时间，我以为个人选择是正确的。下面就聊一聊我是如何从 iOS 转作前端的，以及《前端小课》诞生的缘由。

从今年开始，客户端的业务逐渐收缩。原本平时的工做就是写一些业务需求，并无多大的挑战，天天几乎作一样的工做，这致使我必须“另谋出路”，因为移动端和前端开发比较类似，因此我选择了作前端。刚学习前端的时候，实际上是比较吃力的，由于不知道方向在哪。看别人的博客大可能是就某个知识点进行讲解，并无找到系统学习前端的方法。

我尝试看了一些书，可是前端的书籍大多数都比较厚，涉及到的知识面比较广，因此一本书并不能归纳当前前端所使用的技术。并且书有个弊端，不能在手机上看，也就是说没法利用天天上班路上的时间。相信不少同窗和我同样，入门前端的时候，找不到一个正确的方向，会很是迷茫。

后来通过同事以及本身的不断摸索，终于找到了方向，我想把个人经验写下来，起名《前端下课》，我把它定义为一本多媒体电子书，“多媒体”是指它能够经过多种形式来说述一个知识点，好比视频、漫画、图等方式。它不像技术博客，由于技术博客不成体系，内容一般晦涩难懂。而《前端小课》是一本电子书，内容比较系统全面，以通俗易懂的方式呈现。

我目前已完成三个阶段的内容。

🐝第一阶段 20 天：HTML + CSS

• 坚持学习前端的第20天
• 第19天：写出易复用、易维护、结构清晰的 CSS
• 第18天：CSS中的权重
• 第17天：屏幕尺寸这么多，前端却有高招
• 第16天：领导说，体验差
• 聚齐了这3张宝图，搞懂CSS权重
• 第15天：设计师的要求
• 第14天：在文字前、后插入一个图标
• 第13天：CSS中使用图
• 移动端同窗为何要学前端
• 第12天：打破常规之 display
• 第11天：说好不哭
• 第10天：撑起CSS布局的半壁江山---盒子模型
• 第9天：自我介绍
• 第8天：border 能干啥
• 群里讨论的一个选择器问题（必定要看）
• 第7天：CSS中的选择器详解
• 第 6 天：设计一个左右滑动的菜单
• 第6天：使用CSS的三种方式
• 第 5 天：读懂 HTML 标签
• 第4天：给本身一句鼓励的话
• 第4天：我学前端时用过的资源
• 第3天：HTML 中的 head 标签
• 第2天：HTML 结构
• 第1天：开篇词，开发环境准备

🌺第二阶段 13 天：死磕 CSS 布局

• 用前端仿写朋友圈
• 第13天：布局的兼容性与两种不经常使用的布局
• 第12天： 靠边站之float
• 第11天：grid布局对齐属性
• 第10天：买一块地盖一处院子
• 第9天: position 布局之 fixed、sticky
• 第8天：布局翘楚 - Grid 布局概述
• 第7天: position 布局之绝对布局 absolute
• 第6天：深刻理解 FlexBox 布局的弹性
• 第5天：position 布局之相对布局 relative
• 第4天：图解 FlexBox 布局（下）
• 第3天：布局之源 - 流式布局
• 第2天：图解 FlexBox 布局（上）
• 第1天：前端布局概述

🐝第三阶段：搞懂网络，掌握网页请求流程

• 第三阶段 - 重学网络编程（HTTP、TCP、WebServer）
• 一条命令开启一个 WebServer
• 第2天：server 的接口是如何实现的
• 第3天：HTTP 之客户端与服务端
• 第4天：数据传输之 TCP ，聊天室实践（含视频）
• 第 5 天： 以农村故事说说我对 socket 的理解
• 第 6 天：HTTP背景与整个请求响应流程 （官方英文描述）
• 第 7 天：小卖部与生产商之间的协做
• 这些网络(HTTP, TCP, WebServer)学习资料不容错过
• 第 8 天：弄懂 HTTP 请求报文
• 第 9 天：HTTP 响应报文与状态码
• 第 10 天：我犯了个错误
• 第 11 天：我找到了学习 socket 的正确姿式
• 第 12 天：从 0 徒手实现一个 HTTP Server
• 第 13 天：从 HTTP 到 HTTPS，取得阶段性胜利
• 用故事说透 HTTPS（漫画）
• OpenSSL 自述
• 被乱用的 Cookie
• 打破讨论薪资的红线 之 签名原理（漫画）

🐝第四阶段 ：JvaScript与 Vue共舞（进行中）

学习语言若是只学习语法内容，不免会有一些枯燥，因此我会经过 vue.js 的源码来学习 JavaScript 是如何被使用的，一些比较难理解的内容我会使用漫画的方式来说解。学习语言不是说知道语法咋么用就好了，要探索它的本质与边界，优缺点是什么，为何会有这门语言。总之要从原理出发，探索语言的本质，因此我会从实际出发，逐步探索 JavaScript 的本质。

写在最后

2020 年，我打算写完《前端小课》，基本规划以下：前端小课写做大纲。我想作的事情就是超越技术，经过技术来作更多有意义的事情。用通俗易懂的方式写技术，好比漫画 用故事说透 HTTPS（漫画）。

掘金年度征文 | 2019 与个人技术之路 征文活动正在进行中......