最新消息

關於五倍還有更多你可以發掘的,都在這邊說給你知!

Feb 22 2020

Photo by Jude Al-Safadi 前言 為了增加資訊安全,很多線上服務如購物網站或銀行使用二階段驗證加強保護使用者個資。目前市面上較知名提供簡訊寄送/驗證的服務有 Twilio(與 Authy 同公司)、Nexmo、Message Bird … 等,提供的服務內容大同小異,各自也都有大型企業採用。 個人較為偏好 Authy 的主因是可以將使用者電話號碼在 Authy 平台註冊獨一的 Authy ID 而無需將電話號碼敏感資料儲存在自站。另外,除了完整的 API 說明...

Feb 15 2020

Image by Johannes Plenio from Pixabay 前言 在這個科技日新月異的時代下,製作網頁的工具也是隨著時間演進下,不斷推陳出新。如果你曾經對於每天透過瀏覽器打開的網頁有一點的好奇心,會不會想要嘗試做一個自己專屬的網站呢?這時候我們就可以享受工具進步所帶來的效益了呢!這不是火箭科學,要進入無所不在的網頁世界,入門僅需要些許的耐心。讓我們以靜態網頁產生器為自己做出第一個網站吧! 靜態網頁 何謂靜態網頁?可以理解為就像是書籍或雜誌一樣,一但從印刷廠出版了...

Feb 8 2020

大家好,今天要來跟大家說明一個知道誰在敲打你家窗戶的方法!?我們在網路的世界中可以透過 API (Application Programming Interface) 與各種應用程式互相交流、溝通、傳遞各種訊息,而如何驗證身份就變成一件重要的事情,即我們不應該將所有的資料都裸奔,讓任何人都可以存取,所以在設計 Web API 的時候常常會需要考慮到授權或驗證的部分,那我們要如何確認誰有權限呢?要如何安全地傳遞訊息呢?接下來跟大家說明其中一種方式。 JSON Web Token (JWT)

Feb 1 2020

前言 身為一個夾心餅乾的專案管理 PM ,上有老闆左有主管右有同事,外面還有出錢的客戶大大。完全就是草木皆兵,每天都跟打仗沒兩樣。 上述的狀況是你的日常生活嗎? PM 除了需要掌握專案時程,另外一個最重要的技能,就是「溝通」。如果溝通技能不點滿,你可能會每天花很多無謂的時間在溝通上,而這對整個專案進度是一點幫助都沒有的,小心落入無效溝通的死胡同! PM 的溝通術 溝通,需要知道的其實很簡單,就下面三種: 認知你溝通的對象 掌握溝通的內容和方向 掌握溝通的時間和專案的時程

Jan 18 2020

圖片作者:MustangJoe 圖片來源連結 開發網站過程中,環境部署或是寫設定檔是一件不簡單的事。比起寫程式,寫設定檔不是開發過程中那麼「頻繁」需要做的事情,所以熟練度跟寫程式比起來多少有落差。 每次要部署或是做 CI / CD 相關的設定時,幾乎都是拿手邊的設定檔來修修改改,如果沒有什麼太特殊的功能,每個專案要做的設定也不會差太多。有沒有什麼服務可以幫我們把這些事做好,讓我們把程式推到 GitHub / GitLab 上的時候,就自動幫我們跑測試或是部署? 在以往只想得到 Heroku...

Jan 4 2020

大家好,新年快樂!對於現代 web 開發框架來說,登入驗證幾乎都有成熟的 library 可以使用,例如 Rails 可以搭配 Devise gem 快速的搭建一個會員登入的系統。但是如果在前後端分離的單頁式網頁(Single Page Application ,以下簡稱 SPA)上,該怎麼跟後端的 API server 好好說哈囉呢? 本文會先討論我們每天在接觸的一些網站基本原理: 一般網站如何實作登入 Cookie、localStorage 與 sessionStorage API...

Dec 28 2019

什麼是 Rake? Rake 是由大師 Jim Weirich 所開發的任務程式工具,就像是 Ruby 版的 Make,可以用來執行各式任務。 Rake 是以 Ruby 語法編寫任務於 Rakefile 檔案中,並用 command-line interface(CLI)輸入指令 $ rake 來執行任務。Rake 可以使用在任何環境,並非只有 Ruby 專案可以使用,只要有 Rakefile 就可以使用 Rake 來執行任務。 文章之後會簡稱 command-line interface...

Dec 21 2019

SASS (Syntactically Awesome Stylesheet) 是一種預處理語言 (pre-processing language),透過 SASS 可以更有效、更結構化的產生 CSS,並有助於減少撰寫重複的樣式,讓你的 CSS 更易於維護。今天要跟大家分享的是 SASS 的 @mixin 與 @include。 SASS 提供兩種語法,分別是 SCSS (Sassy CSS),以及 Indented,最大的差別在語法上 {}、;、= 的有無,以及前者的副檔名為 .scss

Dec 14 2019

前言 這篇文章主要是提供給初學網站設計或由平面設計轉網站設計新手的文章。 我將分享我在設計網站的過程,希望可以幫助新手在開始進行時不至於毫無頭緒。 另外,不管你是新手設計或是已經入行一陣子的設計師,在設計的領域上每個人獲得靈感的方式、設計流程都不同,這邊分享其中一個方式,提供你作為參考,期許你也可以找到屬於自己的設計流程和工作模式,一起面對各種設計挑戰。:) 第一步|你所要設計的網站類型? 首先,你必須要確認你目前設計的網站是屬於哪個類型? 他要達成什麼目的?他提供什麼樣...

Dec 7 2019

(範例會以 Rails 來實作,登入的部分使用 devise 套件為例) 前言 不知不覺來到了 2019 年末。從 2016 年到現在,AMP 也越發成熟完整(但我怎麼還是覺得 bug 還是有點多w),有很多實用的 components 也有豐富的範例可以參考。如果想要大大地提升網站在手機上的搜尋排序,實作 AMP 網頁會帶來相當不錯的效益呢。 由於 AMP 的種種限制,除了拿來實作 content 為主、功能不多的網站,大家很可能仍然對 AMP 望之卻步。今天就要來跟大家介紹透過實...

Nov 30 2019

(Cover Photo by John Schnobrich on Unsplash) 所謂「半路出家」的工程師 也許以下的故事對你/妳而言似曾相識: 之前沒有程式或相關背景的你/妳,透過自學或參加線上/實體課程,找到了第一份工程師的工作。 到了就職報到的第一天才發現,主管跟同事所說的話怎麼都聽不懂;好像當初所學的,其實對於工作情境而言根本就不夠用。過了幾天,把主管交代的任務完成、開始在專案發 PR 。這些 PR 中,有許多部分都被主管評為需要修改。更不幸的是,好像怎麼修改都無...

Nov 23 2019

身處在講求效率的時代,完整的開發流程當然少不了 CI/CD。什麼是 CI/CD 呢?CI(Continuous integration)中文為「持續性整合」,目的是讓專案能夠在每一次的變動中都能通過一些檢驗來確保專案品質。 CD(Continuous Deployment)中文則為「自動化佈署」,讓專案能夠自動在每次變動後能以最新版本呈現。 由於想要體會 CI/CD 到底有多方便,於是想要藉由實做一個簡單的 Node.js 專案來實際體驗看看。 內容架構 寫簡易的 Node.js Server

Nov 16 2019

前言 「工欲善其事,必先利其器」,通常看到這個開頭,就知道今天要來介紹工具。在寫程式時,大家通常習慣的 Editor 是哪些呢? Vim、Emacs、Atom、Sublime、VSCode、記事本。而上述的 Editor 中,最廣為人知的就是被譽為「編輯器之神」的 Vim 和被譽為「神之編輯器」的 Emacs。由於這兩款 Editor 不同的特色與本質,形成了各自的派系並且相互歧視,因此還引發了 Editor 界的一場聖戰「Editor War」。 回到正題,這次主題的 VSCode ...

Nov 9 2019

前言 大家自助旅行時喜歡搭車還是自駕呢?有經驗的旅人會說「看情況」。熱門景點大多交通便利,雖然行程多少會受到路線和班次限制,但整體來說一般還是會因為各種方便,選擇搭乘大眾交通工具吧。那如果是要去比較特別的景點的話呢?或者是雖然是要去四通八達的地方,但帶了一家老小呢?你確定你真的要帶著父母(或小孩)和大包小包的行李,在沒有電梯的月台狂奔去趕兩小時才一班的車嗎?這種情況下,正常人都會勸你們跟團或自駕的。 專案開發其實也是類似的狀況。敝公司的讀者想必對 Ruby on Rails 都很熟悉;Rails...

Nov 2 2019

時間永遠是固定的24小時這麼多,如何掌握在有限的時間內取捨事情的優先順序? PM 手中可能會有多個專案在進行,最有可能遇到的狀況,例如: 你一早進到公司,正打開電腦要回 A 專案客戶的訊息,結果不到兩秒鐘, B 客戶問你能不能開個簡短的視訊會議討論他剛剛新開的 issue,接著 C 客戶突然又在群組上問你昨天會議的事情,然後同事走過來問你午餐要吃什麼(咦)。 是的,彷彿受到詛咒一般,點開什麼東西,事情就會一卡車的跟著飛來XD 做事之前,先排列好優先順序,勇者打怪也是要照步驟來的。