2016年7月11日星期一

[程式開發] Laravel Redirecting With Flashed Session Data 但 session data 無法顯示

正常來說你想要 Redirecting With Flashed Session Data 但是卻無法顯示

問題所在: routes.php 的 middleware : web

https://laravel.com/docs/5.2/middleware#middleware-groups

這裡有解釋說web已經預設當做是middleware了但是你在routes.php 又做了一次

此時可以輸入

$ php artisan routes

此時會發現所有Middleware都有兩個web 這就是問題，此時只要將Middleware的web移除掉即可，Session data就會正常運作了！！！

2016年7月9日星期六

[程式開發] Laravel 寄信服務使用 Gmail 設定

想要在Laravel中使用寄信服務也就是網站能寄信給使用者，這邊可以使用gmail 帳號當做官方Email

1. 首先Gmail 帳號必需要開起雙重驗正 https://www.google.com/landing/2step/

2. 之後到我的帳戶去新增應用程式的密碼也就是幫網站產生一組密碼

https://myaccount.google.com/u/3/security

https://security.google.com/settings/u/3/security/apppasswords
這邊應用程式的密碼等一下設定的時候會用到

產生好後的畫面

如果跳過以上app password 直接將email 的密碼填入.env 會出現
Expected response code 250 but got code "535", with message "535-5.7.8 Username and Password not accepted. Learn more at 535 5.7.8 http://support.google.com/mail/bin/answer.py?answer=14257 wd7sm12843789wjc.36 - gsmtp "

3.到Laravel 專案的 .env 設定郵件服務這邊分兩種看你的網站有沒有ssl

如果沒有就用以下設定填好 email 還有 app password

MAIL_DRIVER=smtp
MAIL_HOST=smtp.gmail.com
MAIL_PORT=587
MAIL_USERNAME=<<your email address>>
MAIL_PASSWORD=<<app password>>
MAIL_ENCRYPTION=tls

有用ssl就用以下設定

MAIL_DRIVER=smtp
MAIL_HOST=smtp.gmail.com
MAIL_PORT=465
MAIL_USERNAME=<<your email address>>
MAIL_PASSWORD=<<app password>>
MAIL_ENCRYPTION=ssl

如果上述沒有設定好可能會出現

Expected response code 220 but got code “”, with message “” 問題

4. 設定好後測試寄信服務並在routes.php中新增以下程式碼並修改from to 的email

Route::get('sendemail', function () {

    $data = array(
        'name' => "Learning Laravel",
    );

    Mail::send('emails.welcome', $data, function ($message) {

        $message->from('yourEmail@domain.com', 'Learning Laravel');

        $message->to('yourEmail@domain.com')->subject('Learning Laravel test email');

    });

    return "Your email has been sent successfully";

});

5.並且新增以下 blade 定義郵件的內容 (Mail::send的第一個參數 /emails/welcome.blade.php )

<!DOCTYPE html>
<html lang="en-US">
<head>
    <meta charset="utf-8">
</head>
<body>
<h2>Learning Laravel!</h2>

<div>
    Welcome to {!! $name !!} website!
</div>

</body>
</html>

6.最後輸入網址http://yourdomainname/sendemail 出現Your email has been sent successfully 表示成功囉此時去收信一下就會看到了！

7. 如果沒有填 from 的那欄系統會用config/mail.php 中的null 會出現錯誤

Cannot send message without a sender address

此時將mail.php中的from修改成

'from' => ['address' => env('MAIL_FROM', null), 'name' => env('MAIL_NAME', null)],

並到.env設定MAIL_FROM,MAIL_NAME兩個變數即可

參考資料：http://learninglaravel.net/learn-to-send-emails-using-gmail-and-sendgrid-in-laravel-5

2016年7月5日星期二

[ 編譜 | 演奏Anima's Piano Cover ] 周杰倫Jay Chou X aMEI【不該 Shouldn't Be】鋼琴譜pdf

琴譜預覽：

有想要的其他曲子? 求譜系統連結：http://goo.gl/1fDDvn

追蹤Facebook，取得最新琴譜：

Anima's piano

Youtube訂閱網址：https://goo.gl/VNHBqt

原key PDF連結

轉貼請標明出處哦 > <

[ 編譜 | 演奏Anima's Piano Cover ] 林俊傑 JJ Lin – 不為誰而作的歌 Twilight 鋼琴譜pdf

琴譜預覽：

有想要的其他曲子? 求譜系統連結：http://goo.gl/1fDDvn

追蹤Facebook，取得最新琴譜：

Anima's piano

Youtube訂閱網址：https://goo.gl/VNHBqt

原key PDF連結

轉貼請標明出處哦 > <

[ 編譜 | 演奏Anima's Piano Cover ] Eric周興哲《你，好不好？ How Have You Been?》《遺憾拼圖》片尾曲鋼琴譜pdf

鋼琴演奏：

琴譜預覽：

有想要的其他曲子? 求譜系統連結：http://goo.gl/1fDDvn

追蹤Facebook，取得最新琴譜：

Anima's piano

Youtube訂閱網址：https://goo.gl/VNHBqt

原key PDF連結

轉貼請標明出處哦 > <

[程式開發] Javascript let 與 var 差別筆記

先來看看MDN對兩者的定義

var

Declares a variable, optionally initializing it to a value.

let

Declares a block scope local variable, optionally initializing it to a value.

差別在於 let 特別用在block scope

以下範例清楚解釋 block scope 概念 : var可以作用在該scope以內的所有scope ，但是let 只作用在該block scope

var a = 1;
var b = 2;

if (a === 1) {
  var a = 11; // the scope is global
  let b = 22; // the scope is inside the if-block

  console.log(a);  // 11
  console.log(b);  // 22
} 

console.log(a); // 11
console.log(b); // 2

另一個範例，可以看出var作用域變數內都會是同一個，而 let 只作用該scope 所以裡面的不一樣

function varTest() {
  var x = 1;
  if (true) {
    var x = 2;  // same variable!
    console.log(x);  // 2
  }
  console.log(x);  // 2
}

function letTest() {
  let x = 1;
  if (true) {
    let x = 2;  // different variable
    console.log(x);  // 2
  }
  console.log(x);  // 1
}

!!!有些 let 需要注意的事情

(1) 同一個Scope不能重複 let 宣告相同變數

if (x) {
  let foo;
  let foo; // SyntaxError thrown.
}

下面也是相同狀況

switch (x) {
  case 0:
    let foo;
    break;
    
  case 1:
    let foo; // SyntaxError for redeclaration.
    break;
}

(2) 在最外層(Top level , Global) 不能用 let 宣告

var x = 'global';
let y = 'global';
console.log(this.x); // "global"
console.log(this.y); // undefined

用let的好處

(1) 每一個 instance 是分開不一樣的不像 var 只會呈現最後數值

var list = document.getElementById("list");

for (let i = 1; i <= 5; i++) {
  let item = document.createElement("li");
  item.appendChild(document.createTextNode("Item " + i));

  item.onclick = function (ev) {
    console.log("Item " + i + " is clicked.");
  };
  list.appendChild(item);
}

如果用var是不行的，結果會是 var 都是 6

參考: MDN

另外補充

(1) Var 如果再最外層(Top level) 其實就是全域變數

(2) 如果沒有任何宣告就使用變數，他則會被當成全域變數而且可以delete

x = 42;
var y = 43;
myobj = new Number();
myobj.h = 4;    // create property h
delete x;       // returns true (can delete if declared implicitly)
delete y;       // returns false (cannot delete if declared with var)
delete Math.PI; // returns false (cannot delete predefined properties)
delete myobj.h; // returns true (can delete user-defined properties)
delete myobj;   // returns true (can delete if declared implicitly)

(3) hoisting: 在js 裡面所有var宣告的都會被提升到最前面先宣告初始化

比如說，原本你這樣打

/**
 * Example 1
 */
console.log(x === undefined); // true
var x = 3;

/**
 * Example 2
 */
// will return a value of undefined
var myvar = "my value";
 
(function() {
  console.log(myvar); // undefined
  var myvar = "local value";
})();

則他在執行時會這樣做:

/**
 * Example 1
 */
var x;
console.log(x === undefined); // true
x = 3;
 
/**
 * Example 2
 */
var myvar = "my value";
 
(function() {
  var myvar;
  console.log(myvar); // undefined
  myvar = "local value";
})();

而 let 則是沒有這個特性所以他會直接是錯的

console.log(x); // ReferenceError
let x = 3;

另外function 宣告也有這個特性 (function 附值則沒有)

/* Function declaration */

foo(); // "bar"

function foo() {
  console.log("bar");
}


/* Function expression */

baz(); // ReferenceError: baz is not a function(it's undefined!!!)

var baz = function() {
  console.log("bar2");
};

function 若是沒有return值 typeof 會是undefined 若有 typeof 則看return 是什麼型態。

2016年7月2日星期六

[程式開發] Javascript undefined 和 null 的差別使用方法

1. undefined
當你宣告一個變數但不給他任何值 or 不初始化牠(new) 那牠就會是undefined

var TestVar;
 alert(TestVar); //shows undefined
 alert(typeof TestVar); //shows undefined

此時要如何判斷是不是undefined 就要寫

if (typeof a === "undefined")
// or
if (a === undefined)
// or
if (a == undefined) // but see note below

註1：JS中 typeof 會有六種值 "number"、"string"、"boolean"、"object"、"function"、"undefined"
註2：第三種判斷方式當 a 是 null 也也會是true ，因為

null == undefined // true

2. null
null 是一種型態(type) 牠可以賦值給一個變數表示"沒有值"

var TestVar = null;
 alert(TestVar); //shows null
 alert(typeof TestVar); //shows object

如何判斷是不是null呢 ?

if (a === null)
// or
if (a == null) // but see note below

第二種判斷方式當 a 是 undefined也也會是true ，因為

null == undefined // true

3. === and !== strict comparison operators
(1) number : 當數字大小一樣就會成立，其中 NaN 不等於任何東西(包括他自己所以JS有一個 isNaN(x) 函數用來判斷x是否NotANumber 而不能用==或是===) ，另外+0 === -0
(2) Boolean: 只有兩種情況成立 true===true, false===false (Ex. (1+2)>0===(2+1)>0)
(3) String : 當同樣字符,長度,位置時才會成立
(4) objects : 當同樣指到同一個物件才會成立
(5) Null and Undefined types are == ， (Null===Undefined) is false

另外與 loose(Abstract) comparison不同的是 Strict 不會做形態轉換，所以Strict會做形態比較
比如說 "1" == 1 is true , "1" === 1 is false
也就是==會做形態轉換(type coercion)強迫牠們兩個一樣而 Strict會直接比較形態不一樣type則false

4.一般都用 if(!somthing)
可以濾掉空字串(""),null,undefined, false,0,NaN

if (!a) {
    // `a` is falsey, which includes `undefined` and `null`
    // (and `""`, and `0`, and `NaN`, and [of course] `false`)
}

因為DOM操作時(getElementById(), nextSibling(), childNodes[n], parentNode())，如果找不到Node就會回傳null (也就是說有定義,但用null表示沒有此Node)所以不需要特別做null與undefuned之間的差別判斷

Anima's Life

Pages - Menu

2016年7月11日星期一

[程式開發] Laravel Redirecting With Flashed Session Data 但 session data 無法顯示

2016年7月9日星期六

[程式開發] Laravel 寄信服務使用 Gmail 設定

Expected response code 220 but got code “”, with message “” 問題

Cannot send message without a sender address

2016年7月5日星期二

[ 編譜 | 演奏Anima's Piano Cover ] 周杰倫Jay Chou X aMEI【不該 Shouldn't Be】鋼琴譜pdf

[ 編譜 | 演奏Anima's Piano Cover ] 林俊傑 JJ Lin – 不為誰而作的歌 Twilight 鋼琴譜pdf

[ 編譜 | 演奏Anima's Piano Cover ] Eric周興哲《你，好不好？ How Have You Been?》《遺憾拼圖》片尾曲鋼琴譜pdf

[程式開發] Javascript let 與 var 差別筆記

2016年7月2日星期六

[程式開發] Javascript undefined 和 null 的差別使用方法

Pages - Menu

2016年7月11日 星期一

2016年7月9日 星期六

Expected response code 220 but got code “”, with message “” 問題

2016年7月5日 星期二

2016年7月2日 星期六

2016年7月11日星期一

2016年7月9日星期六

2016年7月5日星期二

2016年7月2日星期六