ModernWeb Summit

ModernWeb Summit 旨在協助開發人員掌握網站技術發展的最新動態。近年來,網絡技術日新月異,開發者必須持續學習新工具和方法,才能創造出更優質、更安全的網站服務。會中將展現從前端框架的創新,到後端語言和架構的突破,再到優化網站性能的策略等當前網站開發的最新趨勢。透過這次交流,期望啟發開發者如何運用現代網路技術,推動整個行業邁向新的發展階段。

AGENDA
議程表

09 月 11 日
09:30 - 11:00
【工作坊】通用使用性介面設計工作坊
余虹儀(小魚) / 通用設計工作室 創辦人

1. 通用使用性概念與挑戰

  • 通用使用性起源與概念
  • 通用使用性三項設計挑戰

2. 兼顧新手和熟手的需求

  • 新手和熟手使用介面常見問題
  • 發現並整合新手和熟手的需求

3. 考量特殊使用族群的需求

  • 了解不同使用族群與情境的需求
  • 善用輔助工具以符合通用使用性

瞭解更多

  • # UI/UX 設計與應用
09 月 11 日
09:30 - 11:00
【工作坊】【五倍學院聯名推薦工作坊】Vue.js 的新工業革命:Vapor Mode - 無 Virtual DOM 的新時代!
許國政 (Kuro Hsu) / Vue.js Taiwan 社群主辦人

自從 Vue 3 正式成為主流前端框架以來,Vue.js 社群一直在不斷探索新的技術和工具,以提升 Vue.js 應用的性能和開發效率。 而 Vapor Mode 便是一種基於 Vue.js 的新技術,它透過去除 Virtual DOM 來提升 Vue.js 底層渲染性能,使得 Vue.js 應用更加輕量、快速和高效。

雖然 Vapor Mode 還沒有正式推出,卻也引起了廣泛的關注和討論,我認為 Vapor Mode 將是 Vue.js 繼 Composition API 後的新變革,為 Vue.js 未來帶來全新的可能性。

瞭解更多

  • # 前端嶄新技術
09 月 11 日
09:30 - 11:00
【工作坊】【五倍學院聯名推薦工作坊】Python 新手股市探險:從資料到視覺化
高見龍 / 五倍學院 負責人
  • 環境安裝
  • 如何處理 CSV 檔案
  • 取得證交所資料並用 Python 畫出股票 K 線圖

瞭解更多

  • # 現代化工具和流程
09 月 11 日
11:30 - 13:00
【工作坊】使用 Angular 打造 Static Site Generator
黃升煌(Mike Huang) / Angular Taiwan 打雜義工

隨著 Angular 持續發展,其中的 Angular Universal(Server Side Rendering) 功能越來越完整,要建立高效能和 SEO 表現的網站越來越容易,再加上 Prerender 功能,就算沒有後端與資料庫,也能輕易地建立靜態網站上傳到免費的空間如 GitHub Page 上。也可以搭配 Angular CLI Builder 和 Angular Schematics 設計出更符合個人需求的環境,達到極致的開發體驗!

本次分享將以 Angular 18 為基礎,實際寫 code 給你看,透過上述功能一步一步示範製作一個靜態網頁產生器 (Static Site Generator) 的所有細節,重造輪子雖然累,但一定是最適合自己的輪子!

瞭解更多

  • # JAMStack 開發與運用
09 月 11 日
13:30 - 14:10
【分堂議程】Angular Signals 高效能開發演練
黃升煌(Mike Huang) / Angular Taiwan 打雜義工

Angular 近幾版大動作不斷,其中最引人注意的莫過於 Angular Signals 了,透過 Angular Signals 機制可以讓我們以更加 reactive 的方式開發彈性高且易於維護的程式,同時也帶來了更好的效能表現!

 本次分享將以 Angular Signals 為主軸,分享在實際專案開始導入 Angular Signals 後的經驗以及注意事項,幫助您快速開始使用 Angular Signals 開發高效乾淨的應用程式

瞭解更多

  • # 前端嶄新技術
09 月 11 日
13:30 - 15:00
【工作坊】通用使用性介面設計工作坊
余虹儀(小魚) / 通用設計工作室 創辦人

1. 通用使用性概念與挑戰

  • 通用使用性起源與概念
  • 通用使用性三項設計挑戰

2. 兼顧新手和熟手的需求

  • 新手和熟手使用介面常見問題
  • 發現並整合新手和熟手的需求

3. 考量特殊使用族群的需求

  • 了解不同使用族群與情境的需求
  • 善用輔助工具以符合通用使用性

瞭解更多

  • # UI/UX 設計與應用
09 月 11 日
13:30 - 15:00
【工作坊】【五倍學院聯名推薦工作坊】Vue.js 的新工業革命:Vapor Mode - 無 Virtual DOM 的新時代!
許國政 (Kuro Hsu) / Vue.js Taiwan 社群主辦人

自從 Vue 3 正式成為主流前端框架以來,Vue.js 社群一直在不斷探索新的技術和工具,以提升 Vue.js 應用的性能和開發效率。 而 Vapor Mode 便是一種基於 Vue.js 的新技術,它透過去除 Virtual DOM 來提升 Vue.js 底層渲染性能,使得 Vue.js 應用更加輕量、快速和高效。

雖然 Vapor Mode 還沒有正式推出,卻也引起了廣泛的關注和討論,我認為 Vapor Mode 將是 Vue.js 繼 Composition API 後的新變革,為 Vue.js 未來帶來全新的可能性。

瞭解更多

  • # 前端嶄新技術
09 月 11 日
13:30 - 15:00
【工作坊】【五倍學院聯名推薦工作坊】使用 Ruby on Rails 快速構建心理測驗
林姿萱 (Krystal) / 五倍學院 網頁工程師

工作坊將涵蓋從 Rails 項目設置、心理測驗邏輯設計到整合第三方 API,最後實現基於按鈕驅動的測驗互動結果。參與者將學習如何使用 rails 快速建置網站,並整合第三方 API ,以及如何根據用戶的選擇生成和展示測驗結果圖像。無論您是初學者還是有經驗的開發者,這個主題將為您提供一個實用且有趣的 Ruby on Rails 項目。

瞭解更多

  • # 後端技術與架構
09 月 11 日
13:30 - 15:00
【工作坊】【五倍學院聯名推薦工作坊】Python 新手股市探險:從資料到視覺化
高見龍 / 五倍學院 負責人
  • 環境安裝
  • 如何處理 CSV 檔案
  • 取得證交所資料並用 Python 畫出股票 K 線圖

瞭解更多

  • # 現代化工具和流程
09 月 11 日
14:30 - 14:55
【分堂議程】從 React Native 轉生到 Flutter
朱章祺(Bucky Chu) / 五倍學院 前端工程師

探討從 React Native 轉換到 Flutter 的過程中遇到的挑戰和解決方案,包括:

  • 開發流程的變化:如何適應從 React Native 到 Flutter 的開發流程變化,分享實際案例和經驗。
  • 效能優化:比較兩者在效能方面的表現,並介紹在 Flutter 中進行效能優化的實踐技巧。
  • UI/UX 設計:探討在 Flutter 中設計和實現精美 UI/UX 的新方法,與 React Native 的差異。
  • 社群支持與資源:分析 Flutter 社群和 React Native 社群的支持和資源差異,提供有效利用社群資源的建議。

瞭解更多

  • # PWA 與跨平台開發
09 月 11 日
15:25 - 15:50
【分堂議程】輕量化前端組合技:htmx 與 Alpine.js 開發應用
張珈寧(Ning) / 五倍學院 網頁工程師

1. htmx 與 Alpine.js 的基礎知識

2. JavaScript 實戰應用

3. htmx / Alpine.js 實戰應用

4. JavaScript 與 htmx / Alpine.js 開發差異

瞭解更多

  • # 前端嶄新技術
09 月 11 日
15:25 - 15:50
【分堂議程】NestJS 與 gRPC:快速上手指南
謝浩哲(HAO) / 台灣積體電路製造股份有限公司(TSMC) Senior IT Engineer

gRPC 是現代微服務架構中常用的 RPC 框架,以其高效、低延遲、串流等特性受開發者喜愛。而 NestJS 以嚴謹、風格一致的開發體驗聞名,並且對gRPC提供了良好的支持,讓開發者可以用 NestJS 的風格來撰寫 gRPC 服務與客戶端,大幅提升開發體驗。本演講將透過實際程式碼展示如何在 NestJS 中運用 gRPC。如果你對 NestJS 感興趣,或者正在尋找合適的 Node.js 後端框架來實現 gRPC 服務,千萬不要錯過!

瞭解更多

  • # 後端技術與架構
09 月 11 日
15:30 - 17:00
【工作坊】使用 Angular 打造 Static Site Generator
黃升煌(Mike Huang) / Angular Taiwan 打雜義工

隨著 Angular 持續發展,其中的 Angular Universal(Server Side Rendering) 功能越來越完整,要建立高效能和 SEO 表現的網站越來越容易,再加上 Prerender 功能,就算沒有後端與資料庫,也能輕易地建立靜態網站上傳到免費的空間如 GitHub Page 上。也可以搭配 Angular CLI Builder 和 Angular Schematics 設計出更符合個人需求的環境,達到極致的開發體驗!

本次分享將以 Angular 18 為基礎,實際寫 code 給你看,透過上述功能一步一步示範製作一個靜態網頁產生器 (Static Site Generator) 的所有細節,重造輪子雖然累,但一定是最適合自己的輪子!

瞭解更多

  • # JAMStack 開發與運用
09 月 11 日
16:10 - 16:50
【分堂議程】從0開始打造企業級元件及低代碼平台
楊勝堡 (湯姆羊) / 國泰世紀產物保險 前端開發小組組長
黃添賜 (阿賜) / 國泰世紀產物保險 前端開發小組工程師
  1. 元件庫設計概念 - 到底該如何設計才是適合企業自身的元件庫?
  2. 元件實踐與開發祕辛 - 過去兩年開發過程中踩過的所有地雷及解決方式初公開
  3. 從元件庫到低代碼平台 - 元件庫領域展開!擴展元件庫的TA
  4. 低代碼建構實戰 - 系統架構與開發經驗分享
  5. AI in lowcode - 平台的下一步走向
  6. 成果展示 - 展示國泰產險前端元件庫與低代碼平台開發現況

瞭解更多

  • # 前端嶄新技術
09 月 11 日
16:10 - 16:50
【分堂議程】The guide to handle Meta ads tracking for web developers.
徐愷(KK) / 適才科技股份有限公司 負責人

由於第三方 cookie 的禁用,要追蹤網站的廣告成效越來越困難,加上 meta 三不五時更新介面與推陳出新,行銷廣告投放人員不了解網站,開發者不瞭解廣告邏輯,導致追蹤往往斷掉。此演講將分享如何規劃前後端架構才能夠好好的追蹤數據,讓廣告投手能藉由此數據來最佳化廣告,並以工程師能理解的方式來說明廣告運作與追蹤邏輯,讓跟你配合的投手很開心。

瞭解更多

  • # MarTech 網站技術與行銷整合
09 月 12 日
13:30 - 14:10
【分堂議程】PostgREST: 將 PostgreSQL 轉化為 API 的魔法
古永忠(古永忠博士) / PostgreSQL Taiwan 社群召集人
  • PostgREST 是一套可以簡單地讓 PostgreSQL 擁有 RESTful API 的開源軟體.
  • 本主題除了介紹什麼是 PostgREST 之外, 也會分享整體系統服務的實作架構.
  • 提供一些常見的使用情境範例, 幫助你更靈活地使用資料庫服務.

瞭解更多

  • # 後端技術與架構
09 月 12 日
14:30 - 14:55
【分堂議程】如何用JS建構POS系統 - 發票機跟刷卡機
高逸宸(Logan) / 適才科技股份有限公司 軟體工程師

在這個講座中,我們將探討如何使用JavaScript來建構高效、現代化的POS系統,並實現發票機與刷卡機的無縫整合。從基礎概念到實踐應用

1. 概述POS系統

2. 為何選擇JavaScript

3. 使用JavaScript與硬體通訊的技術

4. 完整POS系統的實作演示

5. Q&A互動環節

瞭解更多

  • # POS系統軟硬體整合
09 月 12 日
15:15 - 15:40
【分堂議程】Shadcn ui ~不再從零開始刻前端元件的生活~
王耀輝(Wind Wang) / ONElab 瑞嘉軟體科技股份有限公司 資深前端設計師
  1. 原先我們的痛點在哪
  2. Headless ui 組件庫概念
  3. Shadcn ui 的背景介紹
  4. 跟傳統 ui 組件庫對比
  5. 如何使用 Shadcn ui
  6. UI 設計師如何客製樣式
  7. 實務上我們怎麼協作的

瞭解更多

  • # 前端嶄新技術
09 月 12 日
16:00 - 16:40
【分堂議程】Hello Rust, 與AI/Python完美的結合
陳昭明(I code so i am) / 巨匠/Tibame等公司AI講師 深度學習/Python講師

Rust程式語言受到國際IT大企業的強力推薦,包括【Google投百萬美元給Rust基金會,要強化C++與Rust互通性】、【微軟再組新團隊,欲將 C# 代碼改寫為 Rust!】、【Amazon AWS大量投資Rust社群,開源Tokio】,Linux發明人Linus Torvalds說【Rust will go into Linux 6.1】,為什麼呢?因為Rust是一個年輕(2010年誕生)、有活力(有146,000個註冊套件)的程式語言,既可以解決傳統C語言最令人詬病的缺陷,程式動不動就crash,甚至整台電腦當掉,嚴重影響系統維運的穩定性,同時又擁有現代化程式語言的優點,例如類似Python的套件管理、物件導向程式設計(OOP)、Function Programming…等等。

瞭解更多

  • # 後端技術與架構
09 月 13 日
11:30 - 13:00
【工作坊】【五倍學院聯名推薦工作坊】用 Rust 來打造你的隨機密碼產生工廠
張珈寧(Ning) / 五倍學院 網頁工程師

Rust 近年來以開發快速、安全聞名,在 stack overflow 的 2024 年調查中,Rust 被列為最讚賞的語言之一,這次工作坊將帶大家一探究竟 Rust 的強大魅力,我們將實作一個密碼產生器,來體驗 Rust 開發手感。

瞭解更多

  • # AI 輔助開發實戰
09 月 13 日
14:30 - 14:55
【分堂議程】打倒怪獸的怪獸-以框架實現目標
陳怡廷(Esther) / 金融產業 UIUX Leader 斜槓 Frontend 和 Scrum Master
  1. 介紹團隊面對的生態和挑戰,以及如何將目標「團隊影響力」轉為框架。
  2. 依照影響力框架引入創新工具,由內而外、由團隊到業務的實現:知識分享、訪談、工作坊、設計創新、小組專業強化與考核優化。
  3. 分享工具篩選方式,與實際操作經驗。探討成果與效益。

瞭解更多

  • # UI/UX 設計與應用
09 月 13 日
15:25 - 15:50
【分堂議程】跨團隊協作,打造以用戶為中心的產品
許毓芬(Fen) / 國泰金控 用戶科技發展部-設計組長
陳涵靜(Flora) / 國泰金控 用戶科技發展部-產品設計師

好的用戶體驗,設計團隊不僅要具備良好的設計能力,還需能夠影響產品決策,為用戶創造價值。

如何從用戶體驗出發,與產品團隊合作交流,將以國泰證券App為例,分享國泰金控設計團隊跨子公司協作的實際經驗。

瞭解更多

  • # UI/UX 設計與應用
09 月 13 日
15:30 - 17:00
【工作坊】【五倍學院聯名推薦工作坊】Rust 從零開始網頁爬蟲
朱章祺(Bucky Chu) / 五倍學院 前端工程師

近年來 Rust 的崛起,掀起了一波改寫 Rust 的風潮,那麼究竟 Rust 可以在 Web 端帶來什麼樣的幫助呢?這個工作坊會帶領各位從零開始了解 Rust,並且實際從環境設定,到實作一個爬蟲程式。

瞭解更多

  • # 現代化工具和流程

SPEAKERS
講者陣容

王耀輝(Wind Wang)
王耀輝(Wind Wang)

ONElab 瑞嘉軟體科技股份有限公司

資深前端設計師

古永忠(古永忠博士)
古永忠(古永忠博士)

PostgreSQL Taiwan

社群召集人

朱章祺(Bucky Chu)
朱章祺(Bucky Chu)

五倍學院

前端工程師

余虹儀(小魚)
余虹儀(小魚)

通用設計工作室

創辦人

林姿萱 (Krystal)
林姿萱 (Krystal)

五倍學院

網頁工程師

徐愷(KK)
徐愷(KK)

適才科技股份有限公司

負責人

高見龍
高見龍

五倍學院

負責人

高逸宸(Logan)
高逸宸(Logan)

適才科技股份有限公司

軟體工程師

張珈寧(Ning)
張珈寧(Ning)

五倍學院

網頁工程師

許國政 (Kuro Hsu)
許國政 (Kuro Hsu)

Vue.js Taiwan

社群主辦人

許毓芬(Fen)
許毓芬(Fen)

國泰金控

用戶科技發展部-設計組長

陳怡廷(Esther)
陳怡廷(Esther)

金融產業

UIUX Leader 斜槓 Frontend 和 Scrum Master

陳昭明(I code so i am)
陳昭明(I code so i am)

巨匠/Tibame等公司AI講師

深度學習/Python講師

陳涵靜(Flora)
陳涵靜(Flora)

國泰金控

用戶科技發展部-產品設計師

黃升煌(Mike Huang)
黃升煌(Mike Huang)

Angular Taiwan

打雜義工

黃添賜 (阿賜)
黃添賜 (阿賜)

國泰世紀產物保險

前端開發小組工程師

楊勝堡 (湯姆羊)
楊勝堡 (湯姆羊)

國泰世紀產物保險

前端開發小組組長

謝浩哲(HAO)
謝浩哲(HAO)

台灣積體電路製造股份有限公司(TSMC)

Senior IT Engineer