Ran

Full Stack Web Developer


樂於嘗試新事物,持續尋求更好的解決方案。

對於網站開發充滿熱忱,擅長使用 Laravel 開發後端系統 + Bootstrap 4 開發 RWD 前端介面。


技術標籤:

  • 前端-HTML5, RWD, Bootstrap 4, jQuery, HighCharts
  • 後端-Laravel
  • 環境-LEMP (Linux, NGINX, MySQL/MariaDB, PHP), Redis
  • 應用-AWS S3, CloudFlare, Google Analytics, Laradock, MailGun
  • CMS-WordPress, October CMS

工作經歷

後端工程師

The News Lens 關鍵評論網

2020 年 5 月 – 現在

旗下各品牌系統日常維護與優化:

  • 廣告版位建置與串接
  • SEO 定期監測與優化
  • 結構化資料建置
  • Core Web Vitals 指標項目優化

集團後臺文章管理系統設計與開發。

R8alkgsupbwtyytpzdag

軟體工程師

頤德國際

2017 年 4 月 – 2020 年 4 月

主要與 CSR 部門專注於 CSRone 平台、SaaS 及相關系統工具研發。

公司內部系統開發、官網建置與維護,部分外部客戶網站系統建置。

R8alkgsupbwtyytpzdag

系統分析師

捨得資訊

2015 年 7 月 – 2016 年 12 月

年度專案維護與功能擴充、伺服器維運。

系統架構優化,提升系統效能、安全性與穩定性。

Bedkjda52dc8vtuz71uh

學歷背景

淡江大學

資訊工程學系

2013 年 – 2015 年

Ebccqz0mhpcosy7khdy2
Projects 01 00@2x

前一版由委外廠商所開發

  • 時程:一年半 (2016年~2017年9月)
  • 花費:約100萬
  • 架構:Laravel 5.2 (Apache + MySQL)
  • 伺服器:台灣虛擬主機 (單一網域、硬碟30GB,一年7200元)

Projects 01 01@2x

現今版本由我獨立開發

  • 時程:3個月 (2018年5月底~2018年9月底)
  • 花費:個人3個月薪
  • 架構:Laravel 5.8 (Nginx + MariaDB + Redis)
               目前已升級至Laravel 6
  • 伺服器:Linode 2GB (多網域)

我於2017年4月到職後,便開始接手與委外廠商溝通,確保系統品質與功能正確性、前臺UI設計


因平台包含大量的文章圖片、數千本 CSR 報告書PDF,連同原始碼將近約40GB左右。
當時 Filesystem 使用 local disk,除了未來將面臨硬碟空間不足的問題,也存在了安全性的隱憂(上傳惡意檔案)。

針對上述的問題,我做了以下調整:

  • 伺服器改用 Linode 2GB (多網域、硬碟空間 50GB、每月流量 2TB、一年約 3,600 元,節省 50% 的費用)
  • Filesystem 改用 AWS S3 (沒有空間限制用多少付多少、使用者上傳的檔案與系統分離更加安全)
  • CloudFlare CDN 搭配 AWS S3,將圖片及PDF做暫存快取 (每月流量傳輸節省 90% 的費用)


平台於 2017 年 9 月正式上線,而上線後不到兩三個月,由於委外廠商的效率及品質不佳,所以改由我獨自負責系統整體的維護、功能修正與優化。整體架構不動之下,我逐步優化系統原始碼:主要將重複性的代碼封裝、解決 N+1 並減少 query 次數。 


直到 2019 年 4 月,有了開發新功能的需求,系統架構需要異動的幅度較大。在現有系統上改寫、擴充新功能,其技術債與時間成本太大,保守估計至少要花 6 個月以上。當時 Laravel 已經出到 5.8,為了提升系統效能、安全性、第三方套件相容性以及使用框架新的功能。最後決定按照原始功能架構,使用 Larave 5.8 重新開發,於 2019 年 5 月底開始開發,預估 3 個月的開發時程,最後新系統順利於 2019 年 9 月 27 日正式上線。


新系統部分技術描述:

  • 使用 Redis 快取系統參數、當日瀏覽數、當日下載數、熱門文章、使用者資訊...
  • 設置 Nginx 限制請求頻率防止 DDoS (limit_conn_zone、limit_req_zone)
  • 使用 MailGun 做為系統發信郵件服務
  • 站內搜尋使用 Google Custom Search 搭配 Google Analytics 紀錄搜尋字詞與搜尋分類
    再透過 Analytics Reporting API 取得近期熱門搜尋關鍵字 
  • Benchmark API 會員電子報訂閱界接
  • SEO 定時自動化生成 sitemap.xml
  • 頁面使用結構化資料 JSON-LD (WebSite、BreadcrumbList、Article、NewsArticle、Event、Report)
  • 前端頁面載入優化 (Google PageSpeed Insights 成效:手機版 80 分以上、電腦版:99 分)
    → 上傳圖片自動產生縮圖,並於清單頁面使用縮圖
    → 延遲載入圖片(lazyload)
    → 延遲載入第三方外掛 (Facebook Comments, Zendesk)
    → HTML minify
    → webpack by laravel-mix
    → Loading CSS without blocking render
    → CDN link preconnect

M-TOOL-報告書分析工具

  • 使用Laravel框架開發的SaaS
  • 採彈性欄位構設計模式,讓企業能夠透過簡易地操作流程,設計出企業專屬客製化問卷
  • 依據會員設定之時區,可設定問卷調查起訖時間
  • 多元問卷分享方式:URL、QR code、iFrame
  • 問卷回覆管理、匯出
  • 依據問卷回覆即時計算產生重大性矩陣、統計圖表
    (圖表繪製使用 Highcharts)
Paragraph image 02 00@2x

形象網站 & 其他

Projects 01 00@2x
Projects 01 01@2x
Projects 01 00@2x
Projects 01 01@2x
Powered by CakeResumePowered by CakeResume