最近用了不少业余时间,在加强Web前端。有个很大的感触就是,web前端比较麻烦,主要是布局和样式。最主要的原因,还是之前实践得比较少,熟能生巧,不得不服啊。

自己从头开始写布局和css太费心思了,比较偏好用Bootstrap。看着别人用Bootstrap做得网站很美观,轮到我了,就很差劲。于是乎,研究别人的代码,镜像别人的网站,可以很容易copy到一些网站的前端设计。

网站镜像工具,网上有付费的,也有免费的,我比较喜欢用WinHTTrack。

目前已经初步研究了2个Bootstrap精品网站:
 Unslider轮播组件-Bootstrap精品网站-研究学习的Demo 在线演示:http://fansunion.cn/webdemo/unslider/index.html
 Less-Bootstrap精品网站-研究学习的Demo
 在线演示:http://fansunion.cn/webdemo/less/index.html
 
  --------------------------------------------------
 最近主要做的前端板块有:导航菜单条、 表格、页脚Footer、图片轮播、图片上传。

 做前端和后端一样,有很多是重复性的工作。最不能接受的是重复的代码,越干越没劲,然后重复的是思路。
1.代码方面,需要总结整理,避免每次都从零开始。 
2.思路要梳理,不能迷迷糊糊的。
3.网上有很多优秀的前端组件,比如日期组件-My97DatePicker、轮播组件Unslider、上传组件WebUploader等。
   一定要加以认真学习,能够很熟练地使用。
4.如果网上没有合适的,比如分页组件,我就自己动手写,fu-page。 
-----------------------------------------------------------------
我所见到的互联网上的网站主要就3类:
一类是,京东和淘宝这种,前端完全自定义的,这种商业化非常严重的网站,前端基本不可能复用。每个公司的UI,几乎都不同。
二类是,企业官网、博客网站、某个公司的产品介绍等,大体类似,这类网站,网上用Bootstrap做UI的非常多,也比较容易copy。
或者用免费的CMS系统,也可以很快的搞定。
三类是,后台管理系统,一套系统的大部分页面的布局和色调,是类似的。不同系统之间,由于业务类似,基本都是标准的CRUD,所以布局、色彩,可以用一样的,这是比较偷懒的节省成本的做法。
----------------------------------------------------------------
今天就先写这么多吧,要帮一个网友解决UEditor图片上传的问题,当然是付费的啦~

小雷FansUnion,博学的互联网技术工作者,全栈式多屏开发工程师。
掌握Web前端,Java和PHP服务器后端,Android手机端,.Net-Windows客户端等多种技术。

Web前端实践经验总结的更多相关文章

  1. web前端-面试经验总结

    这几次面试主要是冲着百度去的 面试1的主要问题: 笔试: 1.解释css盒子模型 2.常用选择器,以及优先级 3.B如何继承A 4.写一个闭包实例,有什么优点缺点 5.html5的心特性有哪些 6. ...

  2. 从游戏开发到web前端——仅仅只是开始

    文章开头,请允许我随便扯扯. 一来,开头从来都是最难写的,二来,描述我现在的心情和状态以及工作背景啥的,对于大家理解后面的内容也许会有所帮助~ 2012年211大学毕业,工作4年了,一直都是做游戏前端 ...

  3. 想转行做程序员,目前想学WEB前端,想问该自学还是报培训班

    首先我们还是先看一下WEB前端目前的工资情况吧,我在IT招聘网站拉勾网来进行搜索1-3年WEB前端工作经验大专学历的条件来看. 深圳: 可以看出目前深圳的平均的工资都在10K以上,因为大城市给的机会多 ...

  4. Web前端优化最佳实践及工具集锦

    Web前端优化最佳实践及工具集锦 发表于2013-09-23 19:47| 21315次阅读| 来源Googe & Yahoo| 118 条评论| 作者王果 编译 Web优化Google雅虎P ...

  5. 根据实践经验,讲述些学习Java web能少走的弯路,内容摘自java web轻量级开发面试教程

    在和不少比较上进的初级程序员打交道的过程中,我们总结出了一些能帮到合格程序员尽快进阶的经验,从总体上来讲,多学.多实践不吃亏.本文来是从 java web轻量级开发面试教程从摘录的. 1  哪些知识点 ...

  6. 【社区公益】送《Web前端开发最佳实践》给需要的人

    算起来至今,我进入软件开发行业已经有11年之久.从最初的研究人工智能,到后来的Web开发,控件开发,直到现在纯粹的Web前端开发.虽然没有大的作品问世,但也是勤勤恳恳,踏实做事,低调做人.从来不吹牛逼 ...

  7. Web前端开发最佳实践(1):前端开发概述

    引言 我从07年开始进入博客园,从最开始阅读别人的文章到自己开始尝试表达一些自己对技术的看法.可以说,博客园是我参与技术讨论的一个主要的平台.在这其间,随着接触技术的广度和深度的增加,也写了一些得到了 ...

  8. Web前端开发最佳实践(2):前端代码重构

    前言 代码重构是业内经常讨论的一个热门话题,重构指的是在不改变代码外部行为的情况下进行源代码修改,所以重构之前需要考虑的是重构后如何才能保证外部行为不改变.对于后端代码来说,可以通过大量的自动化测试来 ...

  9. Web前端自动化测试Cypress实践总结

    本文主要首先主要介绍了什么是自动化测试,接着对常用的自动化测试框架进行了对比分析,最后,介绍了如果将自动化测试框架Cypress运用在项目中. 一.自动化测试概述 为了保障软件质量,并减少重复性的测试 ...

随机推荐

  1. CSS3常用属性及用法

    1.transition: 过渡属性,可以替代flash和javascript的效果 兼容性:Internet Explorer 9 以及更早的版本,不支持 transition 属性. Chrome ...

  2. 前端面试题(HTML/CSS)

    (前端面试题大全,持续更新) 常用的块级元素和行内元素有哪些?说说他们的特点? 浮动产生的原因?清除浮动? 说说一下盒模型 float和position一起用是什么效果 rem用过吗?做不同手机的适配 ...

  3. nuxt使用QRCode.js 生成二维码

    QRCode.js 是一个用于生成二维码图片的插件, 官方文档 . 我是在nuxt.js(vue官方的服务端渲染方式)项目里使用的QRCode.js: 第一步:看官方文档: 第二步:下载QRCode. ...

  4. 【习题 6-8 UVA - 806】Spatial Structures

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 写两个dfs模拟就好. 注意每12个数字输出一个换行.. [代码] /* 1.Shoud it use long long ? 2. ...

  5. c++中的相对路径

           今天在vs2010里读取相对路径下的图片文件出了点问题.于是查了一下相对路径的编程知识,记录下来分享给大家:      问题描写叙述:path=".\\TrainData\\& ...

  6. 将一个类写成WebService服务的形式

    WebService是一种跨编程语言和跨操作系统平台的远程调用技术,主要解决不同语言写的应用程序之间.不同平台(linux/windows/andrid)之间的通信,即异构系统之间的通信. 常用的天气 ...

  7. HDU 2473 Junk-Mail Filter 并查集删除(FZU 2155盟国)

    http://acm.hdu.edu.cn/showproblem.php?pid=2473 http://acm.fzu.edu.cn/problem.php?pid=2155 题目大意: 编号0~ ...

  8. 30分钟学会如何使用Shiro(转)

    本篇内容大多总结自张开涛的<跟我学Shiro>原文地址:http://jinnianshilongnian.iteye.com/blog/2018936 我并没有全部看完,只是选择了一部分 ...

  9. Redis 哨兵(sentinel)模式集群配置(5.0.3版本)

    一.准备工作 1.系统环境:centos6.4 2.服务器六台(1主5从): 192.168.1.161(master) 192.168.1.162(slave) 192.168.1.163(slav ...

  10. fdopen:让文件描述符像文件一样使用

    FILE * fdopen(int fildes,const char * mode); fdopen与fopen类似,返回一个FILE *类型的值,不同的是此函数以文件描述符而非文件作为参数. 如果 ...