學習React Native必看的幾個開源專案

weixin_34249678發表於2016-12-15

1.前言
讀專案原始碼是一種非常好的學習方式,現階段React Native還在高速的發展,版本迭代速度很快,同時入門學習的教程也比較少。因此檢視閱讀別人寫的好的開源專案就非常重要,吸取精華。那本期就來給我大家推薦幾個開源專案
剛建立的React Native交流6群:426762904,歡迎各位大牛,React Native技術愛好者加入交流!同時部落格右側歡迎微信掃描關注訂閱號,移動技術乾貨,精彩文章技術推送!
二.Facebook’s F8 Conference App
React Native最佳學習模版- F8 App開源了,介面和體驗是相當的完美,這個是Facebook官方開發的,所以放在第一位進行推薦。現在在github將近6000個star了。專案地址https://github.com/fbsamples/f8app

1907848-ab4f415bfdca1573.png
圖片.png

三.Reading
來自餓了麼RN大神開源的reading專案,已經完成Android和iOS雙適配。絕對是一個產品級的開源專案,並且作者還在持續的更新。值得一薦!
專案地址:https://github.com/attentiveness/reading

1907848-e87e22c449e52d5b.png
圖片.png

四.Weather
該為國外一個天氣預報客戶端,介面效果簡約優美,作者借鑑F8專案同時客戶端資料來自真實國外的天氣預報API。這天氣預報客戶端體驗估計已經給原生開發者造成10000點傷害了。專案地址:https://github.com/stage88/react-weather

1907848-578b264aebeab0ee.png
圖片.png

五.Github Feed
該專案來自阿里開發人員,你的又一Github客戶端哦~專案github也超過了1000個star。主要功能:
Feeds like web github home. (Github個人主頁)
Search users or repos. (搜尋使用者或者開源庫)
Star, watch repos, follow guys. (start,watch庫,follow使用者)
Explore trending repos daily, weekly, monthly. (檢視瀏覽趨勢)
Check who's famous in some filed all of the world. (檢查特殊的commit)

1907848-6e9792e83856f3bf.png
圖片.png

專案地址:https://github.com/xiekw2010/react-native-gitfeed


六.React-Native-NBA-App
這個專案主要進行檢視NBA相關資料,介面做的非常Nice,專案整體架構也非常不錯,關鍵還有圖表介面,同時適配Android和iOS雙平臺。也是大家不可多得學習的專案。推薦!
專案地址:https://github.com/wwayne/react-native-nba-app



![

](http://upload-images.jianshu.io/upload_images/1907848-d5bcf3460c15fa4a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

1907848-0067991b5980cce8.png
圖片.png

/--------------------第二波來了-------------------/
1.HackerNews
採用純React Native開發的HackerNews客戶端,同時相容Android、iOS雙平臺。用到很多常用的開源元件,而且非常適合初學者入門的專案。有借鑑意義。
專案地址:https://github.com/iSimar/HackerNews-React-Native

1907848-276740d618daa048.png
圖片.png

2.iShiWuPai
iShiWuPai是基於React Native和Redux實現的展示型美食類APP。不過當前暫時只適配iOS版本,但是效果絕對讚了~
已完成功能點:
逛吃介面,支援下拉重新整理和上拖載入更多

資訊詳情介面

食物百科介面

食物列表頁面所有功能,包括子類別排序、營養素排序功能及動畫,支援上拖載入更多

我的、食物對比基本介面

專案地址:https://github.com/ljunb/react-native-iShiWuPai

1907848-9055376772c6e3de.png
圖片.png

3.HiApp
採用React Native開發的一款基於類似微博以及聊天App,同時相容Android、iOS雙平臺,甚至還有Web端。整體功能有很多可以學習的地方。例如效果佈局,多語言切換等等。
專案地址:https://github.com/BelinChung/react-native-hiapp

1907848-503b1d226ad3c215.png
圖片.png

4.cnblogs
採用React Native開發的cnblog部落格客戶端,當時只適配Android版本。不過基本功能已經做的挺完善的效果也還不錯。已經涵蓋部落格,排行列表,詳情,評論,搜尋等功能。
專案地址:https://github.com/togayther/react-native-cnblogs

1907848-75ce99e7ebfde399.png
圖片.png

5.Gank.io App
號稱App最多的網站乾貨集中營(Gank.io)最後也推薦兩個。首先來一個的是效果和開發者頭條有點類似的哈~同時相容雙平臺。不過也是very 因垂思挺。
專案地址:https://github.com/zhongjie-chen/rn_rank

1907848-e68bf0847868b829.png
圖片.png
  在來一個Gank客戶端,這個客戶端其實也是大同小異,主要在介面UI實現風格方面有點變化,特別提一點裡面的妹紙圖縮放以及拖動效果做的還不錯的。

專案地址:https://github.com/iwgang/GankCamp-React-Native

1907848-2c303cf1181a8cea.png
圖片.png

文章收集自江清清的技術專欄(http://www.lcode.org),原文地址:
http://www.lcode.org/study-react-native-opensource-one/
http://gold.xitu.io/entry/575f498c128fe100577336b2
如需看更多文章,可以到原作部落格看哈。

相關文章