尼桑的技術網站

2018年6月16日星期六

【每天學技術】6/17 天氣地圖

台灣天氣地圖

研究語法意思
更改一些自己喜歡的內容
串接API

【Vue】基本語法 v-text/v-html/v-model（各種資料）/ v-bind

Vue的基礎使用

<div id="app"> </div> //設定綁定範圍

Vue是一種MVVM的架構
vue一次只能綁定一個資料
vue不能做巢狀綁定

開啟Vue

new Vue=({

  el:"#app", //綁定資料，形成root

  data:{__}, //放入資料

  computed:{} //資料計算

  method:{} //方法

})

Vue的資料顯示

下面這些在Vue中統稱指令


 <div id="app">
          <div>{{message}}<div>  //可下面的寫法是ㄧ樣的
          <div v-text="message"></div> //可以寫入標籤
          <div v-html="message"></div> //可以寫入Html
          <input type="text" v-model="message"> //雙向綁定
          <img v-bind:src="imgSrc" v-bind:css="className" alt="">
</div>

 var app = new Vue({
            el: '#app',
            data: {
              message: '<h1>哈囉<h1/>',
              imgSrc:'照片連結',
              className:'image-fluid'
            }
          })

V-model與各種表單資料

code太多不想貼，反正V-model可以跟textarea、checkbox、radio、option串再一起

<textarea v-model="textarea"></textarea>
<input type="checkbox">
<input type="radio">
<select v-model="selected">
            <option value="" disabled>-請選擇-</option>
            <option value="你好">你好</option>
            <option value="正妹">正妹</option>
</select>

【SVG】SVG的基本操作

SVG的基本結構

SVG>path

path

每個Path是一個物件

stroke（外框）
fill填色 none:transparent(透明)
transform位移: translate(-10px, -10px)

【JQUARY】基本指令

基礎指令

$(“選擇器”).事件(a,b)

$("#title").html()   //不是innerHTML、innerText之類的，那是原始的JS

常見寫法

click事件

$("#title").click(function () {     //比較不直覺，而且不是所有事件都可以直接當function用
            console.log("hello")
        })


$("#title").on("click", function () {  //用on比較直覺，而且擴延性比較好
            console.log("hello")
        })

CSS和animate寫法

  $("#title").css("color", "red").css("margin-top", "120px")  //可以寫成鍊式
  $("#title").stop().animate({
            opacity: 0
        }, 1000)

【實用】Visual Studio Code超級好用的快捷鍵

Visual Studio Code的快捷鍵

▌實用快速鍵

cmd + shift + P：在 Finder 視窗中顯示或隱藏預覽面板
cmd+ n：開新的檔案
cmd+ k , m：選擇檔案類型
cmd+ b ：側邊欄開關
cmd+ d：選取同樣的內容
cmd+ l：選取同一行
cmd+左右：跳行首行尾
control + option + [ or ] ：折疊程式碼

快捷鍵設定：cmd + shift + P 搜尋keyboard

▌實用功能

標籤換行：view - toggle word wrap（避免橫向捲軸）
包裹功能：(mark) + (cmd+shift+p) + Wrap Individual Lines with abbreviation 輸入li*

▌其他

用terminal code快速打開專案
啟動VS Code，輸入cmd + shift + P並鍵入shell command查找Shell Command: Install ‘code’ command in PATH command

code 專案名稱 //可以快速打開專案

設定僅有Editor放大、縮小

快捷鍵設定：cmd + shift + P 搜尋keyboard

2018年6月15日星期五

【每天學技術】6/16 RWD＋VueJS＋期末考

【目標】

學習是一件很嚴肅的事情，它不是休閒，它需要紀律、時間，系統

作品集1：PS工作坊

看能不能把RWD課程上完，然後重構首頁的Html

|
|

刻出留言板HTML

|
|
|

利用Express+Firebase的技術寫留言板

作品集2：VueJS精神時光屋（試水溫）

看能不能把RWD課程上完，然後先做一個HTML

|
|

上VueJS課程

|
|

串接資料

規劃期末考學習內容

1.倫理學作業（期末考）

2.中國哲學史（期末考）

3. 烏托邦（期末考）

【五年計畫】我的計劃與願景？（持續更新）

【學習心得】程式學習的誤區與方法（持續更新）

如何規劃學習？

曾經看到張忠謀先生的訪談，他在訪談中表示說，他不認同常人所說的「活到老學到老」。他認為，「泛泛的學習」是沒有用的，終身學習應該要做到「有計劃」、「有紀律」、「有系統」，學習是一件嚴肅的事情，是需要每天抽空出來的。因此即使是在工作時，他還時常大量閱讀關於晶體管的書籍。他說「要時常保持自己在行業的前沿，否則你很快就會失去競爭力」

我很認同他的觀點。

我是個很發散的人。我的書櫃很滿，充滿哲學、心理學、投資、歷史….等各種領域的書籍，大一大二時，我自詡是個很愛學習的人。但是漸漸的，我發現我到頭來並沒有一個真正能對世界有貢獻的「專業」。我仍然可以是一個很愛吸收的人，但前提還是我要一個「能夠維生的技能」

對自己說的話

在遇到夠優秀的人之前，要想辦法讓自己足夠優秀

不要有那種，只是「練習看看」的半吊子心態。如果作品二流，那會看上你的公司可能也是二流（或是好人），因為優秀的人也喜歡優秀的人。

不是有努力，世界就要認可你

不要有那種「我已經很努力，應該可以了吧」的想法。重點在於，你的能力是否合格，除此之外的努力都沒有意義。

以始為終

不要有那種「我先隨便做一下，反正之後工作就會有人教」的依賴性想法。要時時想像「合格的工程師會怎樣做」以及「優秀的工程師會怎樣做」。如果一件事「終究要學會」，那就不要逃避，而是一開始就趕快學好。

而且回到第一點「現在的努力，是為了遇到更優秀的人」

不需要仰賴天份，而是要靠有系統、有紀律、有計劃地持續學習

五年計劃(2018~2023)

讀研究所

雖然目前努力學習前端，但是要更往上，終究還是要掌握計算機的最基本原理。
我應該會回去讀碩士（要麼是台大資工所，不然就去國外讀CS）

去中國工作

這個我已經想很久了，我是個相信「時代」的人。我不認為自己可以改變時代，反而我很相信時代對我的幫助。比起個人的努力，「環境」與機運更能幫助我成長。因此離開台灣，去更有競爭力的地方工作是必然的。

去到夠優秀、夠競爭的環境

缺乏能力還可以補，但是缺乏「見識」就沒有救了。而要獲得「見識」的方式，就是去與一群最優秀的人再一起。他們會讓你知道優秀與普通、合格與不及格的區別。

讓「目標」帶動學習

觀察那些很厲害的大神，我發現他們很多並不是為了厲害而去學。他們很多是發現問題後，為了解決問題才去學那些「用得到」的東西。

不要忘記人生的核心是「生活」

工作、職業都只是人生的一個部分，人都會死，因此我們都只是在自己死前，想辦法找事情打發時間而已。因此，如果我死前，身上的標籤只是個精通JS的工程師，我會覺得很悲哀。時間很有限，而人生還有愛、友情還有生活。因此：

在職業上：要盡量去做那些有意義、對世界能產生貢獻的工作，而不是浪費時間做那些僅僅能賺快錢的事情。

在生活上：要盡情的去愛、去體驗

要謹記「把人當做人」

王陽明朋友指著巖中花樹問曰：「天下無心外之物，如此花樹，在深山中自開自落，於我心亦何相關？」王陽明曰：「你未看此花時，此花與汝心同歸於寂。你來看此花時，則此花顏色一時明白起來。便知此花不在你的心外。」

我看到這段故事的時候，感覺被觸動了。大家都知道王陽明的「心即理」，感覺除了心之外就沒有其他知識了。但王陽明其實並不否認花的客觀存在，他只是認為「如果花不在心中，那個花的客觀存在對本體又有何意義呢？」

過去的我，其實很習慣僅僅把人當作一種知識，而不是「一個人」。但是如同王陽明說的「良知之外，更無知；致知之外，更無學」本心之外的知識確實無窮無盡，但是當這些東西ㄊㄧ本心之外，再多知識又有什麼意義呢？在頭腦上認識再多人，而不是把他們放入內心，那這些人知道又有什麼意義呢？

多讀書

在初期，跟高手學（上課）會比自己研究有效率很多。但是當基本的知識架構建立後，還是需要靠閱讀延展這些自己的邊界。

2018年6月16日 星期六