自我介紹

你好，我是一名 Asp.Net C# Web 程式小主管
目前已從接案型科技公司畢業
經手過的Web案子約十來件、APP專案一件

主要工作內容以Web後端撰寫、資料庫、系統分析、專案分工、前後端整合為主
UI/UX、Web GIS、APP開發為輔

參賽動機

資管系畢業專題就是撰寫一支Android APP
礙於大四全學年實習計畫縮減時間
只能課堂上功能拼拼湊湊就交差了，沒有認真的實踐...

也希望出社會後，有一天做出屬於我完成的APP
往往計畫趕不上變化，出社會後都被派遣做Web的工作

苦蹲三年，升上主管後，跟上層主管提了一直以來想開發APP的想法
主管在去年順利的爭取到開發APP的合約項目
專案啟動時，也就踏上了APP開發之路

希望透過這三十天鐵人賽
使用React Native開發上架經驗向大家分享

為何選擇 React Native 與 Expo 作為開發框架

如果是Web轉前端APP的工程師
一定會在Flutter跟React Native周旋
甚至會一直Google & ChatGPT查詢兩種語言與框架的差異性

兩種框架官方文件快速翻閱後
Web工程師在Dart語言一定得重新適應(時間允許的話是不排斥學習的...)

而React Native本身就建構在Javascript上
在比較熟悉Javascript情況下
直接挑戰React Native開發APP，以及持續精進Javascript核心能力

※Expo則是專門為React Native量身訂做的快速開發工具，後篇會在做工具詳細介紹
主要還是以學習React Native框架、語法為主

單人開發故事

長久以來，推廣公司前後端分離的轉型計畫

• 前端工程師不用去下SQL指令
• 後端工程師不用去調整Html、CSS

是我這個小主管最大的使命

於是透過業餘時間學習前端底子、React Native元件、熟悉前端開發方式、生命週期
工期兩個月，單人開發，順利如期交件
從無經驗到做出第一隻完全屬於自己開發的APP

圖為上架App Store 通過 Apple人員審查APP完成之畫面

也讓原本Java & Swift雙平台工程師及Web前端同事
有了多一項的開發選擇。

文章簡介

此系列會以「學習一個月」、「開發兩個月」、「維護九個月」共一年的經驗
從自身專案資訊技術層面，作為分享及撰寫的題材
從基本概念到專案實作
在專案實作持續學習基本概念

• 自我技術、可行性評估
• 開發環境、Expo 專案建置
• React Native Components、JSX
• React Props、State
• Tailwindcss、NativeWind
• React Navigation
• 登入登出 Auth 機制、React Effect、Context
• Expo 實用 library
• React Native 日期選單、下拉式選單
• QR Code 條碼讀取
• GPS定位、背景追蹤功能
• Mockapi 後端資料測試前後端串接
• Play商店、App Store上架

以上題材會由上而下排序
首次開發前端框架APP，學習經驗有限，還請多多包涵😜

文章適用對象

• Web專案工程師(有傳統Html前端基礎，切版、元素控制)，想轉職APP工程師
• 有 JavaScript基礎 經驗的前端工程師
• 正在撰寫React Native的前輩同行
• 不會React，想直接學Native的新手
• 公司有意願導入APP專案開發的夥伴們

下一篇開始
就是開發前的評估與環境準備
首次參加IT鐵人賽，還請各位多多指教~