前端

前端常见问题整理

 ̄綄美尐妖づ 提交于 2020-03-14 12:43:33
1、页面数据不允许修改实现 页面中修改数据,若数据不允许被修改,有两种实现方式: 1、将type改为type="hidden";(隐藏) 2、加上属性:readonly="readonly" 来源: https://www.cnblogs.com/vole/p/12491317.html

BugHD for JavaScript上线,轻松收集前端 Error

扶醉桌前 提交于 2020-03-14 12:41:29
从收集 APP 崩溃信息到全面收集网站出现的 Error,现在的 BugHD 变得更加强大。目前, BugHD JS Error 收集功能 已正式上线,前端 er 们不用再面对一堆 Bug 无处下手。 下面,我们一起来看下有可能带给你的「惊喜」~ 一、实时收集网站的 JS 错误 首先,先添加项目至 BugHD,然后添加 JS 代码,即可全面实时掌控用户使用网站时发生的错误信息。详情见相关的 JavaScript 配置文档 . 二、灵活自定义地收集设备错误信息 BugHD 除了标准化的信息收集,同样支持灵活的自定义信息。 错误原因 & 错误堆栈 设备信息 (浏览器 & 操作系统) 请求信息(IP & 发送错误的 url ) 灵活的自定义参数(可以设置用户信息或其他自定义参数协作定位问题) 三、直观地展现错误数据分析 BugHD 从 时间 和 设备 分布两个维度,更加直观的展示错误的分布情况。 例如,根据过去两周每天的错误发生次数,我们可以判断错误发生的变化趋势; 针对错误的浏览器 & 操作系统的分布状况,我们对不同浏览器 & 操作系统进行适配; 四、详尽的错误列表分析 在错误列表页展示每次出错的详细信息,通过筛选对比,可分析不同的因素对错误产生的影响。 五、丰富的 WebHook 集成消息通知 支持多种第三方工具和自定义 WebHook,将错误收集集成到你的工作流中

前端要具备哪些技能

若如初见. 提交于 2020-03-13 13:30:47
前端开发人员具体需要的技能(最全面) 1. 要有 比较好的计算机基础   这里的计算机基础指的是数据结构与算法,操作系统,编译原理,计算机网络等等。虽然相对于其他方向而言,前端在工作中用到计算机基础的地方可能少一点,但是无论大小厂,招实习生其实都是为正式招聘做储备,所以会比较希望招将来有更大发展空间的人。 如果你具备比较好的计算机基础素养,那么以后在拓展到其他领域(WebGL —— 计算机图形学,Node.js 底层 —— 操作系统,JS 引擎和各种预编译工具—— 编译原理, etc.)的时候会更快上手。另外有一些公司对前端的概念不局限于 Web 前端,也包括移动端偏前端的部分,这里也需要你有比较好的计算机基础才能做好。前端领域有很多人已经不满足于造轮子,直接跑去造语言了,如果你编程基础够好,接触过各种形形色色的编程语言和范式,再上手这些东西也会方便些(比如Ruby/Python->CoffeeScript,Haskell->LiveScript)。   虽然也有很多地方为了招到足够多能来干活的前端会降低对计算机基础的要求,但是打好这方面的基础是没有坏处的,如果面试笔试被问到且答得上来,也是能够加分的。一些大厂经常会出现“不是前端的面试官来面前端”的情况,我个人是觉得如果这类面试官问的都是计算机基础问题的话,其实真的无可厚非,毕竟人家在面“一个前端程序员”之前,是在面“一个程序员

Web前端工程师要掌握的基础知识和技能

ぃ、小莉子 提交于 2020-03-13 13:29:25
目前web产品交互越来越复杂,用户使用体验和网站前端性能优化这些都得靠web前端工程师去做,web前端工程师是设计加开发的综合体,web前端工程师是在开发人员中最直接面向产品,面向用户的设计人员,一个开发团队的成果是要靠web前端工程师去展现,因为用户不会去关心后台的处理有多么强大;在设计人员中web前端工程师是直接面向开发人员的设计人员,向开发人员以一种计算机语言的方式传递其设计理念,web前端工程师在整个团队中是很关键的。   Web前端工程师要掌握的基础知识和技能包括:   1、网页的基本结构(HTML + CSS)   HTML是一种标记语言,而不是编程语言,最基本是标签是和,CSS是用来定义如何显示HTML元素的。对HTML+CSS很容易入门,但很多人不够深入,举几个例子:   签是作什么用的?margin-left与left有什么区别,应该在什么情况下使用?再出个DIV+CSS布局问题:一个宽度不确定的DIV里面放三个水平对齐的DIV,左右两个DIV宽度固定为150px,中间那个DIV充满剩余的宽度。如果这些问题你目前还不知道,对那个布局问题几分钟内不能解决,说明你对HTML+CSS还不够深入。   2、浏览器是怎么展现网页的   不同内核的浏览器对网页的渲染是不一样的,目前浏览器都有客户端调试工具,下图展现一个google首页在IE9下的加载细节:  

前端ps实用小技巧

流过昼夜 提交于 2020-03-13 11:31:30
   下面总结了 4 个日常使用 PS 的小技巧,希望对大家有所帮助 (重点推荐第一个小技巧)     场景一: 用ps测量 PSD 图中的元素宽高大小时,一般手动使用 测量,但其实是有快捷键的,如下图         用移动工具选中元素相应图层,然后 ctrl+t , 会进入下图箭头所示模式 (按esc取消该模式) ,同时信息面板会显示该元素宽高值              场景二: 若你想改变 PSD 的大小,比如 UI 给的 PSD 宽度为 750px ,你想改成 640px ,       图像-图像大小调出设置宽高的窗口,然后会自动按比列调整至你想要的大小           场景三: 当你打开 PS ,发现左边的工具栏和右边的图层区域都被隐藏了,如下图        左边工具栏: 选择窗口-工具栏调出出左边工具栏            右边图层区域: 选择窗口-图层调出右边显示图层 (前提条件必须是PSD才行,如果给你的设计图是PNG,是无法选择图层的)          场景四: 怎么查看设计图上元素的渐变颜色?       移动工具 选中按钮元素,然后会出现右边箭头所指的渐变叠加,双击后在出现的图层样式界面单击红色框区域,       最后在弹出的渐变编辑器界面点击红色框区域小倒三角即可 (从左往右点倒三角)              注:

程序员应不应该搞全栈

|▌冷眼眸甩不掉的悲伤 提交于 2020-03-12 22:17:36
毕业很多年,一直是在做后端开发,无论是c还是java,甚至用的python也是后端做一些服务类的产品,也不是没想过做点前端的,印象中前端难度比较大,还记得大学的时候,和一同学给老师做个网页产品,但是我们两个对前端不熟悉到文盲的程度,折腾了半个暑假,没啥成果,最后不了了之了,在心理就留下了对前端的阴影,还有经常接触到的前端信息是“xxx浏览器不兼容了”,“css怎么变态难调”了,最后形成了抵触心理。 后面也多次想尝试做点练手的实用的小东西,由于前端的功底比较差最后也不了了之。唯一做过的是在2013年左右,记得用wxPython做了一个系统监控程序,可以自动维护系统,监控错单,自动回单等,界面完全照着另外一个PIM(个人信息管理)系统来抄的,竟然也不丑,能看。 后来web应用兴起,一些管理的系统很少采用CS模式了,多是BS模式,从这个角度来说,浏览器就相当于一个操作系统,难怪windows一直要把IE和系统捆绑起来。相对于CS模式来说,BS模式的软件更易于使用,不用安装,不用考虑各个主机上特殊的差异,只要可以跑浏览器就可以跑应用了,升级的时候,往往是服务器端软件升级了就行了,不用用户操作,体验比较好。对于各个浏览器不兼容问题,业界出现了类似于Jquery库,也有些ui库,比如Bootstrap ,easyUI库,看起来中规中矩,挺正统 ,却不能让人惊艳。 直到了遇到了Antd

未来魔法校的微前端实践

橙三吉。 提交于 2020-03-12 18:49:01
一、 背景 魔法校是tob起家,众所周知tob业务很容易做成巨石应用,近两年来魔法校飞速发展,我们的某个主要的前端项目遇到了瓶颈,那就是项目太大了。 为了减少耦合度加快打包速度,我们选择将一些功能提出来新建项目,然后通过iframe的方式引入到主项目中去。 虽然项目体积大的问题得到了解决,但用户体验却随之下降。 因为每次用户切换到iframe的tab时不管优化的再好总要有一瞬间的白屏,整个系统使用起来没有连贯性,而且在iframe里切换页面浏览器的地址栏url并不会变化,给人的感觉就是两个系统。 业务的快速发展迫使我们去寻找一种新的方式-微前端。 二、微前端的基本概念 1、什么是微前端 微前端是近两年比较火的一个概念,这个术语最初来自 2016 年的 ThoughtWorks 技术雷达,它将微服务的概念扩展到了前端领域。 目前的趋势是构建一个功能丰富且强大的前端应用,即单页面应用(SPA)。 前端层通常由一个单独的团队开发,随着时间的推移,会变得越来越庞大而难以维护。 这就是传说中的前端巨无霸Frontend Monolith。 微前端背后的理念是将一个网站或者 Web App 当成特性的组合体,每个特性都由一个独立的团队负责。 每个团队都有擅长的特定业务领域或是它关心的任务。 这里,一个团队是跨职能的,它可以端到端,从数据库到用户界面完整的开发它所负责的功能。 然而

关于前端学习路线的一些建议

元气小坏坏 提交于 2020-03-12 11:52:21
前言 对于刚开始学习前端的伙伴俩说,问得最多的问题就是 ——前端技术现在如此繁杂,我到底应该如何学习。这个话题太大了,几句话回答不好;也由于这个问题确实困扰了很多前端开发人员,所以我也就着手系统的输出这篇文章。 虽然这篇文章花了很长时间,肯定也有其局限性;希望各位不吝指出。 入题 我们俨然能感受到前端岗位现在已经发展成了最重要的研发岗位之一,所以对我们提出的要求也就越来越高。所以我们需要学的也就不仅仅只是CSS&HTML&JavaScript了。但这三大件一直都是前端的根本,这一点从未改变。而这三大件中JavaScript又是重中之重。 接下来我会结合我的一点经验,给出前端学习路线的一些具体建议。 目录 三大件学习 库工具 前端框架( MVVM )的学习 浏览器 & 计算机基础 前端工程化 性能优化 Nodejs 数据结构和算法 依葫芦画瓢 三大件学习 现在每年依旧有很多初级入门的前端开发。所以对初入门的朋友也给出一点意见。 刚入门的朋友,我觉得不应该一开始就学习像Vue、TypeScript、Webpack等知识。应该把重点放在CSS&HTML&JavaScript基础知识的学习上。 CSS & HTML 对于刚入门的朋友我依旧建议先将CSS(3)&HTML(5)的知识点认真学习一遍。学习的途中最好是学习完一部分就自己在敲一遍代码,加深自己的记忆。 当然如果你愿意

前端学习--Vue+H5开发APP踩坑

蹲街弑〆低调 提交于 2020-03-12 10:46:44
1、长按按钮N秒后触发函数 实现步骤: (1)手指按在按钮范围时开始一个定时器,设置两个变量,其中一个记录按下的时间,每过一秒就加1,另一个记录手指是否有移动过 (2)手指按下后,如果手指有移动则清除定时器,变量设置为0 (3)手指抬起,清除定时器,判断变量值与N是否相等 < button id = 'actionState' > 长按N秒后触发函数 < / button > / / 全局变量 let longClick = 0 ; let isMove = false ; mounted ( ) { let vm = this ; let state = document . getElementById ( 'actionState' ) ; / * 手指按下 * / state . addEventListener ( "touchstart" , function ( e ) { longClick = 0 ; / / 设置初始为 0 timeOutEvent = setTimeout ( function ( ) { longClick = 1 ; } , 1000 ) ; } , false ) ; / * 手指移动 * / state . addEventListener ( "touchmove" , function ( e ) { clearTimeout (

前端路由 VS 后端路由

删除回忆录丶 提交于 2020-03-12 08:39:01
什么是路由? 1.后端路由:对于普通网站来说,所有的链接都是URL地址,所有的URL地址都对应服务器上对应的资源 2.前端路由:对于单页面应用程序来说,主要通过URL中的hash(#号)来实现不同页面之间的切换,同时,hash有一个特点:HTTP请求中不会包含hash相关的内容,所以,单页面程序中的页面跳转主要用hash实现。 3.在单页面应用程序中,这种通过hash改变来切换页面的方式,叫做前端路由(区别后端路由) 来源: https://www.cnblogs.com/linm/p/12466935.html