文末

从转行到现在，差不多两年的时间，虽不能和大佬相比，但也是学了很多东西。我个人在学习的过程中，习惯简单做做笔记，方便自己复习的时候能够快速理解，现在将自己的笔记分享出来，和大家共同学习。

个人将这段时间所学的知识，分为三个阶段：

第一阶段：HTML&CSS&JavaScript基础

第二阶段:移动端开发技术

第三阶段:前端常用框架

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

推荐学习方式：针对某个知识点，可以先简单过一下我的笔记，如果理解，那是最好，可以帮助快速解决问题；

大厂的面试难在，针对一个基础知识点，比如JS的事件循环机制，不会上来就问概念，而是换个角度，从题目入手，看你是否真正掌握。所以对于概念的理解真的很重要。

网站：https://www.wakatool.com/

2.图标库

（1）Font Awesome

中文版webfont，是一款基于css框架的网页字体图标库，它完全免费，为您提供可缩放的矢量图标，您可以使用CSS所提供的所有特性对它们进行更改，包括：大小、颜色、阴影或者其它任何支持的效果。

网站：https://fontawesome.com.cn/

（2）iconfont

国内功能很强大且图标内容很丰富的矢量图标库，提供矢量图标下载、在线存储、格式转换等功能。阿里巴巴体验团队倾力打造，设计和前端开发的便捷工具。

网站：https://www.iconfont.cn/

3.高清图库

（1）Pexels

Pexels 是高质量的免费摄影图片，视频分享网站，没有标记来源的要求，任何地方都可以免费使用。特别是现在视频素材的数量多起来了，非常值得收藏。免费素材图片和视频，可以在任何地方使用。高质量，100% 免费，无需注明归属。

网站：https://www.pexels.com/zh-cn/

（2）Pixabay

Pixabay是国外一个充满活力的创意设计社区，专注分享无版权的图像、视频和音乐素材，你可以在这里看到来自世界各地的朋友分享的图片、视频和音乐等等，它也是一个支持中文搜索的免费可商用图库。

网站：https://pixabay.com/

（3）Gratisography

Gratisography是一个提供免费高品质摄影图片的集散地，免费高分辨率摄影图片库，所有的图片均可用于个人或者商业用途。

网站：https://gratisography.com/

（4）Unsplash

Unsplash是一个免费图库平台，海量免费高质量具有清新的生活气息的照片素材网站。

网站：https://unsplash.com/

（5）VisualHunt

VisualHunt是一个超过三亿张高质量免费图片库，可根据色系查找的图库，它是从许多在线资源中提取的免费图像的来源。这些图片用于知识共享许可证（Creative Commons Zero license），也可以免费用于商业用途。

网站：https://visualhunt.com/

（6）Stock Up

一个收集了来自27个免版权图库的神奇网站，图片数量之大，超乎你的想象。

网站：https://stockup.sitebuilderreport.com/

（7）WallHaven

最受欢迎的壁纸网站Wallhaven,上百万精美壁纸库，任君挑选。清晰度高达4K，各类壁纸，总有你所爱。

网站：https://wallhaven.cc/

（8）Pxhere

PxHere是一家提供多国语言的免费素材下载站，“自称”世界知名的免费摄影图库，支持中文搜索，目前提供了超过100万张高质量的摄影作品，可免费用于个人和商业用途。

网站：https://pxhere.com/

4.图片处理

（1）DesignEvo

DesignEvo 是一个在线制作 Logo 的网站，无论是公司、网站、软件、App、品牌、社团，都可以用来制作自己的 Logo，免费版提供 500px * 500px 尺寸的图片下载。

网站：https://www.designevo.com/cn/logo-maker/

（2）U钙网

U钙网是一款自用的免费在线LOGO标志设计生成网站工具，无需登录注册就可以免费使用所有功能。 只需填写LOGO名称，就可以自动生成许多种类的图片。

网站：https://www.uugai.com/

（3）PhotoMosh

朋克图片生成器，这是个很强大的工具，它可以在线将图片、视频、实时摄像头的画面进行特效处理，并可以多特效叠加，效果相当给力！

网站：https://photomosh.com/

（4）在线SVG制作

svg在线编辑器，svg矢量图在线制作工具，在线矢量图形编辑器，自媒体绘图，免费svg制作。

网站：https://51tools.info/svg/

附：这个网站的官网还有其他很实用的工具可供使用：

网站：https://51tools.info/

（5）制作GIF图片

图贴士(原GIF工具之家)在线图片压缩尺寸大小和视频转gif在线制作工具，支持JPG压缩、PNG压缩、GIF压缩等免费在线图片制作工具网。

网站：https://www.tutieshi.com/

（6）在线PS软件

uupoop是一款精简版的在线PS软件，里面有齐全的P图功能 ，但是体积却非常的小，主要拥有编辑、美图、GIF图片制作等功能。让你不用安装ps就可以在线使用它，功能一样的强大，堪称Photoshop在线版，喜欢的不妨试一试。

网站：https://www.uupoop.com/#/

（7）AI智能抠图

免费人工智能抠图软件，仅需数秒即可完成全自动AI抠图的神奇软件，无需花时间学习PS抠图教程。

网站：https://www.6k6k.cn/

（8）图片背景消除

在线抠图软件轻松实现一键抠图，只需上传图片，无需其他操作，即可100%自动去除图片背景。

网站：https://www.remove.bg/zh

（9）片刻抠图

趣作图专注于人像、宠物、汽车等物品的智能抠图,具备透明背景、场景切换、证件照制作等功能,是UP主、微商、淘宝店家、运营人员和产品美术必备的免费AI抠图工具，可能是国内效果最好的。

网站：https://www.quzuotu.com/home

（10）风筝图床

免费公共图床，提供图片上传和图片外链服务，图片托管，原图保存，无需登录即可使用的文件外链工具。

网站：https://imgbed.link/

（11）图片加水印

在线pdf转word转换器免费版为您提供将PDF转换成WORD，word转换成pdf，ppt转换成pdf，Excel转PDF，PDF分割合并等免费在线转换服务。

网站：https://www.onlinedo.cn/img-shuiyin

（12）图片去水印

Apowersoft一款免费在线的图片去水印软件，提供免费的多媒体及商务办公的在线解决方案，帮助广大用户进行音视频的录制，转换，编辑以及多媒体文件在电脑，网络和移动设备之间的传输。

网站：https://www.apowersoft.cn/image-watermark-remover

（13）图片合并切割

做好图：免费在线图片转换处理，专注于提供在线图片编辑、处理和转换的解决方案。

最后

你要问前端开发难不难，我就得说计算机领域里常说的一句话，这句话就是『难的不会，会的不难』，对于不熟悉某领域技术的人来说，因为不了解所以产生神秘感，神秘感就会让人感觉很难，也就是『难的不会』；当学会这项技术之后，知道什么什么技术能做到什么做不到，只是做起来花多少时间的问题而已，没啥难的，所以就是『会的不难』。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

我特地针对初学者整理一套前端学习资料

的不会，会的不难**』，对于不熟悉某领域技术的人来说，因为不了解所以产生神秘感，神秘感就会让人感觉很难，也就是『难的不会』；当学会这项技术之后，知道什么什么技术能做到什么做不到，只是做起来花多少时间的问题而已，没啥难的，所以就是『会的不难』。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

我特地针对初学者整理一套前端学习资料

[外链图片转存中…(img-3xPlj8dH-1715029448224)]

[外链图片转存中…(img-J2c82lv3-1715029448225)]