前端第一講:前端開發(fā)基礎(chǔ)環(huán)境配置
Web前端和全棧的定義:
A妄帘、什么是傳統(tǒng)傳統(tǒng)web前端:需要把設(shè)計師的設(shè)計稿,切完圖池凄,寫標簽和樣式抡驼,實現(xiàn)JS的效果,簡而言之即只需要掌握HTML的頁面結(jié)構(gòu)肿仑,CSS的頁面樣式致盟,javaScript頁面的行為(包括頁面的效果和整合);
B尤慰、HTML5時代的大前端:要處理各種端的兼容開發(fā)(PC,移動端,各種瀏覽器)馏锡、移動APP開發(fā)和移動站點開發(fā),Ajax+服務(wù)器端技術(shù)開發(fā),異步開發(fā)和后臺的交互割择、高級設(shè)計模式和框架(MVC,AngularJS...)眷篇、運用自動化工作流(Grunt)、網(wǎng)站安全荔泳、SEO蕉饼、測試、源代碼管理玛歌、團隊合作昧港、制作HTML5游戲等。
C支子、全棧時代:集前端和后端一體的大牛创肥,會前端的語言和后臺的語言,前后臺通吃,能夠快速的找到問題和解決問題的能力。
D值朋、NodeJS:就是用JS為基礎(chǔ)的一門后臺的語言,讓前端無所不能叹侄,現(xiàn)在的前端已經(jīng)是突破所有邊界。
web前端開發(fā)環(huán)境的搭配:
A昨登、Sublime3安裝配置:
Sublime跨平臺的前端開發(fā)神器,是一個共享軟件,免費使用趾代;
下載最新Sublime3安裝包;
-官網(wǎng)地址:http://www.sublimetext.com/
-網(wǎng)盤地址:http://pan.baidu.com/s/1eSjxmTk? 密碼:2yka
-安裝包管理器
打開Sublime3控制臺,ctrl+~
輸入安裝包管理器命令代碼丰辣,注意需要聯(lián)網(wǎng)才能安裝,因為是在線下載包
包管理器的官網(wǎng)地址:https://packagecontrol.io
-安裝第三方插件(包)
打開命令面板:ctrl+shift+p撒强;
輸入install,然后回車,然后可以搜索想要的插件,回車安裝笙什;Atom工具使用
B飘哨、Atom工具使用:由github發(fā)布的前端開發(fā)工具,集成了chrome的調(diào)試工具琐凭,是一款非常強大和開發(fā)的開發(fā)工具平臺芽隆。在file里面的setting里面進行設(shè)置,包括字體的大小,快捷鍵,背景顏色主題等;
官網(wǎng)地址:https://atom.io/
百度網(wǎng)盤下載地址:https://pan.baidu.com/s/1i46H2dB? 密碼:s5ft
C、WebStorm10的安裝與使用:
WebStrom是最專業(yè)的前端IDE開發(fā)工具胚吁,是一個非常重量級的開發(fā)工具,是專業(yè)為我們前端設(shè)計的IDE,用他來開發(fā)是效率非常高臼闻;
百度網(wǎng)盤下載地址:http://pan.baidu.com/s/1dEATsWh 密碼:hjak
D、總結(jié)三款開發(fā)工具的優(yōu)劣:
Sublime3:需要安裝第三方的包囤采,一般述呐。Atom:集成度非常好,也很輕蕉毯,需要自己安裝第三方的包乓搬。Webstrom:大項目,建議使用webstrom代虾,非常強大进肯,但是也很重。
操作系統(tǒng)常用快捷鍵:
快捷鍵是讓你成為高級的,專業(yè)的前端工程師必經(jīng)的途徑,是大家必須要掌握的棉磨。
Win+數(shù)字鍵:打開/顯示超級任務(wù)欄第N個圖標代表的程序
Win+D:快速顯示桌面
Win+R:快速運行,打開軟件,cmd命令行等
Win+E:快速打開資源管理器
Win+方向鍵:最大化,還原/最小化窗口
Win+L:快速鎖定計算機
Ctrl+Alt+Del:顯示以下選項:鎖定計算機,切換用戶,注銷,更改密碼,和啟動任務(wù)管理器
CTRL+SHIFT+ESC:打開任務(wù)管理器
Alt+F4:關(guān)閉當前活動項目或退出活動程序
Alt+Tab:在打開的項目中進行切換
Alt+向上方向鍵:在Windows Explorer 中查看當前文件夾的上一級目錄
Ctrl+A:在文檔或窗口中全選Ctrl+C:復(fù)制選中的項目
Ctrl+向下方向鍵:將光標移到下一段的段首
Ctrl+Esc:打開開始菜單
Ctrl+F4:關(guān)閉活動文檔(在程序中能夠讓你同時打開多個文檔)
Ctrl+上方向鍵:將光標移動到之前一段的開頭
Ctrl+V:粘貼選定項目
Ctrl+X:剪切選定項目
Ctrl+Y:還原一個操作
Ctrl+Z:撤銷一個操作
DELETE:刪除選定項目并移動到回收站
ESC:取消當前任務(wù)
F2:重命名選定的項目
F4:在Windows Explorer 中顯示地址欄列表
F5:刷新活動窗口