Ⅰ 请问前端模块和node.js的关系
1 node.js是javascript运行时,可以看作是javascript运行环境,类比浏览器
2 npm和前端框架的关系类比jar包和maven,然后maven需要运行环境jdk,npm管理包需要node
3 用node.js开发前端或集成前端模块,则node.js主要是用来做为前端开发环境。完成之后,服务器是什么语言无所谓。此时服务器对于js和html来说,只是个http服务器,传输文件,运行环境还是在浏览器。
4 对于node.js模块来说,如http,express,file等模块,node.js环境是必须的。就好像java运行需要jdk。
Ⅱ 如何学习前端模块化知识
学习前端模块化知识主要集中精力学好以下知识点:
1、学好三驾马车:HTML5 + CSS3 + JavaScrip
2、推荐学习过程:
1)CSS
(1)入门:
Codeademy上的html&css课程——在线交互式编程平台,弄清楚基本概念和基本语法
w3school上的HTML/CSS教程——技术手册式的教程,比较全面,照着实例敲一遍
(2)进阶:
《精通CSS·高级Web标准解决方案》——对CSS有一个比较深入的学习,对核心技术了解。
《HTML5权威指南》——非常全面的书,内容也很新,包含了HTML5+CSS3+JS DOM
(3)实战:
bootstrap框架: bootstrap中文网/《bootstrap实战》——流行的前端框架,注重实用即可
Codeademy上的Web Developer Skills+Projects——通过自己做小页面/小网站来运用所学
(4)提高:
《CSS禅意花园》——提高自己的艺术设计能力,通过实例来学习如何用CSS设计出漂亮的页面
2).Javascript:
(1)入门:
Codeademy上的javascript教程——实例比较多,比较浅,算是基本了解JS
w3school上的JS教程——比较详细的了解下JS的特性
《JavaScript DOM编程艺术》——讲js和DOM的基本知识和运用,了解JS和DOM可以做什么
(2)进阶:
《JavaScript高级程序设计》——JS圣经,比较全面,非常好的一本书,比犀牛书可阅读性强
《JavaScript权威指南》——传说中的犀牛书,好厚好厚的一本书,不适合入门,适合当工具书看
《JavaScript语言精粹》——很薄的一本书,但是可以帮助你快速了解JS的精华部分
(3)实战:
jQuery框架: w3school上的jQuery教程/Codeademy上的jQuery教程——了解Jquery
《jQuery基础教程》——流行的前端框架,注重实用
(4)提高:
《高性能JavaScript》——讲如何提高js性能,以及构建和部署文件到生产环境的最佳实践
《Secrets of the JavaScript Ninja》——jQuery作者写的书,如果你觉得精通JS了再看这本书
Ⅲ 项目开发中,前端负责哪个模块
前端开发工程师的主要工作在网站设计迹阶段以及网站测试改进阶段,主要进行代码的开发、整合以及上线、调试、修改等工作。
Tips:整个网站开发流程中,有客户、产品经理、技术经理、前端、后台、设计、测试、推广运维等各类职位。每个职位、团队中的每一个人,都是网站得以实现的必不可少的组成部分,也是这些人的工作内容,共同组成了整个开发流程。
Ⅳ 如何学习前端模块化知识
首先我想告诉你的是,我做前端已经6年多了,回过头看下,我做过div+css切图(ps做前端最基本),swf,seo,套模板(后台程序),js(jquery,yui等)。做前端确实做得很杂,事又多,说不好听的工资也比后台程序或者前端设计(也叫前端美工)来得低。但是有句话说你学的东西多了,对你都是有好的,像学得那么多,你要是都懂得一二,时间久了,你就是全能的,往往可以向做经理发展,像程序员,几年过后还是只懂后台而已。
最后,我想说的是做前端视野一定要开阔,要看前沿技术发展,比如好的脚本特效,创意等都能给用户体验加分。所以要多去学学相关知识和技术,多去看前端网站等,比如w3c,虾米站长,css88, 懒人等,都会对做前端很有帮助。
希望在不久将来,你也能在前端界里做得更好,到时再看下我说的有没有道理。
Ⅳ 如何开发前端模块
webpack按需加载
Ⅵ 常见的前端模块化开发模式有哪些
SeaJS 是一个适用于 Web 浏览器端的模块加载器。 使用 SeaJS,可以更好地组织 JavaScript 代码。
Ⅶ 如何理解前端模块化
前端模块化
在JavaScript发展初期就是为了实现简单的页面交互逻辑,寥寥数语即可;如今CPU、浏览器性能得到了极大的提升,很多页面逻辑迁移到了客户端(表单验证等),随着web2.0时代的到来,Ajax技术得到广泛应用,jQuery等前端库层出不穷,前端代码日益膨胀
这时候JavaScript作为嵌入式的脚本语言的定位动摇了,JavaScript却没有为组织代码提供任何明显帮助,甚至没有类的概念,更不用说模块(mole)了,JavaScript极其简单的代码组织规范不足以驾驭如此庞大规模的代码
模块
既然JavaScript不能handle如此大规模的代码,我们可以借鉴一下其它语言是怎么处理大规模程序设计的,在Java中有一个重要带概念——package,逻辑上相关的代码组织到同一个包内,包内是一个相对独立的王国,不用担心命名冲突什么的,那么外部如果使用呢?直接import对应的package即可
import java.util.ArrayList;
遗憾的是JavaScript在设计时定位原因,没有提供类似的功能,开发者需要模拟出类似的功能,来隔离、组织复杂的JavaScript代码,我们称为模块化。
一个模块就是实现特定功能的文件,有了模块,我们就可以更方便地使用别人的代码,想要什么功能,就加载什么模块。模块开发需要遵循一定的规范,各行其是就都乱套了
规范形成的过程是痛苦的,前端的先驱在刀耕火种、茹毛饮血的阶段开始,发展到现在初具规模,简单了解一下这段不凡的历程
函数封装
我们在讲函数的时候提到,函数一个功能就是实现特定逻辑的一组语句打包,而且JavaScript的作用域就是基于函数的,所以把函数作为模块化的第一步是很自然的事情,在一个文件里面编写几个相关函数就是最开始的模块了
function fn1(){
statement
}
function fn2(){
statement
}
这样在需要的以后夹在函数所在文件,调用函数就可以了
这种做法的缺点很明显:污染了全局变量,无法保证不与其他模块发生变量名冲突,而且模块成员之间没什么关系。
对象
为了解决上面问题,对象的写法应运而生,可以把所有的模块成员封装在一个对象中
var myMole = {
var1: 1,
var2: 2,
fn1: function(){
},
fn2: function(){
}
}
这样我们在希望调用模块的时候引用对应文件,然后
myMole.fn2();
这样避免了变量污染,只要保证模块名唯一即可,同时同一模块内的成员也有了关系
看似不错的解决方案,但是也有缺陷,外部可以随意修改内部成员
myModel.var1 = 100;
这样就会产生意外的安全问题
立即执行函数
可以通过立即执行函数,来达到隐藏细节的目的
var myMole = (function(){
var var1 = 1;
var var2 = 2;
function fn1(){
}
function fn2(){
}
return {
fn1: fn1,
fn2: fn2
};
})();
这样在模块外部无法修改我们没有暴露出来的变量、函数
上述做法就是我们模块化的基础,目前,通行的JavaScript模块规范主要有两种:CommonJS和AMD
CommonJS
我们先从CommonJS谈起,因为在网页端没有模块化编程只是页面JavaScript逻辑复杂,但也可以工作下去,在服务器端却一定要有模块,所以虽然JavaScript在web端发展这么多年,第一个流行的模块化规范却由服务器端的JavaScript应用带来,CommonJS规范是由NodeJS发扬光大,这标志着JavaScript模块化编程正式登上舞台。
定义模块
根据CommonJS规范,一个单独的文件就是一个模块。每一个模块都是一个单独的作用域,也就是说,在该模块内部定义的变量,无法被其他模块读取,除非定义为global对象的属性
模块输出:
模块只有一个出口,mole.exports对象,我们需要把模块希望输出的内容放入该对象
加载模块:
加载模块使用require方法,该方法读取一个文件并执行,返回文件内部的mole.exports对象
Ⅷ 如何实现前端模块化开发
SeaJS 是一个适用于 Web 浏览器端的模块加载器。
使用 SeaJS,可以更好地组织 JavaScript 代码。
Ⅸ 在前端中什么是组件化 什么是模块化
模块化更一种开发规范,比如cmd amd 是为了更好的解藕,比如一个网站,按照不同的模块来开发,比如你有个评论区,a 项目有,b 项目有,如果仅是单纯的模块开发,这个js 文件你就可以单独来回引用,
更比如 ,一个页面 分好多个功能, 这时候你要是都写在一个js 中 会越来越大,
而你把他分成不同的模块,
比如评论是一块
分页又是一块,
已经上线,或你不做了,后期别人拉手,或你接手别人的项目, 这时候来个需求让你把分页去掉,或修改 你可以清楚的找到对应模块文件 进行修改 或去掉
模块是自定义的,
组件,更想当于一个通用的东西,有的分功能组件,有的分业务组件
大图切换,这种就是单纯的一个效果展示,只要调用就ok
一个分页,也是只单纯的调用,
组件更是一个多处都可以使用 ,不需要再单独开发的