搜索
首页后端开发php教程前端工程师应该具备的三种思维_PHP

编者按:本文通过逻辑思维,商业思维,设计思维三种维度来匹配你是否一位合格的前端工程师。因为前端工程师不仅仅是负责接资料,捞数据,做个回应等这些杂事,他们应该更加需要去跟后端工程师、设计、PM进行沟通。所以,团队合作,协调配合等等都需要考虑代码以外更多的事情。


如果你是一个天才工程师(马上可以离开),可以独立完成一个很多事情,你可以是一个怪咖,因为我相信没有一个人不会不佩服你。但现实归现实,多数人都不是天才,而我们在职场上也不是单打独斗,我们需要团队合作,需要协调和配合,需要考虑除了代码以外的更多事情。

前端工程师,也不仅仅只是负责接资料,捞数据,做个回应。当然只做这些也并没有不对,但我们需要和后端工程师沟通,我们也需要和设计沟通,也需要和 PM 沟通,怎么做才是对这三方都比较有好处?

逻辑思维

在开始写某一段代码的时候,想一下它会用在哪里,会重复用吗? 它以后会不会变,如果会变,那可以怎样变?一般网页结构的变化,虽然有很多但是也有一个根据,这个根据就是可以预先估计好的。没有一个案子,是不会「不改」的,很多时候你都是要一边做一边改,甚至可能会来个乾坤大挪移。当真的需要发生变动和修改的时候,你有什么对策?这些都是需要想好,并且建立在一个逻辑上。

通常专业的设计师,设计一个网页的元素都是同质性很高,等比或对比的,所以代码按理也是可以重复用的。所以为何你要学会用 CSS preprocessor (Sass,stylus,less),写一个 Mixin 或一个变量,一开始用你会觉得很麻烦,但是用了你就回不去了,不但提高你的效率还提高了你的准确率。

工程师的世界就如武林,大家都各自修炼,每天都有新的祕籍,大家都很好奇跑去修炼一下,希望有天成为武林高手。这也是提升你见识和专业的潜动力,如果你没有好奇心,看的和懂得东西太少,逻辑自然不会跟上时代。要保持不断的学习,来磨练自己的逻辑思维。

逻辑思维某程度,就是你的程序专业能力,除了能写出来还要可维护,可阅读。当事情建立在一个很好的逻辑上,那么出错几率就会比较低,和你工作的人也会比较愉快。

可以把一件事做的很好,那是师傅;可以把一件事做好和预测未来的事,那才是专家。

商业思维

PM、老板或者客户,都会问你,「你需要多少时间」,如果说的太短,可能会做不完;如果说的太长,也不可能,这是一个怎么回答怎么死的问题。有时候,需要换一个立场,站在第三方的角度思考。我们的完成度,和他们的完成度可能是不一样的。

我们把案子的细节分成两种情况,一种是你已经有经验,可以预估时间的;一种是你没有做过或你很陌生的,你没有时间估计的基础。

那么提出一个,他们可以最低接受的标准,例如一个 App 网站,最低标准需要一个首页,和一个链接去下载 app 的 2 个按钮,这些都是可以预估的。而剩下的,你需要 Research 一下,之后再给一个比较有根据的时间。估计一个案子需要多少时间做完,是非常非常的重要,因为你消耗的是一组人的时间,不是你自己的(除非你自己一个人做,或者你是老板)。如果你估算错了,后面就会延期,做不出来没有很大的关系,最重要是把问题解决,提出你的解决方法,什么样的方法才可以达到解决问题的目的。

换一个立场提出解决方案,对事情是有帮助的,对公司或客户是有帮助的,客户不会在乎你解决不了手机网页看不到 20 个栏位的 table 那个问题,但是客户很乐意听你说,这样的 Table 不好看,可以换一个显示的方法。客户也不太在意你是用 Rails 还是 php(有些是很在意,他们假装他们懂),可以购物和发文就好。

前端工程师可能很容易接触到客户的投诉,所以有些东西没有想好,就会很麻烦。做个网站,换作你是网友或客户,你会满意你自己做的网站吗?

设计思维

很多时候,前端工程师本身也是设计师,但是也有很多是本身是前端工程师也是后端工程师,设计和前端是分割不开的。当然我这里说的设计,不是真的要你弄一个画面或完整的设计图。

It’s not just what it looks like and feels like. Design is how it works. —Steve Jobs

前端的设计是指一个画面或元素,如何被执行和创造,移动或消除,这个设计在不同的宽度和高度,不同的装置看,效果是怎样,考虑进去就是你的设计思维,怎么把设计师的画面弄成一个活生生的网页,要用设计师的角度去思考,才能有办法把设计图的概念充分的表达出来。

话说早前,收到一个「设计图」,上面有一个「X」,我问客户这是什么,他说是「回上一页」,为何回上一页是「X」,这不是一个 popup 也不是一个 modal,同时这个图上还有很多不同颜色和大小的「X」,分别代表了「删除」、「关闭」、「滑下」,这是一个不太合理的设计。

设计的思维,会直接影响你写的代码结构和网页结构,因为你看不出设计的重点在哪里,怎么写才可以达到设计师要求的效果,你没有办法好好的组织你的结构和元素,就无法好好把网页拼凑出来。这不但大大降低了你的效率,做出来的东西也不会一致。可能一个网站,就出现几种本该一样,结果「很像」但是不一样的按钮,因为你用了几个 class 和不同结构来做。你一开始就没有好好思考设计。

你可以做什么

  1. 没事要练功,FB 逛几分钟就好,不需要留恋太久。

  2. 做好一个网站,自己玩一下,给你朋友玩一下,问一下他们的意见?多问几个。

  3. 多看设计图,看思考一下你会怎么做。

本文出自:kimix 的博客

声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
优化PHP代码:减少内存使用和执行时间优化PHP代码:减少内存使用和执行时间May 10, 2025 am 12:04 AM

TOOPTIMIZEPHPCODEFORDUSEMEMORYUSAGEAGEAGEAGEAGEAGEANDEXECUTITIEM,关注台词:1)USEREEREFERESCENCENCINCOPYINSTEADOFCOPYINGINATATASTRUCTURESTROUCTURESTOREDUCEMORYCONSUMPTION.2)杠杆phphppphpphp'sbuilt intimpunctionslikearray_mapforfunctionslikearray_mapforfforfforfforfasterapasterexecution.3)

PHP电子邮件:分步发送指南PHP电子邮件:分步发送指南May 09, 2025 am 12:14 AM

phpisusedforsendendemailsduetoitsignegrationwithservermailservicesand andexternalsmtpproviders,自动化notifications andMarketingCampaigns.1)设置设置yourphpenvironcormentswironmentswithaweberswithawebserverserverserverandphp,确保themailfunctionisenabled.2)useabasicscruct

如何通过PHP发送电子邮件:示例和代码如何通过PHP发送电子邮件:示例和代码May 09, 2025 am 12:13 AM

发送电子邮件的最佳方法是使用PHPMailer库。1)使用mail()函数简单但不可靠,可能导致邮件进入垃圾邮件或无法送达。2)PHPMailer提供更好的控制和可靠性,支持HTML邮件、附件和SMTP认证。3)确保正确配置SMTP设置并使用加密(如STARTTLS或SSL/TLS)以增强安全性。4)对于大量邮件,考虑使用邮件队列系统来优化性能。

高级PHP电子邮件:自定义标题和功能高级PHP电子邮件:自定义标题和功能May 09, 2025 am 12:13 AM

CustomHeadersheadersandAdvancedFeaturesInphpeMailenHanceFunctionalityAndreliability.1)CustomHeadersheadersheadersaddmetadatatatatataatafortrackingandCategorization.2)htmlemailsallowformattingandttinganditive.3)attachmentscanmentscanmentscanbesmentscanbestmentscanbesentscanbesentingslibrarieslibrarieslibrariesliblarikelikephpmailer.4)smtppapapairatienticationaltication enterticationallimpr

使用PHP和SMTP发送电子邮件的指南使用PHP和SMTP发送电子邮件的指南May 09, 2025 am 12:06 AM

使用PHP和SMTP发送邮件可以通过PHPMailer库实现。1)安装并配置PHPMailer,2)设置SMTP服务器细节,3)定义邮件内容,4)发送邮件并处理错误。使用此方法可以确保邮件的可靠性和安全性。

使用PHP发送电子邮件的最佳方法是什么?使用PHP发送电子邮件的最佳方法是什么?May 08, 2025 am 12:21 AM

ThebestapproachforsendingemailsinPHPisusingthePHPMailerlibraryduetoitsreliability,featurerichness,andeaseofuse.PHPMailersupportsSMTP,providesdetailederrorhandling,allowssendingHTMLandplaintextemails,supportsattachments,andenhancessecurity.Foroptimalu

PHP中依赖注入的最佳实践PHP中依赖注入的最佳实践May 08, 2025 am 12:21 AM

使用依赖注入(DI)的原因是它促进了代码的松耦合、可测试性和可维护性。1)使用构造函数注入依赖,2)避免使用服务定位器,3)利用依赖注入容器管理依赖,4)通过注入依赖提高测试性,5)避免过度注入依赖,6)考虑DI对性能的影响。

PHP性能调整技巧和技巧PHP性能调整技巧和技巧May 08, 2025 am 12:20 AM

phperformancetuningiscialbecapeitenhancesspeedandeffice,whatevitalforwebapplications.1)cachingwithapcureduccureducesdatabaseloadprovesrovesponsemetimes.2)优化

See all articles

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

安全考试浏览器

安全考试浏览器

Safe Exam Browser是一个安全的浏览器环境,用于安全地进行在线考试。该软件将任何计算机变成一个安全的工作站。它控制对任何实用工具的访问,并防止学生使用未经授权的资源。

DVWA

DVWA

Damn Vulnerable Web App (DVWA) 是一个PHP/MySQL的Web应用程序,非常容易受到攻击。它的主要目标是成为安全专业人员在合法环境中测试自己的技能和工具的辅助工具,帮助Web开发人员更好地理解保护Web应用程序的过程,并帮助教师/学生在课堂环境中教授/学习Web应用程序安全。DVWA的目标是通过简单直接的界面练习一些最常见的Web漏洞,难度各不相同。请注意,该软件中

mPDF

mPDF

mPDF是一个PHP库,可以从UTF-8编码的HTML生成PDF文件。原作者Ian Back编写mPDF以从他的网站上“即时”输出PDF文件,并处理不同的语言。与原始脚本如HTML2FPDF相比,它的速度较慢,并且在使用Unicode字体时生成的文件较大,但支持CSS样式等,并进行了大量增强。支持几乎所有语言,包括RTL(阿拉伯语和希伯来语)和CJK(中日韩)。支持嵌套的块级元素(如P、DIV),

螳螂BT

螳螂BT

Mantis是一个易于部署的基于Web的缺陷跟踪工具,用于帮助产品缺陷跟踪。它需要PHP、MySQL和一个Web服务器。请查看我们的演示和托管服务。