前後端分離與 SPA

前言這篇的原文(你走你的陽關道,我走我的獨木橋:前後端分離)是我之前在 iT 邦幫忙鐵人賽的其中一篇文章,寫完之後有陸陸續續收到一些回饋,就想說可以重新整理一下這篇文章,讓它變得再更清楚一點。 如果你有以下疑惑的話,這篇文章非常適合你: 為什麼前端會有 MVC? 前端 MVC 跟後端 MVC 有什麼不一樣? 為什麼要有 SPA(Single Page Application)? (其實關於 MVC 到底是什麼就有很多討論了,但因為這

Read More...

Go Web 程式設計入門教學:基礎介紹與環境建置

前言Go 程式語言 是 Google 推出的靜態程式語言,其特色在於核心語法和關鍵字非常精簡(全部只有 25 個關鍵字!)並擷取了靜態語言的效能和動態語言的開發效率的優點,具備垃圾回收、快速編譯等特性,且針對平行化程式設計在使用上非常方便。接下來的文章我們將透過 Golang Web 程式設計來學習 Go 這個程式語言。程式語言唯有動手作才能學的好,你可以參考本篇文章建置開發環境或是使用線上開發環境進行學習。 Go 環境建置安裝方式:

Read More...

Udacity RoboND - Rover project 簡介

前言最近 Udacity 的 nano degree 算是滿紅的,他們也有把很多教學資源放到 github 上面,例如 Rover project,我覺得拿來上手還不錯,以下就稍微來簡介一下這個 project 有趣的地方。 Project 簡介 這個 project 是要讓 Rover 在世界中自由自在地行走,然後尋找特定的岩石樣本並收集,因為他們將岩石的顏色設計得跟背景很不一樣,所以我們只要可以在環境中走來走去,然後一直尋找畫面中有

Read More...

D3v4 & Canvas 工作坊 - D3 + Canvas 繪製動態路線圖

前言HTML 5 的 Canvas 是許多人做動畫、做遊戲常常會用到的工具,此外,如果是進行資料視覺化,在繪製大量的圖形與動畫時,Canvas 可以為你的 performance 帶來很大的改善,從 D3.js 實戰 - Canvas 把我的視覺化變「快」了! 中最後的範例就可以看得出來差異。 總之,身為前端工程師的我卻沒有實作做過 Canvas 相關應用,在羞愧之餘也得奮發向上扳回劣勢才可以,所以決定把上次用 d3 與 svg 繪製的

Read More...

一起用 JavaScript 來複習經典排序法吧!

前言最近剛好上到 CS50 Week3,這一週的主題是:Algorithms,裡面介紹到了幾種經典的排序法,像是選擇排序、泡沫排序、插入排序以及合併排序。 我覺得身為一個軟體工程師,大概一輩子都脫離不了排序了,畢竟這是經典演算法之一嘛!與其每次要面試之前都凌亂的準備,不如現在就整理出一篇,紀錄一下各個排序法的心得,幫自己做個統整。 因此,這一篇將利用 JavaScript 來實作各個經典排序演算法。 這次實做的排序法都會是由小到大排序,

Read More...

Python Web Flask 實戰開發教學 - SQLAlchemy 與 ORM

前言Web 開發涉及層面很廣,包含了前後端開發、資料庫優化、平行處理、負載平衡、高可用性、資訊安全、雲端伺服器部屬等議題,本系列文章將透過介紹 Python Web Flask 實戰開發來學習現代化網站開發的方方面面。上一篇我們完成了環境建置,這一單元我們將進入 MVC 架構的 Models 部分並學習如何使用 SQLAlchemy 建立和資料庫互動的 ORM 機制。 什麼是 MVC?MVC 模式(Model–view–cont

Read More...

深入學習 lsd-slam - 5

前言上次跟大家簡介了 Eigen 這個可以用來做線性代數運算的 open source library,讓大家有動手實作、開始玩到東西的感覺。今天要延續動手實作的精神,跟大家介紹一下該怎麼把幾張 RGB-D 影像拼接成 point cloud,接下來就讓我們一起玩玩吧! 參考資料來源這次的 data(包含 RGB 影像跟 Depth Map) 等等都是來自於 slambook 的 ch5,有這些資料真的超讚的,不然自己光要產生這些資料就

Read More...

從零開始學資料科學:Numpy 基礎入門

前言本系列文章將透過系統介紹資料科學(Data Science)相關的知識,透過 Python 帶領讀者從零開始進入資料科學的世界。這邊我們將介紹 Numpy 這個強大的 Python 函式庫。 什麼是 Numpy?Numpy 是 Python 的一個重要模組(Python 是一個高階語言也是一種膠水語言,可以透過整合其他低階語言同時擁有效能和高效率的開發),主要用於資料處理上。Numpy 底層以 C 和 Fortran 語言實作,所

Read More...

D3v4 工作坊 - React + D3 繪製 svg 動態路線地圖

前言以前在做一些跟地圖有關的應用時,第一個出現在腦海的不外乎是 Google Map 和 OpenStreetMap,然後搭配 Leaflet 與 Mapbox 等工具來對 map tile 做各種加工渲染,然而到了工作上需要時就會發現這些工具在不付費、遵守授權的狀況下,就出現了各種限制,像是需要自己架設 tile server 來轉換 OpenStreetMap 的圖資,或是 request 的次數限制等等。 想了想發現最好的替代方案

Read More...

DOM 的事件傳遞機制:捕獲與冒泡

前言(補充:感謝 othree 前輩的指點,指出這其實是在講 DOM 裡面事件傳遞的順序,因此把標題以及內文修正,原標題為:JavaScript 的事件傳遞機制:捕獲與冒泡) 今天為大家帶來的內容是 DOM 裡面的事件傳遞機制,而與這些事件相關的程式碼,相信大家應該不太陌生,就是addEventListener, preventDefault跟stopPropagation。 簡單來說,就是事件在 DOM 裡面傳遞的順序,以及你可以對這

Read More...