Front-end

前言

這篇的原文(你走你的陽關道,我走我的獨木橋:前後端分離)是我之前在 iT 邦幫忙鐵人賽的其中一篇文章,寫完之後有陸陸續續收到一些回饋,就想說可以重新整理一下這篇文章,讓它變得再更清楚一點。

如果你有以下疑惑的話,這篇文章非常適合你:

  1. 為什麼前端會有 MVC?
  2. 前端 MVC 跟後端 MVC 有什麼不一樣?
  3. 為什麼要有 SPA(Single Page Application)?

閱讀更多

前言

(補充:感謝 othree 前輩的指點,指出這其實是在講 DOM 裡面事件傳遞的順序,因此把標題以及內文修正,原標題為:JavaScript 的事件傳遞機制:捕獲與冒泡)

今天為大家帶來的內容是 DOM 裡面的事件傳遞機制,而與這些事件相關的程式碼,相信大家應該不太陌生,就是addEventListener, preventDefaultstopPropagation

簡單來說,就是事件在 DOM 裡面傳遞的順序,以及你可以對這些事件做什麼。

為什麼會有「傳遞順序」這一詞呢?假設你有一個ul元素,底下有很多li,代表不同的 item。當你點擊任何一個li的時候,其實你也點擊了ul,因為ul把所有的li都包住了。

假如我在兩個元素上面都加了eventListener,哪一個會先執行?這時候呢,知道事件的執行順序就很重要。

另外,由於某些瀏覽器(沒錯,我就是在說 IE)的機制比較不太一樣,因此那些東西我完全不會提到,有興趣的可以研究文末附的參考資料。

閱讀更多

前言

一般來說在學習寫網頁的時候,最先碰到的會是 HTML 與 CSS,負責把版面刻出來以及美化版面,當基礎打穩之後,會開始學習 JavaScript,試著做出一點互動性的效果。而「互動」除了使用者跟瀏覽器的互動以外,別忘了還有 Client 端跟 Server 端的互動,也就是必須要學會從瀏覽器用 JavaScript 跟後端 Server 拿資料,否則你的網頁資料都只能是寫死的。

這篇的主要預設讀者是網頁前端的初學者,希望能讓本來不太理解怎麼跟 Server 交換資料或是怎麼串 APi 的讀者看完之後,能夠更了解該怎麼跟後端串接。

閱讀更多

前言

最近剛好碰到一些 CSRF 的案例,趁著這次機會好好研究了一下。深入研究之後才發現這個攻擊其實滿可怕的,因為很容易忽略它。但幸好現在有些 Framework 都有內建防禦 CSRF 的功能,可以很簡單的開啟。

但儘管如此,我認為還是有必要瞭解一下 CSRF 到底在幹嘛,是透過怎樣的手段攻擊,以及該如何防禦。就讓我們先來簡單的介紹一下它吧!

CSRF 是一種 Web 上的攻擊手法,全稱是 Cross Site Request Forgery,跨站請求偽造。不要跟 XSS 搞混了,他們兩種是不同的東西,那到底什麼是 CSRF 呢?先從我自身的一個案例談起好了。

閱讀更多

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×