最新消息

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

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 做事之前,先排列好優先順序,勇者打怪也是要照步驟來的。

Oct 26 2019

通常我們在編寫 HTML 表單中的輸入標籤(或稱 Input Tag)時,都會在每個 Tag 前後加入一些附帶特定樣式,通常是 CSS Class 的 HTML Tag 作點綴修飾,本篇文章的目的為透過 Step by step 的方式,介紹如何透過繼承與拓展 Ruby on Rails 的 FormBuilder 來建立適用於 Bulma CSS Framework 的 FormBuilder。 Bulma CSS Framrwork 與安裝 Bulma 是一個純 CSS 的前端網站...

Oct 19 2019

PM 除了常被討論到的溝通、專案管理技能,在團隊中是否具備補位能力,也是能否讓團隊成員妥善發揮的重要指標,尤其在小團隊協作中,善於補位的 PM 能給的 buff 效果也會更為顯著。 那什麼是補位?補位又該做什麼呢? 簡單來說,在專案過程中能讓開發流暢進行,但沒有專人負責、沒被注意到、可能讓夥伴被打斷的事項,或是需要反覆確認的細節等,都會需要有人能適時補上空缺。當然,這也不僅是 PM 的責任,就像出團打副本,如果每個人都能靈活支援彼此,應該都能滿載而歸才對 XD 而在小團隊中, PM ...

Oct 1 2019

「咦?為什麼系統的訂單金額一直都是顯示成 0 元?」「從什麼時候開始有這問題的?」 主管看到訂單系統的顯示結果不正常,想問到底是怎麼一回事。但這個專案的開發團隊有二十多人,大家每天都有許多的 Commit,也許某位同事無意間改了計算稅務的功能,結果不小心跟著改到訂單顯示金額了。 如果很明確的知道問題是出在哪一個檔案的話,我在「為你自己學 Git」一書的「【狀況題】等等,這行程式誰寫的?」章節曾經介紹過 git blame 指令可以找出指定檔案的第幾行是誰在什麼時候寫的,一下子就可以把犯...

Sep 28 2019

大家好,今天要來跟大家說一個如果是非本科系的工程師不確定上課有沒有學過,如果是本科系的應該是上課有學過,菜鳥工程師可能會不小心踩到的坑,在開始說明之前先給大家看一段程式碼。 這是一段很簡單的 Ruby 程式碼,表示調整廣播電台頻道的類別,支援預設電台的功能,也就是說使用者在按下某個按鈕,就可以跳到喜歡的頻道(話說現在年輕人還知道電台嗎?@@)。 class Tuner def initialize(presets) @presets = presets clean ...

Sep 21 2019

什麼是 DSL? DSL 的存在意義是什麼? DSL 為 Domain Specific Language 的縮寫,中文譯為「特定領域語言」。而 DSL 的開發通常是為了迎合某些特殊的需求,例如針對系統、平台、程式工具、軟體問題、商業邏輯等等領域,當人們發現現有的程式語言並沒有辦法好好地嵌合使用需求,DSL 就有其存在的價值。目前為人所知的 DSL 包括 CSS 以及 SQL,而這種易於人類閱讀的 DSL 也能夠讓程式設計師乃至於一般使用者都能享受 DSL 帶來的好處,甚至不懂程式設計的...

Sep 7 2019

在 COSCUP 2019 講完用 WebRTC 建立半分散式網路,想說來把投影片整理成一篇文章來紀錄一下這段時間拿 WebRTC 嘗試形成網路的一些實驗結果 WebRTC 是什麼? 如果不知道什麼是 WebRTC,可以參考去年寫的文章:https://5xruby.tw/posts/webrtc/ 簡單來說 WebRTC 可以讓瀏覽器直接跟瀏覽器連線,但是連線的建立很麻煩,開發者要自己想辦法讓兩個瀏覽器交換 handshake 資訊 (offer, answer, ice) Multiplayer...

Aug 31 2019

React Hooks 在 React 16.8 推出之後 (雖然已經有 lag 瞬間就已經來到 React 16.9.0 惹),讓工程師們又多出幾行 code 的時間可以滿足客戶的磨練需求啦! 這次就利用 React Hoock 來串接一個聊天室應用,看看 React Hooks 如何幫助簡化並加速整個開發過程。除了 React 自身提供的 useState 和 useEffect hook 之外,還會用到幾個開源的 React hooks 來幫忙提昇開發效率。 預計實做功能 群...

Aug 24 2019

還記得一開始自學程式語言時,大家一定或多或少都聽過一個名詞 物件導向。然後身為程式新手和非程式相關科系畢業的你也許會開始 Google 它到底是什麼意思,然後你會在 維基百科 上查到諸如此類的解釋: 物件導向程式設計(英語:Object-oriented programming,縮寫:OOP)是種具有物件概念的程式編程典範,同時也是一種程式開發的抽象方針。它可能包含資料、屬性、程式碼與方法。物件則指的是類別的實體。它將物件作為程式的基本單元,將程式和資料封裝其中,以提高軟體的重用性、靈...

Aug 17 2019

今年 RubyConf Taiwan 嘗試辦了 After Hack 這個活動,也因此有機會可以跟 Ruby 語言的 Commiter 聊一些有趣的問題。 當天我的預定是把活動這幾天寫的 Gem 認真的補完測試,不過沒想到還剩下一個多小時就做完了,那就順便來思考一下 Tamashii 專案能怎樣去改進,在今年的演講中大家應該都對 Fiber 有一個認識,而這個也許是一個不錯的選項。 所以就馬上去看了一下講者(Samuel)的 Async 這個 Gem 做了些什麼事情,因為剛講完關於 Enumerator...