前端知识库@敲代码的小提琴手

😎我的前端学习之路😎

# 😎我的前端学习之路😎

# 🤔创建此文档的初心🤔

  • 找我了解前端开发的朋友：“你前端是咋学的啊，大概怎么个学习路线，花了多久，看得哪些资料，要学会什么知识点才能入行啊？🧐”
  • 我咨询的行业前辈们：“你前端大概掌握到什么程度呢？😐”
  • 我：“大佬我现在水平是这样这样这样，我大概学这个学了一个月，那个学了半个月，你看我为了查缺补漏还能怎么样怎么样怎么样😢”

……

想了想，创建个仓库记录 个人前端能力画像 & 自己的前端学习之路 好了！

从大二开始记录的CSDN博客 (opens new window)戳这里👈（曲折的学习路线😶‍🌫️工作之后不打算放文章到CSDN了，别问，问就是掘金社区环境太好了😎）

全力搞前端之后记录前端学习之路的掘金博客 (opens new window)戳这里👈（等知识体系稳定一些之后打算通过 —— 读书-写文章分享知识，写小项目-以文章形式分享 —— 类似这样的路线来巩固基础知识、提升社区影响力（希望吧😄））

# 写在前面的话

为了提升开发效率——我们要避免重复、无意义地去造轮子🚙

为了让自己的学习路线更清晰，根据大家的建议、补充让我的学习路线、发育思路更加正确——我打算创建这个仓库，

  • 记录自己学习前端开发的进度
  • 记录自己学习过程中使用的资源

总之 就是记录我前端学习之路的点点滴滴，并最终形成一条完整的前端学习路线（我会保持更新哒！）！🎉

希望在不久之后，这个仓库可以具备如下功能——

  • 干货满满（能集合大家的想法就更好啦！😘）
  • 让初学小伙伴们不再迷茫🧐
  • 让自己可以不断对个人学习状态进行评估🤔
  • 让我的面试官、未来同事快速了解我的学习历程和特点

那现在，我们开始——

2021/10/9 大三的billSu

# 学习历程一览

21/1-21/2 大二寒假 玩儿着学了一个寒假，简单过了一下三件套基础

中间干嘛去了？都在这篇文章 (opens new window)里了😂

21/8-21/10 前后端之间疯狂摇摆，最终在九月初决定毕业成为一名前端开发工程师！复习了前端基础知识，学习了JS高级的知识，期间不断了解业界情况，评估放弃读研就业的性价比。

21/10-22/1 第一次接触到大型外包项目-Vue技术栈，debug能力++ 联调能力++ 同期进行基础知识的巩固，尝试了两家公司的面试，最终进入京东实习，感谢京东科技数字城市产品部前端研发组的前辈们给予的信任！

22/1 —— 22/4 在京东科技实习，学习+成长ing~

22/2 —— 22/4 并发地准备春招，成果：阿里钉钉已OC 美团正在面试中 字节正在面试中（许愿成都的这两家鸭 好想去好想去好想去） 腾讯正在泡池子中（传说中的锁HC~）

22/4 —— 至今 春招基本告一段落，又跪在了字节跳动这一关，两个部门一共四次面试最终还是没能拿到offer，回顾一下自己的问题，继续努力吧！接了美团的意向 四月底入职，算是新的开始吧！另外阿里offer还是没发下来XD

# 前端学习路线

以下内容记录了我学习前端路上的一点一滴，炒鸡真实！

# 1.核心基础知识

作为一名研发工程师，你需要具备的基础知识！

持续学习

# 【1】数据结构与算法

考察编码能力 逻辑思维

算法题刷的ok 一些手写难题也会好理解一下~

  • 啥也甭说了 Leetcode 刷起来！

来监督我 (opens new window)一起刷题啊！

# 【2】计算机网络

非常重要的知识点！！！

  • 阅读《图解HTTP》

    • 奠定计网基础，内容简单有趣，两三天就能大致看完！

  • 强推小林Coding的《图解网络》 (opens new window)

    非常全面的网络教程~

    文章中同时推荐了一条可以学得很深的计算机网络学习路线！所以可以说这一份就足够学了！

# 【3】操作系统

对一些基础概念要有理解

  • 进程 线程 协程

# 2.前端开发核心三件套🎈

# 【1】HTML CSS

大二上结束那个寒假 兴趣使然地学习了一个月的前端基础 打开了前端开发的大门~

21/1 —— 21/2

后续在一直补充学习 这些基础（太细啦！）

21/8 —— 至今

22/1/17更 依旧需要强化下还原设计稿的能力！

# 应知应会

之后还需要补充一些HTML5 CSS3的知识细节 & 更深入的内容

  • HTML
    • 了解各种常用标签
    • 表单
  • CSS
    • 基本语法
    • 浮动float
    • 定位position
    • 盒子模型
    • flex 栅式布局
    • grid 网格式布局
    • 响应式设计

# 学习资源

可以看看上面这篇文章，当时在CSDN上总结了大量的基础知识文章，并总结了上面这篇总览文章，可以说是我写博客的开始与研发路线的开启了~

另外本文集合了不少优秀的学习资源，学习基础用上面这篇文章做导航我觉得绰绰有余！

# 【2】JavaScript

大二结束后的那个暑假，纠结了一个多月，终于在八月后半段的时间决定未来从事前端开发 开始系统化、目的性极强的前端开发学习！

2021/8 —— 至今

22/1/17 入职京东后，mentor给我的建议是：稳扎稳打地学习基础，这个基础之一，也是最重要的基础就是JavaScript！现阶段主要通过阅读文档来进行学习，等过一阵子时间没那么紧张我会静下心来，重新阅读下红宝书！

# 应知应会

前端领域新技术不停地在更迭！但是JavaScript永远是Basic！所以学好这里的重要性不言而喻！

  • ECMAScript基本语法
  • DOM编程 BOM的使用
  • JavaScript进阶内容
    • 原型相关 超级重要的原型链
    • 作用域相关
    • 闭包
    • ES6 重要！
      • 现在的项目代码基本都是使用ES6语法进行编码！所以ES6的重要性不言而喻~
    • Ajax
  • JavaScript异步编程
    • 异步编程与异步JavaScript的基本概念
    • Promise 优雅的异步处理~
    • async 和 await 让异步编程更简单~
    • AJAX/Fetch
    • axios库

# 学习资源

强力推荐的练手资源——三件套基础+一些进阶内容

image-20220123205605375

# 3.前端进阶知识学习

学习开发框架之前要学习的一些前置知识，从在本地写静态的代码升级到服务端，要了解前后端交互的细则，为学习前端开发框架打下基础！

21/9 —— 21/11

讲真，这里感觉不需要专门去学习，要用的时候再来看一下我感觉是OK的，主要也是因为我这边学习周期过短，所以跳了一些步骤吧！

21/1/27更 这部分的内容感觉在接触大型项目的过程中慢慢就熟练了！打包工具webpack啊，自动化构建工具npm啊，基本没有用过的node（毕竟现在还是前后端分离嘛，node可以自己做小全栈的时候使用）啊，如果时间紧张可以暂且跳过~

# 应知应会

这里不用过于纠结 心里大概有个数即可！

  • Node基础
  • 自动化构建工具
    • npm script
  • 打包工具
    • Webpack 现在用的最多的打包工具
    • 一下子流行起来的Vite

# 学习资源

# 4.前端开发框架

这里有很多有趣的开发框架 我先学习了React 没有去学习jQuery bootstrap

21/9 —— 21/10 React入门

21/10 —— 21/12 —— 使用Vue开发外包项目，现学现用啊！

22/1 —— 22/4 入职京东 学习React技术栈~

22/4 —— 至今 入职美团 又开始学Vue 🥵

# 应知应会

前端工程师用来高效开发的工具！学习了那么多前置知识，终于来到这里！

  • React

    • React-Hooks
      • 大大减少代码量的函数式组件~基础部分的内容就是两个钩子
        • useState
        • useEffect

  • Redux

    • 与Redux类似的还有 MobX等库，我第一个学习的状态管理工具也是这个MobX（啊因为公司接触的第一个项目用的是ta）

  • React-router

  • Vue

# 学习资源

🐴前端基础-layout