美文网首页前端开发大前端-万物皆可JS
前端入门第一讲:前端开发基础环境配置

前端入门第一讲:前端开发基础环境配置

作者: 弯弯菇凉 | 来源:发表于2016-11-07 17:30 被阅读264次

    前端第一讲:前端开发基础环境配置

    Web前端和全栈的定义:

    A、什么是传统传统web前端:需要把设计师的设计稿,切完图,写标签和样式,实现JS的效果,简而言之即只需要掌握HTML的页面结构,CSS的页面样式,javaScript页面的行为(包括页面的效果和整合);

    B、HTML5时代的大前端:要处理各种端的兼容开发(PC,移动端,各种浏览器)、移动APP开发和移动站点开发,Ajax+服务器端技术开发,异步开发和后台的交互、高级设计模式和框架(MVC,AngularJS...)、运用自动化工作流(Grunt)、网站安全、SEO、测试、源代码管理、团队合作、制作HTML5游戏等。

    C、全栈时代:集前端和后端一体的大牛,会前端的语言和后台的语言,前后台通吃,能够快速的找到问题和解决问题的能力。

    D、NodeJS:就是用JS为基础的一门后台的语言,让前端无所不能,现在的前端已经是突破所有边界。

    web前端开发环境的搭配:

    A、Sublime3安装配置:

    Sublime跨平台的前端开发神器,是一个共享软件,免费使用;

    下载最新Sublime3安装包;

    -官网地址:http://www.sublimetext.com/

    -网盘地址:http://pan.baidu.com/s/1eSjxmTk  密码:2yka

    -安装包管理器

    打开Sublime3控制台,ctrl+~

    输入安装包管理器命令代码,注意需要联网才能安装,因为是在线下载包

    包管理器的官网地址:https://packagecontrol.io

    -安装第三方插件(包)

    打开命令面板:ctrl+shift+p;

    输入install,然后回车,然后可以搜索想要的插件,回车安装;Atom工具使用

    B、Atom工具使用:由github发布的前端开发工具,集成了chrome的调试工具,是一款非常强大和开发的开发工具平台。在file里面的setting里面进行设置,包括字体的大小,快捷键,背景颜色主题等;

    官网地址:https://atom.io/

    百度网盘下载地址:https://pan.baidu.com/s/1i46H2dB  密码:s5ft

    C、WebStorm10的安装与使用:

    WebStrom是最专业的前端IDE开发工具,是一个非常重量级的开发工具,是专业为我们前端设计的IDE,用他来开发是效率非常高;

    百度网盘下载地址:http://pan.baidu.com/s/1dEATsWh 密码:hjak

    D、总结三款开发工具的优劣:

    Sublime3:需要安装第三方的包,一般。Atom:集成度非常好,也很轻,需要自己安装第三方的包。Webstrom:大项目,建议使用webstrom,非常强大,但是也很重。

    操作系统常用快捷键:

    快捷键是让你成为高级的,专业的前端工程师必经的途径,是大家必须要掌握的。

    Win+数字键:打开/显示超级任务栏第N个图标代表的程序

    Win+D:快速显示桌面

    Win+R:快速运行,打开软件,cmd命令行等

    Win+E:快速打开资源管理器

    Win+方向键:最大化,还原/最小化窗口

    Win+L:快速锁定计算机

    Ctrl+Alt+Del:显示以下选项:锁定计算机,切换用户,注销,更改密码,和启动任务管理器

    CTRL+SHIFT+ESC:打开任务管理器

    Alt+F4:关闭当前活动项目或退出活动程序

    Alt+Tab:在打开的项目中进行切换

    Alt+向上方向键:在Windows Explorer 中查看当前文件夹的上一级目录

    Ctrl+A:在文档或窗口中全选Ctrl+C:复制选中的项目

    Ctrl+向下方向键:将光标移到下一段的段首

    Ctrl+Esc:打开开始菜单

    Ctrl+F4:关闭活动文档(在程序中能够让你同时打开多个文档)

    Ctrl+上方向键:将光标移动到之前一段的开头

    Ctrl+V:粘贴选定项目

    Ctrl+X:剪切选定项目

    Ctrl+Y:还原一个操作

    Ctrl+Z:撤销一个操作

    DELETE:删除选定项目并移动到回收站

    ESC:取消当前任务

    F2:重命名选定的项目

    F4:在Windows Explorer 中显示地址栏列表

    F5:刷新活动窗口

    相关文章

      网友评论

        本文标题:前端入门第一讲:前端开发基础环境配置

        本文链接:https://www.haomeiwen.com/subject/vjuouttx.html