用 CSS 畫畫的小技巧

前言我想每個人小時候應該都蠻喜歡畫畫的吧?在沒有遊戲機、沒有 iPhone 的年代,拿著畫筆跟一張紙就可以開心度過幾個小時,但不知道從什麼時候開始就忘掉了這份快樂。 今天想邀請大家把『快樂』找回來! 身為工程師,我們拿起畫筆可能畫不出一個漂亮的圓,但透過熟悉的 CSS 我們可以做到。 『等等,平常上班調 CSS 就已經夠耗神了,你還要拿來畫圖?這除了炫技以外,對專業能力有什麼實質幫助嗎?你看連知乎上也有人這樣想。』 那你滑 ig 對專業

Read More...

別猶豫了,來修 CS50 吧!

前言其實我之前就已經寫過一篇文章(如海洋般的程式課程:CS50 )大力稱讚過 CS50,但那篇比較凌亂一點,比較像是自己的筆記。 今年再修了一次之後,依然覺得這門課很棒,決定再次跟大家分享。 CS50 是什麼?CS50 的課程名稱叫做 Introduction to Computer Science,是一堂哈佛大學的通識課程,總之就是一門在介紹 Computer Science 的課。 而這門課程的所有資料都有公開在網路上,也有在 ed

Read More...

Open AI Gym 簡介與 Q learning 演算法實作

前言這次我們來跟大家介紹一下 OpenAI Gym,並用裡面的一個環境來實作一個 Q learning 演算法,體會一次 reinforcement learning (以下簡稱 RL) 的概念。 OpenAI Gym 是一個提供許多測試環境的工具,讓大家有一個共同的環境可以測試自己的 RL 演算法,而不用花時間去搭建自己的測試環境。 把 Gym 跑起來的最簡單範例一開始學習,範例總是越簡單越好,這樣才會有開始上手的成就感。 12345

Read More...

用 Python 自學資料科學與機器學習入門實戰:Pandas 基礎入門

前言本系列文章將透過 Python 及其資料科學生態系(Numpy、Scipy、Pandas、Scikit-learn、Statsmodels、Matplotlib、Scrapy、Keras、TensorFlow 等)來系統性介紹資料科學和相關的知識,透過 Python 帶領讀者進入資料科學的世界和機器學習的世界。在這個單元中我們將介紹 Pandas 這個基於 Numpy 的資料處理和分析神兵利器。 事實上,真實世界並非如此美好,大部

Read More...

D3v4 工作坊 - 製作 D3 plugin 來繪製草圖風格長條圖

前言前陣子 Mozilla 如火如荼地推出他們的量子專案,而其中在介紹 Quantum CSS 架構的時候,用了許多 可愛的草圖 來解說,讓我突然想到如果能夠將這種手繪風格套用到資料圖表上面,應該會蠻有趣的,也才因此有了這篇文章。 一般來說,我們不管是用 D3.js 或是 Highcharts 等工具來製作圖表,都是朝向專業、有質感、表達清晰的方向去實作,利用各種顏色搭配與互動操作來讓圖表更漂亮更吸引人。 (來源:highchart o

Read More...

Shingling, MinHashing and Common distance measure I

誰適合閱讀這篇文章:熟悉 Hash, Set, Tries (Prefix and Suffix Tree) 等資料結構和有志從事大量資料分析的電腦工程師 主要解決問題:給定一份文件,如何在網際網路的無盡文件大海中,找到相似的文件?主要應用:偵測剽竊 (Plagiarism),搜尋引擎欲尋找鏡像網頁,網路購物或電影推薦系統中的協同過濾 綱要: 如何快速比較兩文件集合並提供量化結果: a. 如何定義相似度? b. 如何重新定義相似度

Read More...

統一網頁支付介面:Payment Request API

前言之前在 Hacker News 上面看到了這一篇文章:Payment Request API — Now Being Implemented in All Major Browsers,大意就是 Payment Request API 這一個東西將會在主流瀏覽器上面被實作出來。 在這之前,我完全沒有聽過這個東西,完全不知道它在做什麼。但經過我稍微研究之後,發現這個原來是網頁支付介面的未來。 Payment Request API 簡

Read More...

用 Python 自學程式設計:程式設計思維入門

什麼是程式設計思維?最近幾年全球刮起了一股爭相學習電腦科學(Computer Science)和程式設計(Programming)的風氣,上至總統、首相下至升斗小民都爭相開始學寫程式。事實上,學寫程式最重要的是學習電腦科學背後思考方式和邏輯,學習如何透過科技解決生活上的問題。更進一步說,程式設計與其說是一種科學,更偏向一種藝術人文的創作與科學的混合體。以前畫家或是作家是拿紙筆創作,現在只要有一部電腦,連上網路,就可以透過敲打鍵盤將自

Read More...

C++ Header Guard 簡介

前言C++ 的 header guard (中文譯作表頭哨兵,聽起來超帥) 是在開源/大型專案中常常用到的功能,所以如果想要踏入開源專案的世界,看到 header guard 就覺得親切熟悉,絕對可以幫助你更把心思放在體會到這些開源程式碼的美! 而且這個例子正巧是有朋友去面試美國某間新創公司時,實際被問到的問題,所以才興起想要動筆寫下這篇文章的念頭。畢竟很多小地方有沒有真正弄通是技術實力紮不紮實的重要指標! 我剛剛隨便選了一個 C++

Read More...

使用 JavaScript 處理二進位資料

由於高度封裝與抽象,JavaScript 的執行效率比不上 C 的語言。例如 JavaScript 的 Array 下標(subscript)是根據 hash key 而非實體記憶體位址 offset 取值,雖然方便,卻多了效能開銷。當 Canvas、WebGL、WebVR 開始走紅,效能越來越受重視,如何讓 JavaScript 達到如同 C 指標般操作 binary data 變得至關重要。

存在許久但最近才變為 ES6 標準「Typed Array」就是解放 JavaScript 操作 binary data 能力的好工具!一起來了解 Typed Array 吧!

(基於 ECMAScript 6+,Node.js 8.3)

Read More...