前端入门

前端必备资源大整理

戏子无情 提交于 2020-01-21 13:27:44
资源不断更新中。。。 动画库 1.Animate.css 说明:一个简单易用的跨浏览器CSS动画库。 GitHub主页: https://github.com/daneden/an... 2.CSShake 说明:用CSS实现各种颠颤动画效果DOM! GitHub主页: https://github.com/elrumordel... 3.Hover.css 说明:将鼠标Hover效果快速应用在你的网页元素或创意设计上。 GitHub主页: https://github.com/IanLunn/Hover 4.Velocity.js 说明:帮你加速JavaScript动画。 GitHub主页: https://github.com/julianshap... 5.DynCSS 说明:用动态CSS来打造你的网页。 GitHub主页: https://github.com/vzaccaria/... 6.Magic Animations 说明:可创造CSS3动画特效。 GitHub主页: https://github.com/miniMAC/magic 7.Bounce.js 说明:即时创造漂亮的CSS3动画。 GitHub主页: https://github.com/tictail/bo... 前端框架和类库 1.lodash.js 简介:具有一致接口、模块化、高性能等特性的

你真的懂npm吗?

淺唱寂寞╮ 提交于 2020-01-21 08:01:18
我们作为一个前端的开发人员,无论你是刚刚入行还是已经入行很久,我们都有必要了解下npm,在这个日益变更的互联网时代,我们已经要快速跟上时代的发展,不然就被社会淘汰,扯远啦!回归正传,之前我写过一篇文章叫 《项目中利用npm生成package.json的那点事儿》 ,我感觉有点太简单啦!适合一些刚刚入门的人来看,现在想具体了了什么是 npm ,它做了什么?干了什么?这样对们了解项目,了解各种依赖,更好的管理项目和发布自己的 npm 模块。所以说,还是有必要的,高级者,勿喷,只是写给初入前端的人或者想了解前端的人,前方有坑,😕,慎入!!! 在说 npm 之前,我有必要简单的提下Nodejs。Nodejs是构建在V8引擎上的ES runtime,nodejs并不是一门语言,nodejs让js在服务器端跑起来的runtime。Nodejs 具有2大特性; 事件驱动 非阻塞I/O模型 一个完整的项目,总有各种依赖 来源: CSDN 作者: 王来彬 链接: https://blog.csdn.net/alnorthword/article/details/103951570

关于 JavaScript 学习 —— 好的博客或者网站推荐

不羁岁月 提交于 2020-01-20 03:18:15
作者:Tw93 链接:https://www.zhihu.com/question/19651401/answer/46211739 来源:知乎 著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。 我来班门弄斧一下吧,把我JavaScript学习过程中常去的一些网站分享给大家: =========================增加================================= 首先增加一个重要的内容: JavaScript | MDN 为什么首先推荐它呢?曾任Mozilla公司首席首席技术官的Brendan Eich是JavaScript主要创造者与架构师。 这个是 Mozilla 开发者网络社区的学习资料,比W3school 要好,对于疏通JavaScript很有益处。 想了解 ECMAScript 6 入门 的, 阮老师的这个网站不要错过。 居然忘记InfoQ这个网站 , InfoQ - 促进软件开发领域知识与创新的传播 ,这是他的 JavaScript 频道。 InfoQ是一家国际技术媒体,虽然网站不是很漂亮,但是内容大于样式。 网站的JavaScript频道知识很多,很多国际上的新知识。有 JavaScript > 新闻 > 第1页 || JavaScript > 文章 > 第1页 || JavaScript > 迷你书 > 第1页

简单的前端-年终总结

早过忘川 提交于 2020-01-19 17:44:24
2019年 总结 摘要 技术, 学习, 职业, 人际关系, 正文 技术 从2019年之前 我都是使用vue 和 react,当时是对react比较熟悉,因为刚进入新的项目组,项目组中使用react,用了两周时间看大胡子的react 入门文档,就开始开发了. 2019年之后呢, 公司开启了新项目使用vue, 前端这类框架总给人一种长时间不用就会遗忘的感觉,用了几天的时候,看了一下文档, 公司的开发规范也就继续开发了. 期间对vue有了更深的理解, 数据的筛选和数据的强更新, watch和computed 以及 ref dom操作都有了比以往清晰的认识. 还有的就是对项目的结构化,有了更深的认知. 年中的时候,项目进入高强度开发期,我们所有人都是加班赶进度, 技术上没有什么提升, 工作的内容分析需求, 看ui, 写代码, 改bug. 到了年末,我被安排使用trsCMS后台系统, 全程负责新网站的cms后台、模板、栏目、站点、的搭建和对接. 期间使用了JQ算是捡起来很久没用的技术了. 最后的几个月是老项目的维护(react)和新项目的持续开发(vue)目前一直在进行. 学习 二月份到五月的时候, 着几个月, 看着vue 官方入门文档, 还有很早买的vue指南书. vue的官方文档, 看了’’教程’’这一个栏目.vue指南书看到了自定义组件讲解. 看书是每个工作日晚上回家 从九点看到十点.

在web开发中,为什么前端比后端更得到转行程序员的青睐?必看!

安稳与你 提交于 2020-01-18 15:39:45
1、Web开发分类与区别 人们通常将Web分为前端和后端,前端相关的职位有前端设计师(UI/UE),前端开发工程师,后端相关的有后端开发工程师。 2、技术栈区别 看各大招聘网站上,公司对前端开发工程师的要求莫过于精通HTML,CSS,JS,有良好的交互设计能力等。再看公司对后端开发工程师的要求: 比如Java开发工程师,要求精通Java,熟练掌握Java网络编程; 熟练运用SSH等开源框架; 熟悉互联网开发模式,清晰理解缓存,缓存设计和模式; 精通TCP/IP、HTTP等网络协议,精通socket网络编程,有用Java做大访问量高压力网络应用的经验; 熟悉Linux/Nginx; 熟练配置维护Apache,Tomcat,Resin等应用服务器,掌握shell/awk/python等系统脚本工具; 熟练掌握SQL语句,熟练使用数据库(MySQL,Oracle); 掌握Html/Javascript/Css/Ajax 等页面技术熟练使用Eclipse/Maven/Ant/SVN等软件开发工具; Web架构的性质决定服务端开发的复杂性,服务端的复杂性决定后端开发人员要掌握的技术。 3、学习成本区别 用3年时间学习Web前端开发,多数同学都能够成为一个优秀的Web前端开发工程师。同样,用3年时间学习后端开发,多数同学只能算是入门。Web前端开发人员需要掌握HTML,CSS,JS

想入门web前端开发,并且学好,你必须知道的十大开发工具!

孤人 提交于 2020-01-18 15:39:33
在网站制作和开发的过程中,其实有很多的辅助咱们开发的工具,使用这些工具会让咱们的开发更为方便,提高工作效率,从事开发第六个年头了,接下来为大家分享一些常用工具,专家建议:收藏一波! 1.Sublime Sublime 作为一个尽为人知的代码编辑器,他的优点我就不多做赘述了。此编辑器同时支持Windows、Linux、Mac OS X等操作系统。他的运行界面十分整洁美观、文本功能也是很强大,运行速度超快,非常适合编写代码,写文章做笔记。它还支持众多插件扩展,实现强强联手,比如说: Emmet插件:前端开发不可缺少,让编写 HTML和CSS代码变得简单,节省大量时间。Emmet可使开发者用缩写形式书写代码,再用"扩展"功能自动将代码扩展至完整样式 JsFormat:这是一款将JS格式化的插件 SideBarEnhancements:右键菜单增强插件 TrailingSpaces:高亮显示多余的空格和Tab Tag:这是HTML/XML标签缩进、补全、排版和校验工具 Terminal:允许在Sublime Text 3中打开cmd命令窗口 SublimeCodeIntel:代码提示插件,支持多种编程语言,可以提示用户自定义代码 CssComb:为CSS属性进行排序和格式化 Autoprefixer:CSS3私有前缀自动补全插件,该插件使用CanIUse资料库

前端学习笔记4-CSS入门二

时光毁灭记忆、已成空白 提交于 2020-01-17 23:57:46
前言:虽然做了几个前端项目,但是属于项目组的赶鸭上架。我的前端基础还是非常薄弱,在网上找了一些网站,用于空闲时间学习。在此做下学习笔记,以做复习使用。 网站的课程讲的很好,很适合像我这样零基础的人学习,非常感谢网站的维护者,推荐下: 绿叶学习网 1.控制字体的有,font-family(字体类型)、font-size(字体大小)、color(字体颜色)、font-weight(字体粗细)、font-style(字体斜体): <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style type="text/css"> /*font-family,字体类型,可写多个,中间逗号隔开,顺序匹配电脑上安装的字体*/ #f1{ font-family: 宋体; } #f2{ font-family: 微软雅黑,SansSerif,宋体; } /*font-size,字体大小,一般用px控制*/ #f3{ font-size: 24px; } /*color,字体颜色*/ #f4{ color: red; } /*font-weight,字体粗细,可用100-900,bold,normal*/ #f5{ font-weight: 400; } /*font-style

web前端入门到实战:CSS的文本格式化样式总汇

两盒软妹~` 提交于 2020-01-17 21:39:26
长度单位 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .box{ width: 300px; height: 300px; background-color: red; } .box1{ font-size: 20px; /*em数值根据当前元素字体大小变化而变化*/ width: 2em; /*百分比随着父元素变化而变化*/ height: 50%; background-color: yellow; } </style> </head> <body> <div class="box"> <div class="box1"></div> </div> </body> </html> 专门建立的学习Q-q-u-n ⑦⑧④-⑦⑧③-零①② 分享学习方法和需要注意的小细节,互相交流学习,不停更新最新的教程和学习技巧(从零基础开始到WEB前端项目实战教程,学习工具,全栈开发学习路线以及规划) 颜色 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> .box1{ width: 100px; height: 100px

关于IT培训机构的个人看法

前提是你 提交于 2020-01-17 17:44:59
1.前言 缘分与巧合,最近接触比较多的培训机构出来的人,以及看过关于培训机构的文章和问答。虽然没在培训机构上过课,但是接触过很多培训机构出来的人,也看过一些培训机构的课程。关于培训机构,我也有自己的看法。经历了这些,我写了这篇文章,不吹不黑的写下我对培训机构的个人见解。这篇文章可能会有些争议,如果有不同的看法,大家可以评论,但是发言望大家理性,客观,不要人身攻击! PS: 1.我是一个web前端开发者,接触的人也是web前端居多,所以下面文章,提到的培训机构可能主要是针对web前端的! 2.文章中,有小部分关于培训机构的内容,是我从朋友或者网友那里了解的,自己并没有亲身体会过,了解过,确定过。针对这种情况,在文中我会说明。 2.关于培训机构的价值 关于培训机构的价值,个人总结几点吧! 第一,导师作用,告诉你应该学习什么,在困惑的时候能够给解惑。 第二,实践作用,带着学员做项目,有实践的机会。 第三,人脉作用,在培训班能认识很多人,有一个人脉关系。 上面三个是我个人的一个总结,至于价值最大化到什么程度,能实现什么样的效果,有什么成果,就得看培训机构以及学员的造化了! 3.关于培训机构的套路 看培训机构的公开课,网上了解,以及和培训机构的学员聊天这些经历,我总结下,培训机构的一些招生套路! 1.挂各种高大上的牌子,各种认证企业,上市企业,也有说讲师获得什么证书的等等。 2

前端学习笔记3-CSS入门一

六月ゝ 毕业季﹏ 提交于 2020-01-17 17:21:04
前言:虽然做了几个前端项目,但是属于项目组的赶鸭上架。我的前端基础还是非常薄弱,在网上找了一些网站,用于空闲时间学习。在此做下学习笔记,以做复习使用。 网站的课程讲的很好,很适合像我这样零基础的人学习,非常感谢网站的维护者,推荐下: 绿叶学习网 1.CSS的3种引用方式: ---外部样式表,CSS代码和HTML代码分开存放,在HTML中通过link标签引入CSS。 CSS代码: div{ width: 200px; height: 200px; border: 1px solid red; } HTML代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--外部样式表--> <link href="demo1.css" type="text/css" rel="stylesheet"> </head> <body> <div>快看我,我是外部</div> </body> </html> 效果展示: ---内部样式表, CSS代码写在HTML的head标签的style标签中: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!-