基本用途

我提到的主要都是覺得原本的語言提供的特性不夠用

所以會做出一套工具 來提供想要的功能

最後再編譯成原始的語言來讓環境可以直接套用

有哪些

javascript

• coffeescript

  寫過ruby python的人應該會蠻喜歡coffeescript的語法的

  https://zh.wikipedia.org/wiki/CoffeeScript

• livescript

  https://en.wikipedia.org/wiki/LiveScript

• typescript

  這個我一定要提這個人

  **安德斯·海爾斯伯格 **（Anders Hejlsberg，1960年12月－），丹麥人，Borland Turbo Pascal編譯器的主要作者。進入微軟公司後，先後主持了Visual J++、.Net， C# 和 TypeScript。

  設計的幾個語言都算是改變了工程師的環境

  非常的厲害

  https://zh.wikipedia.org/wiki/%E5%AE%89%E5%BE%B7%E6%96%AF%C2%B7%E6%B5%B7%E5%B0%94%E6%96%AF%E4%BC%AF%E6%A0%BC

  ​

  https://zh.wikipedia.org/wiki/TypeScript

• dart

  Google推廣的語言

  不過目前用的人感覺還不多XD

個人玩過coffeescript跟livescript

因為之前有學python 加上遇到javascript的callback hell的摧殘

所以當時是覺得這兩個語言都還蠻有打到痛點的

不過自從es6跟babel開始流行

就越來越多人跳回去直接寫es6了

babel也算是前置編譯器

可以把新版的語法轉成瀏覽器可以支援的語法

但是因為沒有改變語法所以我另外提

CSS

CSS的部分就算是大亂鬥了

• SASS,SCSS
• less
• stylus
• postcss

比較特別的是我覺得以上沒有特別的優劣

目前也是都還有人用

基本上還是去研究看看哪個比較符合你自己的需求

像我就比較喜歡SASS

BUNDLER

介紹完前面的工具

就知道目前前端環境檔案非常的繁雜

但是最後還是要產生出js css jpg png html等靜態檔案

所以就出現了打包工具

主要有

• webpack
• browserify

目前主流應該算是webpack 吧

不過設定有點繁雜

另外還有rollup值得介紹一下

還有最近推出號稱免設定的Parcel

如果覺得太困難是可以用套裝的工具

• prepros

• koala

• codekit

  ​

順便緬懷一下http://fireapp.kkbox.com/

Task Runner

因為手動編譯js,css之類的東西太麻煩了

所以就有人做出來一些工具讓人可以把工作整合處理

早期大家用grunt

後來覺得grunt設定檔很難寫

所以又跑出來gulp 因為是直接寫javascript去控制

因此更符合工程師的喜好

還有一派喜歡更傳統的make

總結

基本上目前寫個比較複雜的前端可能都避免不了以上的工具

所以有人說以前前端只要引入jquery

但是現在都要從npm install開始

每次都裝一大包

個人建議新手都從簡單的工具上手啦

不用特別避開用現成的工具

像是我上面提到的prepros等工具

可以先用 等察覺到哪裡不合用了再來替換工具

我當初就是從prepros跳到grunt 再一路自己玩上來的

今日文章分享

• 基于node.js的脚手架工具开发经历 - 掘金

  感覺難得看到這麼詳細的教學

  加減看看XD

• 浏览器里的黑天鹅：不可预知的前端变革点 - 掘金

  算是前端重要的改變點吧

  vue大好

• 关于PostCSS的一点小科普

  介紹的工具都算蠻常用的

  尤其Autoprefixer

• CSS常用Mixin封装

  就備用吧XD

  看看做法

• Introducing Octohint – Frontend Weekly – Medium

  備用工具

• 11 Vue.js Component Libraries You Should Know In 2018

  紀錄而已

• 5.6 新功能播报：增加一个 HTTP 头设置缓存中间件 | Laravel China 社区 - 高品质的 Laravel 开发者社区 - Powered by PHPHub

  很好用啊！！！！

  就不用特別寫到middleware裡面了

今天看的文章

越來越難掰分享以外的內容了XD