作为前端开发的，平时都看哪些网站关注最新学习信息？

作为前端开发的，下面几个网站是我觉得不错的。

掘金（、开源中国的用户，我们相信你也可以在这里有所收获。上面是掘金对自己网站的介绍，在使用的过程中，感觉里面前端人员偏多，氛围很浓厚，而且干货也蛮多的，还是很值得一看的。而且里面的东西都很新，经常能学习到一些新的知识和技能，说跟上时代最前沿有些夸大，但保证自己不落伍倒是没问题的。

V2EX（的作者等等。能和这些大牛有些交流，还是一个很不错的经历的。

Smashing Magazine（技术类的博客杂志站点，里面会经常发布一些技术前沿文章，可以看到当下最新以及目前最流行的技术，而且能看到许多优秀的设计思路和脑回路，对于前端技能的提升会有很大的帮助。

W3CTECH（是中国最大的前端技术社区，里面有各种前端技术分享以及新技术展示，能够帮助开发者快速了解当前前端领域正在发生的变化。

以上排名不分先后，都是好东西。

哪些网站可以提供设计没灵感？

曾接到过一些朋友的私信问题，

大致意思为："做PPT设计时缺乏灵感怎么办？”

对于这样的问题，我一般会谨慎的回复三个字：找灵感。

嗯，这是一句有用的废话，

灵感上哪找？有时候你翻遍书本的每一个角落，依然会两眼一抹黑。

今天给大家介绍怎样通过网页设计来寻找灵感，

你会发现以后的设计灵感都被这些精美的网页给承包了。

▼ 留意优秀网页设计，随手截图保存灵感

留意观察一些网页的排版布局，我们就拥有了一个非常庞大的灵感库。

因为那些网页都是设计师精心设计的作品，我们可以通过借鉴和模仿，把这些好设计用在我们自己的幻灯片中。

（可借鉴的网页设计示例）

很多公司和产品的官网都值得我们学习和借鉴，比如锤子科技、小米、大疆无人机等等。不仅可以借鉴模仿页面设计，还能获得一些优质的图片资源。

（截图来自大疆无人机官网）

▼ 借鉴网页设计，做幻灯片不怕没灵感

我们相信，PPT幻灯片也是一种力量，能够说服，能够影响，能够感动！

优秀的网页设计何尝不希望画面有更强的吸引力和感染力。

对我们这些没学过设计的人而言，通过借鉴网页设计来提升我们幻灯片的表现力是一个很好地选择。

下面是两个我自己收藏的网站，收集了大量优质的网页设计：

1.酷站欣赏：

2.网站设计欣赏：/

举个简单的例子，比如下图这个网页我们可以借鉴一下，用作幻灯片封面。

首先将这些图片元素全部下载下来，如何获取网页图片下文会讲到。

获得素材以后在PPT页面上，按照网页上各元素的摆放依葫芦画瓢，自己增加文本框输入文字即可大功告成：

▼ 下载网页上喜欢的图片，存储为自己的设计素材

除了借鉴网页排版，你也可以将网页上喜欢的图片保存下来，尤其那些极具吸引力的首页大图。保存后，上传到自己的iSlide图片库中，做PPT的时候随时一键插入。

（某品牌耳机官网首页图片）

（某天然气公司首页图片）

（某品牌手机官网图片）

【网页图片无法保存怎么办？】

有些网页上的图片并不能直接下载，你可能知道一种方法，在某些浏览器中（比如谷歌浏览器）按下F12键打开开发者工具，可以从里边找到你需要的图片。这种办法稍微有点麻烦，这里不做详细说明。

（谷歌浏览器按下F12，开发者工具被打开）

如果图片上面没有东西遮挡，截图也是一种办法。

但是上图这样的页面，截图显然不行。

我们可以借助一款叫做Image Downloader的浏览器插件更方便的获取网页图片。

文末会提供这款浏览器插件的安装文件，谷歌浏览器安装方法很简单，你可以自己百度解决。

安装成功以后，浏览器右上角会出现Image Downloader的图标，点击打开就能看到网页上全部图片，所有图片都可以直接下载。

PPT插件：

Web开发、前端设计有哪些优质资源？

做前端设计、网页设计的，素材永远很重要。因为素材的美观程度往往直接决定了网页页面的风格、整洁度、色调等等。

我大学时候，在一家非常小型的创业公司实习。公司人员只有几个，所以在那时我基本上算是独立开发了一个旅游酒店订购平台，前端设计、后端开发、公众号开发等等都涉及，那段时间基本是我最全能的时候了。

所以当时我也收集了许多的前端素材，在这里一并分享给大家。

一、图标类

每一个Web开发者，尤其是前端开发人员一定都会需要icon图标来为项目增色。

Font Awesome IconsFont Awesome提供可缩放的矢量图标，可以使用CSS所提供的所有特性对它们进行更改，包括：大小、颜色、阴影或者其它任何支持的效果。

Icon Monster特点：免费，高质量,。非常简洁的icon图标库。

IconFinder这是一个比较有设计感的Icon图库，并且已经打包分类好，缺点是只有部分是免费的。个人觉得里面免费的图库也已经够用了。

附上圣诞特辑！

Iconfont-Alibaba阿里巴巴UX部门推出的矢量图标管理网站，也是国内首家推广Webfont形式图标的平台。这个相信大家都用过！

二、图片素材

无版权限制的图片素材

PEXELSPexels可以说是图片素材界的超级网红了，说到图片肯定哪里都有它，我自己都推荐好几次了。可以免费下载各种各样的分辨率，包括原图尺寸。

网址：(/)

例如搜索：圣诞节（Christamas）

PNGimg这个主要用作素材，是不同种类的无背景素材图片！直接可以免费用。注意它是全部都是无背景图片，非常适合那些需要PNG透明底配图的。

(/)

例如搜索：Birds

KaboomPicsKaboomPics是以生活化免费高质量图片素材为主的图片素材库。里面的图片都是摄影爱好者摄影后通过审核上传的。并且可以应用于任何项目，没有版权限制。

自媒体可以从中找封面图，摄影爱好者也可以从中欣赏或着学习。

Unsplash（/）

先这样~希望这些资源对你有帮助，下次还会更新一些web开发的常用工具。

如果有帮助，欢迎关注我以示支持，也以防错过下一波干货！~

前端开发中，模板引擎方式和纯静态页面+ajax，这两种方式哪个更好？

你说的模板引擎应该是指后端模板引擎。从网站全栈开发程序员的角度来看：从前，前端[不考虑原生app]只要“哄好”浏览器（包括微信内嵌的、app内嵌的）就可以了，服务端都是Nginx/Apache/IIS + php（大部分程序依赖于php-fpm[不能常驻内存]，少量运行在CLI[也就是命令行]），大家都用MVC, 都在热烈讨论视图文件与模板引擎的“家长里短”。后来，前端爆出了“微信小程序”，不少前台页面“弃暗投明”，好在后台页面/对/浏览器/“忠心耿耿”。再后来，swoole异军突起，php可以常驻内存、运行速度“风驰电掣”，同时开发方式大变[大部分运行在CLI]，比如：echo会输出到终端而不是浏览器---然而，模板引擎都是用echo输出动态数据到浏览器的---这就尴尬了。

现在，访客的客户端既有小程序，又有浏览器。小程序的页面只能由js渲染，php模板引擎对小程序页面无可奈何。php接口不得不设计为API，以便返回json给小程序，这种API倒是可以加以包装，这样，浏览器那边的前台页面可以继续使用模板引擎。后台页面，直接使用模板引擎。

一但用上swoole，要是坚持使用模板引擎，由于模板引擎将视图文件(view.html)翻译成模板文件（tpl.php），都会用到“echo”，（如果用到的视图文件都没有修改过，就直接）include tpl.php之后，为了防止输出到终端，使用ob_get_clean(), 再使用swoole的接口输出到浏览器，

倒也是可以。

结论：

后端模板引擎，只是开发一时爽，不适宜团队合作，适合全栈开发者，缺点：

应变能力差：使用全新装修的话，后端开发就要套页面，繁琐。

浪费人力资源，加重后端团队的负担：前端折腾完html页面，后端需要经手一遍。不得不提一点：分页条。thinkphp框架的分页条是写在php的page类里面，如果分页条样式变了，前端写完html代码，后端要誊写一遍。

如果需要翻译视图文件，则后端负担相对较重，用户等待时间相对较长：比如：编辑数据的页面。php从数据表里边拉取到数据，已经仁至义尽了，却还要翻译html文件，即使不用翻译，也需要查看用到的视图文件是否修改过。

后端模板引擎的渲染是一次性的，而前端模板引擎可以反复渲染，利于沉浸式体验。同一段html代码，要么由后端模板引擎循环处理，要么由前端模板引擎循环处理。举个例子：进入购物车页面（/cart/index），对某个商品重新挑选促销方案后，该商品需要挪到新的分组，再次计算受影响的组的优惠、赠品，然后再次计算总优惠。（后端更改促销方案, 不应由/cart/index处理，不然就“千人排、万人坑”，越来越“牵一发而动全身”。） 假设是由/cart/selectPromotion处理， 如果使用前端模板引擎，即便反复挑选，页面也无需刷新，不会打断沉浸式体验，否则，等待转圈结束，页面还要需要刷新，页面无论如何都是要经历空无一物的白色，反复刷新几次，真的沉浸不下来。

由于css样式的影响，部分php错误信息未能及时发现，直到：打开控制台，查看源码，偶然看到额外的html元素直接查看网页源码，看到额外的html元素js出错：比如说，取不到指定html元素，json字符串转换成对象失败。好处：

共同的html可以抽出来作为公用文件，用php加载公用文件。

可以用php读取静态文件的上次修改时间，引入静态文件时，将这个时间作为版本号，静态文件有变化则重新请求，否则使用本地缓存。调试过程中，不需要同时按shift + F5, 也不需要手动更改版本号，比较省事。

纯静态页面+ajax：适宜团队合作，也适合全栈开发者，应变能力强，不会浪费后端的人力资源，php负担相对较轻，用户等待时间相对较短，体验更好，除了开发时繁琐了点。

前端常用的框架有哪些？

学什么其实看下招聘网站各个公司的招聘要求就知道了！如果你实在不知道，那你可以先订一个小目标，比如，你想去蚂蚁金服工作，那么就可以看看蚂蚁金服的前端都要求掌握些什么，然后根据他们要求去学习相应的东西。

这是阿里蚂蚁金服的前端岗位要求：

在岗位要求那一栏，明确的指出了你需要会的技能：

熟练掌握 JavaScript、HTML、CSS 等原生前端基础技术，熟悉相关规范；

熟练掌握 React / Vue / Angular 等常用前端框架以及配套社区项目（redux / rxjs / …）；

对前端工程化有一定理解，熟练掌握 Webpack / Grunt / Gulp 等构建工具的使用和配置；

可能这些要求有点高，但是基本代表互联网公司前端的主流方向，我们可以找一家体量小的公司对比一下，比如这家只有15-50人的公司，我们来看看他的前端招聘要求：

可以看到在任职资格那一栏，也给出了相应的技术栈，基本上也是JavaScript、HTML、CSS、webpack、vue、react、Angular ，跟互联网大厂的没什么差别，所以基本上到这里你也知道自己该学什么了。但是学东西还是有个先后顺序的，先易后难，其实这个顺序在招聘要求上也给给出来了，我们看每个岗位要求的第一条，都是在说JavaScript、HTML、CSS，所以你首先要学的就是这几个。

确定了学习内容和学习的顺序，那么接下来就是学习方法了，好的方法能够事半功倍，我的建议是，边学边练，网上有很多教程，比如菜鸟教程，就很适合新手入门，里面的例子也很简单，基本上每个语法都对应的案例。

然后就是坚持，不断重复你学的东西，不断实践你学的东西，终有一天也会成为大牛。关于如何坚持下去，可以看看我微头条里关于时间管理的方法。

如果我的回答对你有帮助，记得帮忙点个赞哟，谢谢！