隨時隨地的部落格管理 — WordPress app 使用 & 開發經驗分享 / Managing WordPress On the Go_陳奕如 / Jaclyn Chen

首先分享我在行動裝置上用 WordPress app 管理部落格的經驗，包括使用時機、相較於網路版的優勢，以及使用 Gutenberg 古騰堡編輯器的心得。接下來會進入開發的部分，先介紹整個行動開發團隊如何分工以及更新 WordPress app (iOS & Android)，然後用 WordPress iOS app 的例子說明開發的架構以及如何和 API 溝通，最後是有興趣的開發者如何參與行動軟體的開源。

Transcript

1. 隨時隨地的部落格管理 Managing WordPress On the Go WordPress App 使用 & 開發分享 陳奕如 Jaclyn Chen
2. 背景 My background • 台中長大，國小國中熱愛寫作 Grew up in Taichung, loved writing in schools • 大學電機系 Electrical engineering major • 美國念碩士踏入資訊業 Moved to software engineering during Masters in the US • 2013 開始全職做 iOS 開發 Started full-time iOS development in San Francisco • 2018 夏天離開灣區回台灣 Moved back to Taiwan • 2019 六月加入 Automattic! • 現在全職開發 WooCommerce iOS App 遠端工作人生 Rem or f
3. WordPress App 使用 App Usage 旅行部落格 My travel blog WordPress apps 時機 When I use 古騰堡 Mobile Gutenberg 今天的演講 Overview WordPress App 開發 App Development 開源 Open source 如何分工 How we work 開發流程 Dev process Web vs. mobile
4. My experience with WordPress WordPress 使用經驗
5. 旅行部落格 My travel blog • 熱愛旅行，找景點和美食 Love traveling, finding sights & food • 2018 夏天開始每個月寫 Started in summer 2018 • Self-hosted WordPress (DigitalOcean) + Jetpack 備份 • 很多成長空間 (來 WordCamp 向大家 學習！) So much room to grow • 新公車路線到九份 The post with better SEO: new bus to Jiufen 新公車路線 = 少人寫 = SEO 排名 New = fe n ons = be r SE
6. • 管理部落格 Blog management • 編輯文章 Editor • 閱讀文章 Reader • 流量統計 Blog statistics • 留言通知 Notifications • 輔助使用 Accessibility: 語音控制、文 字大小 Voiceover/Talkback, dynamic type WordPress Apps
7. 使用時機 Use cases • 離線編輯 Offline support: 旅行、等 候時間利用 • 隨地閱讀 Read on any device • 即時回應通知 Respond to notifications quickly
8. 古騰堡 Gutenberg • 移動段落 Moving blocks • 還原/重做 Undo/Redo • 相片影片區塊 Image/video block
9. WordPress App 開發分享 WordPress App Development
10. 行動團隊如何運作 How mobile team works Platform 9¾ Exceed expectations! App maintenance & platform features Mobile Gutenberg Mobile Gutenpage WooCommerce Design Hogwarts
11. 開發流程 Development cycle Sprint goals 衝刺目標 Dogfood 內部測試 ❄ Beta testing 外部測試 2 weeks 建議、回報 Feedback 準備上架、修正 Release prep, hot fixes
12. 行動 App 架構 How mobile app works • 資料儲存 Persistence store • 與網路資料溝通 API • 編輯器 Editor • 平台專屬功能 Platform features
13. 與後端資料庫溝通 API • 用戶 Account • 部落格: 網誌、網頁、留言、流量等等 Blog: posts, pages, comments, stats, etc. • 追蹤的部落格文章 Reader: posts from followed blogs • 資料同步、爭議處理、離線編輯 Data syncing, conflict resolution, offline changes https:/ /developer.wordpres s.com/docs/api/ App Database
14. • 傳統編輯器 Classic editor - Aztec: 原始語 言 iOS/Android language • 古騰堡 Gutenberg: React Native - Javascript 編輯器 Editor
15. iOS • iOS 13 暗黑模式 Dark mode • Siri 捷徑 shortcuts • Today widget • Accessibility: Voiceover, Dynamic Type 平台專屬功能 Platform features Android • Android 暗黑模式 Dark mode • Accessibility: Talkback, 字體大小 font size
16. 行動版 vs. 網頁版開發 Mobile vs. Web 介面資料來源 UI data source • 網頁：資料庫或是 API Web: database or API • 行動：API 更新 + 手機/平板資料 庫 Mobile: API syncing + device persistence 上架 Releases • 網頁：隨時發行或收回 Web: deploy or roll back anytime • 行動：iOS 須經過約一天審核 ，Android 約幾小時；無法輕易收回 Mobile release: about 1 day for iOS, a few hours for Android; harder to rollback
17. 開源 Open source iOS/Android code 都在 GitHub 上！All code on GitHub WordPress • iOS (July 2008): https:/ /github.com/wordpress -mobile/WordPress-iOS • Android (February 2010): https:/ /github.com/wordpress -mobile/WordPress-Android
18. 參與行動開源 Contributing to mobile
19. 參與行動開源開發 Contributing to mobile dev • 開發工具 Development tools ◦ iOS: Xcode, Cocoapods, rake tasks ◦ Android: Android Studio, gradle • 申請開發者帳號 Apply for an app id/secret ◦ https:/ /developer.wordpres s.com/apps Objective-C & Swift Java & Kotlin Javascript
20. 初步嘗試？First try? 我們有建議適合開始的題目 We have some recommended first issues GitHub → Issues → 「Good first issue」標籤 參與行動開發 Contributing to mobile dev 想改善特定功能？Want to improve a particular feature? GitHub → Issues → 搜尋英文功能 關鍵字 找到了想做的題目 After finding an issue to work on 在 Issue 上留言 Leave a comment on the issue → 開 Pull Request
21. • 有功能需求或是使用問題？Any mobile feature requests or issues? iOS: http:/ /ios.forums.wordpress.org/forum/requests-and-feedback Android: http:/ /android.forums.wordpress.org/forum/requests-and-feedback • 試用最新功能？Dogfood the latest features? https:/ /make.wordpress.org/mobile iOS: TestFlight beta Android: 在 WordPress 的 Google Play Store 加入 Beta • 讓 App 的語言更在地化？Interested in improving app localization? https:/ /translate.wordpress.org/projects/apps 參與行動開源 Contributing to mobile
22. 關於行動團隊 About the Mobile Team 2019.9 Grand Meetup “GM” 美國奧蘭多 Orlando, USA
23. 行動團隊地圖 Mobile team map • 53 人分布在 20 個國家 • 新成員 35% 是女生 • 70% 新成員的母語非英文 • English, Spanish, Czech, Italian, Turkish, Portuguese, French, Mandarin, Greek, Polish, Hebrew, Serbian, Ukrainian, Tamil, Filippino, Patois 亞太 APAC ‍‍‍ ‍‍‍ ‍‍‍ ‍‍‍
24. 人才招募中！ We’re hiring! automattic.com/work-with-us
25. 謝謝！Thank you! jaclyn.y.chen@gmail.com https:/ /travel.jaclynchen.com jaclync@GitHub
26. Other Automattic Apps WooCommerce • iOS: https:/ /github.com/wo ocommerce/woocom merce-ios • Android: https:/ /github.com/wo ocommerce/woocom merce-android Simplenote • iOS: https:/ /github.com/Aut omattic/simplenote-ios • Android: https:/ /github.com/Aut omattic/simplenote-an droid