作者声明:本博客中所写的文章,都是博主自学过程的笔记,参考了很多的学习资料,学习资料和笔记会注明出处,所有的内容都以交流学习为主。有不正确的地方,欢迎批评指正

WEB前端开发项目流程总结

1.新建项目文件夹

  

  文件夹结构要有层次,一般包括

  src:用于存放源代码。

    css:存放css代码 

      index.css:用于存放设置主页的scss

      common.css:存放公共的样式   ===>样式重置

    font:存放字体

    img:用于存放图片

    js:用于存放js代码

    lib:用于存放第三方库的内容

    sass:用于存放sass代码

      index.scss:用于存放设置主页的scss

      common.scss:存放公共的样式   ===>样式重置

      _base.scss:用于存放公共的变量

    index.html:主页内容   ==>  页面模板

  dist:用于最终打包压缩

2.利用npm进行包管理

  npm进行包管理的流程:以gulp为例

3.开始进行开发

  开发中用到的插件的使用:

    关于photoshop的使用

    关于markman的使用

    关于sass的使用

    关于iconfont在线字体的使用

    关于在线字体的使用(fontawesome bootstrap 自定义字体)

    关于zepto.js的使用

    关于swiper轮播图的使用

    关于hotcss的使用

    关于iscroll插件的使用

    关于fullpage的使用

    关于js加密技术

    关于cookie的内容js-cookie

    

4.进行调试

  开发中用到的调试工具:

    移动端真机调试:

      关于一键投影和chrome的使用

      关于spy-debugger的使用

5.发布项目

  开发中发布项目的工具:

    关于live-server的使用

    关于json-server的使用

6.开发经验的总结

  关于横竖屏rem计算延迟的问题

  关于时钟的问题

  关于屏幕适配的问题

  关于css3的兼容处理

  

WEB前端开发流程总结的更多相关文章

  1. 2022年Web前端开发流程和学习路线(详尽版)

    前言 前端侧重于人机交互和用户体验,后端侧重于业务逻辑和大规模数据处理.理论上,面向用户的产品里,所有问题(包括产品.设计.后端.甚至看不见的问题)的表现形式,都会暴露在前端,而只有部分问题(数据问题 ...

  2. Grunt搭建自动化web前端开发环境--完整流程

    Grunt搭建自动化web前端开发环境-完整流程 jQuery在使用grunt,bootstrap在使用grunt,百度UEditor在使用grunt,你没有理由不学.不用! 1. 前言 各位web前 ...

  3. 面试web前端开发,被打击了

    今天我去面试web前端开发,被打击了,也跟我也有一定的关系,最基础的东西我都没回答好,哎! 主要是我在等我有意向的公司给我发offer,闲着没事,刚好又有公司叫我去面试,我抱着多面一家也没有啥子坏处就 ...

  4. 【Yeoman】热部署web前端开发环境

    本文来自 “简时空”:<[Yeoman]热部署web前端开发环境>(自动同步导入到博客园) 1.序言 记得去年的暑假看RequireJS的时候,曾少不更事般地惊为前端利器,写了<Sp ...

  5. 给 Web 前端开发人员推荐20款 CSS 编辑器

    CSS 和 HTML,JavaScript 是网页的基础,作为前端开发人员,对这三者都要很熟悉.特别是未来流行全栈开发的时代,每项技术都是你知识结构中必要的一个节点. 在开发中,选择好工具是非常重要的 ...

  6. 淘宝前端工程师:国内WEB前端开发十日谈

    一直想写这篇"十日谈",聊聊我对Web前端开发的体会,顺便解答下周围不少人的困惑和迷惘.我不打算聊太多技术,我想,通过技术的历练,得到的反思应当更重要. 我一直认为自己是" ...

  7. Web前端开发规范文档

    Web前端开发规范文档 规范目的: 使开发流程更加规范化. 通用规范: TAB键用两个空格代替(windos下tab键占四个空格,linux下TAB键占八个空格). CSS样式属性或者JAVASCRI ...

  8. Web前端开发十日谈

    =========================================================================== 原文章: http://kb.cnblogs.c ...

  9. 用grunt搭建自动化的web前端开发环境实战教程(详细步骤)

    用grunt搭建自动化的web前端开发环境实战教程(详细步骤) jQuery在使用grunt,bootstrap在使用grunt,百度UEditor在使用grunt,你没有理由不学.不用!前端自动化, ...

随机推荐

  1. git 设置只输入一次用户名和密码

    https方式每次都要输入密码,非常不爽 按照如下设置可只输入一次 记住密码(默认15分钟): git config --global credential.helper cache 自己定义时间(一 ...

  2. 解决vscode换行光标跳转行首

    这个问题是由于设置自动保存而造成的. 解决方法1:取消自动保存. 解决方法2:在首选项的设置里加上"files.autoSaveDelay": 10000,延迟一小会自动保存的时间 ...

  3. Python学习 :多线程

    多线程 什么是线程? - 能独立运行的基本单位——线程(Threads). - 线程是操作系统能够进行运算调度的最小单位.它被包含在进程之中,是进程中的实际运作单位. - 一条线程指的是进程中一个单一 ...

  4. BurpSuite—-Scanner模块(漏洞扫描)

    一.简介 Burp Scanner 是一个进行自动发现 web 应用程序的安全漏洞的工具.它是为渗透测试人员设计的,并且它和你现有的手动执行进行的 web 应用程序半自动渗透测试的技术方法很相似. 使 ...

  5. node.js(二)

    今天我们学习如何运行起来一个项目,我还不会新建项目,所以我们打开一个小伙伴创建的项目,我用的开发工具是vscode 选择项目所在文件夹就好了. 打开后是这样子的 我们还要安装一下npm, 在这里安装, ...

  6. 第六节 Go数据结构之集合

    一.什么是集合 集合就是不同对象的无序聚集.那么链表和集合有什么关系呢?我们来变个魔术.如下图是各种颜色组成的链表: 下面我们一步步把链表变成集合. 第一步砍去链接 第二步去掉重复 第三步放到一个框里 ...

  7. 域名和IP之间的关系

    域名和IP的关系 在早期的互联网时代,没有那么多的主机,全部是用ip直接访问.可是IP不符合人类的记忆习惯,于是出现域名. 域名和IP的对应关系,在早期通过电脑的hosts文件直接解析,后来互联网的发 ...

  8. 'express'不是内部或外部命令, 也不是可运行的程序, 或批处理文件

    1. npm install -g express-generator 安装新的express框架2. express -h 错误提示: 'express'不是内部或外部命令, 也不是可运行的程序, ...

  9. 20155310《Java程序设计》实验五(网络编程与安全)实验报告

    20155310<Java程序设计>实验五(网络编程与安全)实验报告 一.实验内容及步骤 •任务一: 编写MyBC.java实现中缀表达式转后缀表达式的功能 编写MyDC.java实现从上 ...

  10. 20155325 2016-2017-2 《Java程序设计》第2周学习总结

    教材学习内容总结 上节课讲了些思维方法:git,vim的使用技巧,推荐了picpick截图软件. 第三章书本上涵盖了基本语法内容 由于在语法方面java和c有相似之处,所以我重点关注不同之处和易忽略之 ...