`
huoquan
  • 浏览: 27186 次
  • 性别: Icon_minigender_2
  • 来自: 北京
文章分类
社区版块
存档分类

现代前端开发小记

阅读更多

web开发分为前后,作为一个后端工程师,或者是前端小白,前端的开发可能会很头疼。 
一路走来,坎坎坷坷,好在升级打怪还是会遗留一些经验的,记录下现代前端开发的经验。

黑暗时代的前端开发

在这个时代,前端开发的流程可能是这样的:UI前端框架最新力作!有奖试读!

.代码 
  1. * 写各种html、css、js  
  2. * 跑到各种前端模块网站上手动下载各种库  
  3. * 一遍遍刷新浏览器,查看效果  
  4. * 最终压缩各种静态文件  

 

问题

.代码 
  1. * html代码重复,例如对于一个header和footer极有可能违反DRY,  
  2. 后期维护的时候绝对会是镇痛  
  3. * 无法实时查看效果,需要手动刷新,就像某些蛋疼的java服务器,写个api不能自动加载  
  4. 需要手动重启,一个小时调不了几个bug(Life is too short,please use python).  
  5. * 压缩这个事情很多人是不会去做的。  
  6. * 代码的模块性很差,jquery确实灵活,不过时间长了之后代码就会杂草丛生,尤其是有  
  7. 别人接管你的代码的时候,极有可能看不懂,然后重构,这也就是为什么前端会出现各种  
  8. MVC框架的原因  

UI前端框架最新力作!有奖试读!  

现代前端开发

这个时代已经不是刀耕火种的年代了。

首先说说MVC

MVC在后端已经出现N多年了,前端现在也有出现,但是前端是不是要用MVC这种 
东西是有待商榷的,个人的体会是,如果你的项目很小,只有 你1~2个工程师 
维护的时候,不需要用MVC框架,原因很简单,学习成本,时间是宝贵的,学习成本 
绝对是硬伤,例如你选择Backbone Angular的时候,陡峭的学习曲线不仅仅会影响 
你自己,以后新人在用你项目的时候也会经历这个痛苦。

MVC的优点,貌似这个就不用说了,一搜一大片。

我的实践

github上有很多优秀的开源项目,前端的工具也有很多,善用工具,善用优秀库

我brunch的一个脚手架项目 UI前端框架最新力作!有奖试读!

.代码 
  1. check到不同分支使用,或者直接download release  
  2.    
  3. * 使用coffee写js,coffee会帮你避开js里面的各种血坑,使用类似python的语法  
  4. * 使用html、css模板引擎,可以让你少写很多字母  
  5.     html我选择的是jade, 可以使用include的语法,帮你减少DRY的可能性  
  6.     css我选择stylus  
  7. * 使用构建工具,我使用的是brunch,npm,bower  
  8.     brunch解决黑暗时代一遍一遍手动刷新,以及自动引擎coffee,jade,编译  
  9.     bower使得js、css库的安装方式变的异常简单  
  10.     npm类似bower  
  11. * bootstrap或者purecss(YUI),个人倾向于使用purecss(IE7+),IE6需要你自己手写css  
  12. * 如果不用MVC,对js又不是很懂的话可以使用zarkfx,绝对节省你的开发时间,  
  13.     zarkfx可以使用brunch + jade的 具体可以参考我simple项目的br-coffee-jade分支  
  14. * 如果使用MVC,backbone + chaplin or angular选一个吧,注意MVC里面的限制,  
  15.     例如使用MVC后他们有自己的驱动机制,对DOM操作都有限制,尤其是不能使用  
  16.     zarkfx,这点非常讨厌  

 

记住,总会有办法解决重复的操作,提高你的开发效率的,使用工具,进行现代的web开发。

0
2
分享到:
评论

相关推荐

    javascript Dom开发小记

    web前端开发必备的技术,dom编程也是其中重点中的重点

    liferay开发小记---开发环境的搭建

    本文将详述“liferay开发小记——开发环境的搭建”这一主题,旨在帮助开发者们快速有效地设置自己的开发环境,从而顺利进行Liferay插件或portlet的开发。 首先,我们需要了解Liferay开发的基础。Liferay提供了多种...

    android开发小记

    在“android开发小记”这个主题中,我们可以深入探讨Android应用程序开发的相关知识,特别是通过查看提供的压缩文件中的代码示例。这些文件名如lesson_8_code.zip至lesson_20_codel.zip,以及不同的Mp3Player版本,...

    Flex整合J2EE开发小记+源码下载

    总的来说,Flex与J2EE的结合是现代企业级应用开发中常见的一种模式,它结合了前端的易用性和后端的强大功能,是构建复杂Web应用的理想选择。通过阅读和研究提供的源码,开发者可以深入理解这种集成方式的具体实现,...

    短信协议开发小记

    总结了短信协议cmpp、sgip、smgp等协议长短信开发要点

    snmp开发小记

    1、树莓派3B+安装配置net-snmp,搭设snmp代理 2、snmp++库的编译 3、snmp++示例(v1~v3) 4、在学习中遇到的问题以及解决方式 5、开发工具的资源共享

    J2EE开发之常用开源项目小记

    这篇小记主要关注了几个关键领域:持久层、MVC框架、视图层、JavaScript库以及缓存技术。下面将详细阐述这些知识点。 1. **持久层**: - **Hibernate**:是一个流行的ORM(对象关系映射)框架,允许开发者以面向...

    开发经验小记.txt

    关于C#后台转换sql数据问题 格式:Convert.TO(DBHelper(sql).table[0].toString());

    android 开发小记

    一些常用的技术总结,包括java基础,android 基础知识。

    java小记.rar

    这份"java小记.rar"压缩包很可能包含了作者多年从事Java Web开发的经验总结,可能包括代码示例、笔记、最佳实践等内容。 在Java Web开发中,Servlet是核心部分,它是一个Java类,用于扩展服务器的功能,处理HTTP...

    Python django Extjs 项目开发中的错误小记

    以上这些问题的解决方法和思路涉及到的知识点涵盖了Django后端开发、前端界面展示、数据库操作、服务端配置以及前端JavaScript编程等多方面内容。通过对这些常见问题的分析和解决,开发者可以更加深入地理解Python ...

    谷歌Chrome浏览器扩展程序开发小记

    谷歌Chrome浏览器扩展程序开发小记 本文主要介绍了谷歌Chrome浏览器扩展程序的开发过程,作者根据公司的规定,每月八小时,弹性工作制,需要计算工作时间,但是公司的考勤日历不太便捷,于是作者决定自己写一个...

    开发细节小记

    ### 开发过程中的关键细节与注意事项 #### 一、服务器重启与页面刷新 在软件开发过程中,特别是Web应用开发中,经常会遇到修改代码后需要查看效果的情况。根据文档描述,对于不同类型的文件修改,有不同的处理方式...

    A Small Front-end Algorithm Note.zip

    在前端开发中,算法能力是不可或缺的一部分。这本《A Small Front-end Algorithm Note》或许就是作者对于前端算法的一种独特见解和经验总结。虽然标题和描述都简洁明了,但我们可以从中推测出这可能是一份包含了前端...

    Linux boost库安装、编译问题小记

    环境: Linux s12084 2.6.9-67.ELsmp #1 SMP Wed ...小记一下。以备以后参考。  boost 库做得真好。在windows 平台, linux 平台下编译都很顺利。hp aCC 也宣称对 boost 1.35 完全支持 。  全部编译是很痛苦的过程

    C++编程小记,经典收藏

    ### C++11 新特性详解 #### 一、Auto 关键字的新用途 - **旧用途**:在C++11之前,`auto`关键字主要用于指定变量的存储期。 - **新用途**:C++11引入了类型推断的概念,`auto`变成了一个类型占位符,用于告诉...

Global site tag (gtag.js) - Google Analytics