本身動手，從0到1開發一個App

本文假定讀者是想經過本身的學習和努力，從0到1去製做本身的一款APP產品。

我將從獨立開發者的角度，儘量描述一條可行的路徑。

第一步：製做產品原型

不懂開發的人可能以爲軟件產品就只是程序員埋頭吭哧吭哧搞出來的，但編碼其實只是其中一個環節，並非所有。你能夠把產品原型理解爲房子的設計圖，簡單的房子可能不須要設計，但稍微複雜一點的，都是離不開圖紙的。

有些程序員想本身作個東西，也不須要和別人協做，以爲這個麻煩，就跳過這一步了。但我建議最好仍是先作出原型來，它不只能夠幫助你把頭腦中的想發快速呈現出來，更重要的是，在你設計原型的時候，你已經把產品在腦海中作了一遍了，這樣對你在後面進行軟件的模塊設計的時候是有極大的好處的。

這裏推薦幾個作 App 產品原型的軟件：墨刀 、Axure。若是不是特別清楚原型是什麼東西的話，能夠到墨刀的討論區去看看，有一些分享的做品。

第二步：產品頁面設計

這年頭顏值愈來愈重要了，對於大部分開發者來講，可能作不到設計驚豔，可是要作到簡潔大方並非一件很難的事情。

祕訣就是要統一，統一好顏色、字體的使用場景，這樣出來的視覺效果通常不會不好。

這裏有篇文章介紹了設計規範的內容，你能夠去參考一下：APP界面設計規範編寫指南。

還有一個就是圖標的問題，阿里巴巴圖標庫有很是多圖標，通常App都夠用了。

通常來講，若是是我本身開發的應用，不多去動手設計頁面，都是直接用一套成熟的設計規範，而後對着產品原型來動手編碼了。好比 App 的就可使用谷歌出品的 Material Design，後面提到的 Flutter 就已經內置了 Material Design 的 UI 組件了。

若是你要本身動手設計頁面的話，在 mac 上面我推薦使用 sketch 。

第三步：代碼編寫

接下來就能夠考慮開始動手幹了。首先咱們要先定一套技術方案，通常來講，咱們作一個普通的App，須要搞定的東西有除了手機App，還有相關的API服務接口。

App 客戶端

首先咱們看一下App端，目前手機平臺有兩大陣營，一個是 Google 開源的 Android 系統，一個是蘋果的 iOS 系統，它們使用的開發語言和開發工具都是不同的。其中 Android 可使用Java 或者 Kotlin 語言來原生開發，iOS可使用 Objective-C 或者 Swift 語言。

若是你要兩個平臺都各作一個，那開發成本將會很是高。我建議你考慮直接採用跨平臺的技術，好比Google 的 Flutter （Dart語言）或者 Facebook 的 Reactive Native （JavaScript語言）技術。

固然你要先調研一下你要作的產品在相關平臺下實現有沒有可行性，這方面能夠諮詢一下相關的技術專家。也能夠按照經驗原則，你在別的App看到的功能，通常都能實現。

不管你使用什麼技術，通常來講在 App 端須要作的事情通常不外乎編寫頁面，編寫交互邏輯和數據通訊，通常採用HTTP協議。

這裏涉及到的技術點比較多，個人經驗是直接經過一個完整的Demo源碼來邊學邊作是比較高效的學習方法，這個Demo最好足夠簡單，可是有完整的邏輯交互和通訊過程，好比登陸和數據列表。找Demo能夠經過搜索引擎、GitHub、開源中國等平臺。

還有一個值得分享的經驗是要以官方文檔做爲主要參考和學習材料，資料夠準確，你也會慢慢就能快速索引到相關知識點。遇到一些不懂的知識點要善於Google 或者百度，一門相對成熟的技術，網上都有不少資料的。

API 服務端

若是說App是能夠看得見，摸得着的前端，那 API 就是看不到的後端了。這一塊的技術就更復雜了，你的App用戶是1000人，1W人，100W人，後面系統的設計複雜度是徹底不同的。固然，這裏不去討論負載均衡、分佈式設計這些複雜的東西，當前咱們能搭建一個簡單的web服務就行了。

雖然我本身用 Java 比較多，但若是你是剛開始接觸後端開發，你能夠試一下 expressjs，上手很快，對於簡單的接口開發是足夠啦，語言是 JavaScript，恰好你能夠結合一下使用 Reactive Native 來開發App，下降了很多學習和開發成本。

後臺管理端

這個是用來方便你後面運營App用的，好比要錄入一些資料，管理用戶等。要完成這個，在懂得寫接口的基礎上，你還要學習怎麼編寫網頁。

若是你前面的事情都能搞定，那 HTML 和 CSS 這些對你來講就是小菜一碟了。若是你還有精力的話，你能夠順便把 vuejs 也看一下，這裏推薦一個後臺模塊：vue-element-admin。

若是實在學不動了，也能夠用 boostrap + jquery 來搭建一套視覺還不錯的後臺系統。

到此，你的 App 就算是完成了，測試和上架那些就不提了。推廣和運營又是另一個話題了，有機會再聊。

補充學習資料：

1. Flutter實戰
2. 阮一峯 JavaScript 教程
3. 廖雪峯 JavaScript 教程
4. HTML/Css W3School 中文教程

本文由 Agile Studio 工做室原創，轉載請附上下面連接：blog.nowait.xin/Learn-To-Bu…

關於咱們：

咱們是一支由資深獨立開發者和設計師組成的團隊，成員均有紮實的技術實力和多年的產品設計開發經驗，提供軟件定製服務。