跟同學聊天說自己算是全端工程師
什麼是全端工程師呢?

寫了後端邏輯與安全驗證，資料庫輸入輸出
再寫前端畫面CSS，HTML，JS

以為這樣就是全端了嗎?
不只

有時候需要去伺服器
(開機畫面還有遇過window sever2008...十年前的東西呀)

部屬資料庫例如oracle、(mysql、mariaDB)(這兩個算同一個東西)
以及一些服務器例如:webLogic、tomcat
有時候還要會寫.bat檔
不然要部屬十台機器真的需要加班，會吐(|||ﾟдﾟ)

所以小農入職幾年學了這些?
以2019鐵人賽第一天來說1Y2M

為了不要加班，只能拼命學
所以身為一個工程師該有的涵養是很重要的

講這麼多不是要炫耀
而是提醒各位投履歷面試時要看好是不是自己喜歡的
不然一個不小心就變瑞士刀了( º﹃º )

今天在正文中也來點小聊吧

一個全端該怎麼做到極致的偷懶 _ (:3 ⌒ﾞ) _

不知道在坐(?)的看官們是否也也有全端工程師
現在的前後端大多都是走ajax傳送json來運行

小農我有次假日有個閒情逸致
於是乎寫出了偷懶大招
API所拋出的json是產品
所以不能亂搞也不能動手腳
有時候因為是接案子的關係
API根本就看不到，只有文件

好的那需要做些甚麼呢?
設計完後台，也可以拋值時
我們的美術也差不多把畫面都做好了
(是的，工程師也是需要美術支援UI/UX不然都自己來真的會死人)

然後我在前端設計了一組js包
他可以接收後端丟過來的json然後裡面我有寫一些字串來串接SCSS的語法
最後在用ajax送到自己寫的java後臺裡

那個後臺我寫了程式碼
接到我前端送回的東西
自動生成.scss

然後最後我需要做的就是優雅地打開vscode然後用插件編譯
我的css就跑出來了

最近有想過用python寫出類似的東西
因為python對於檔案讀寫存取代碼真的超少超方便
但一樣的事要做兩遍，覺得超懶，緣分到了代碼應該就出來了

簡單提一下概念，至於程式碼嘛....就原諒我無法給了

畢竟我同事都不知道我的SCSS是這樣幹出來的
所以我才能早早下班去上課｡:.ﾟヽ(*´∀`)ﾉﾟ.:｡

好的,總不能一整篇都在閒聊然後沒代碼，今天直接來點乾貨吧

因為是自己用的，所以分享出來也沒關係

@mixin postion($top:'50%', $left:'50%') {
    position: absolute;
    top: $top;
    left: $left;
    transform: translate(-50%, -50%);
}

• 功用:任意對齊(預設為畫面置中)
  • 說明:上面看到的是SCSS的預設值寫法，如同之前說過得起手式，由於position: absolute;所以可以任意對齊上一個容器的內部為置，如果直接引用+postion的話就直接是畫面置中了
  • ps:+是SCSS的語法糖等同於@include

@mixin size($w:'100%',$h:'100%'){
  width: $w
  height: $h
}

• 功用:直接宣告該樣式為滿版
  • 說明:江湖走跳整天在寫裡面那兩個分別是多少真的超麻煩，所以我寫了這東西引用如果要滿版直接+size，如果需要做更改+size(80%,20%)
  • ps:可惜SCSS無法像js一樣少給參數不會怎樣，所以如果需要變更預設高度還是要100%還是必須自己打，不然編譯會錯誤

@mixin bgcLG($direction, $c1, $c2) {
    background: linear-gradient($direction, $c1 0, $c2 100%);
}

• 功用:....應該看得懂CSS的人都知道這是漸層
  • 說明:純粹是因為現在網頁真的太少是單一色塊的東西了，但是css漸層的語法卻又露露長，所以就乾脆寫成一個方法，把他丟進去就可以用了
  • ps:當然也可以把這個最基礎的語法拷去加一些各種漸層，各種方向，以及各種filter,看官們請隨意取用

@mixin toucharea {
    padding: 0px;
    margin: 0px;
}

• 功用:就只是個很單純的複合屬性
  • 說明:不要小看這短短兩句，如果專案是使用bootstrap等框架的話，這個屬性就非常好用(可以省去你切去html裡面打上一堆p-0，m-0)直接把css通通敲完
  • ps:其實這個在自己的手刻專案也非常好用，畢竟CSS跟HTML就莫名其妙預設一堆這種屬性

好的，覺得今天文長打得算蠻負責的
觀念帶到了，乾貨也給了
接下來又要開始苦惱明天開始要拿什麼來混天數了(´-ω-｀)