Hybird開發初體驗之React Native

2022-07-09 11:00:13 字數 1977 閱讀 8462

之前跟朋友討論前端未來發展方向的時候,朋友有提到移動端,當時我覺得3d也將會是乙個方向,於是就去專攻了一下webgl、three.js這些技術並從事這方面的開發。

時光荏苒,現在縱觀一下前端開發的實況,感覺就像是下圖所示的這樣:

難易度上個人感覺:pc < m < 3d ;

然而針對具體的技術,要達到一定的高度都是需要一定的時間積累和研究的;

我是乙個對未知事物充滿好奇和興趣的人,在提高已知技術棧水平的同時,我很願意去接觸一些從未嘗試過的技術,所以移動開發將會是我下乙個接觸的點。

一、混合開發的優勢

7、8年前移動智慧型裝置逐漸進入大眾的生活,安卓/ios開發瞬間火熱;

而今天,移動開發仍然在web開發領域佔據一定的地位,但是技術選型上卻有了新的選擇-混合開發。

2 編寫一次,多端通用,跨平台,體驗一致。

3 元件可以modules和compontents化,開發效率及復用率高。

4 支援擴充套件: 可直接呼叫原生元件(需要按規則封裝),原生也可以反過來和混合頁面互動;當然也可以呼叫三方modules元件模組。

在對比了幾套流行的解決方案之後,我選擇了react-native作為學習物件,so,接下來將會開啟我的rn開發之旅。

rn中文網環境搭建教程:

根據我的實際搭建經驗,給出如下步驟:

1.安裝依賴:node、watchman(facebook檔案系統監測工具)

brew install node

brew install watchman

2.切換**映象(不要用cnpm!!!)

npx nrm use taobao

3.安裝yarn

npm install -g yarn

4.xcode版本檢查

xcode版本要10以上,並且要檢查 xcode | preferences | locations 是否安裝命令列工具 command line tools

5.cocoapods安裝

參考文章:

6.新建專案

npx react-native init myproject(在當前目錄下新建乙個名稱為myproject的rn專案)

顯示安裝cocoapods所需的依賴失敗,讓我們到專案ios目錄下執行pod install,just do it!

7.pod install

到專案的ios目錄下,執行pod install

那就找找新的位址裝一下咯。

8.boost-for-react-native

開啟ios/podfile,設定該依賴的git倉庫位址(碼雲)

設定好之後,重新pod install一下

9.專案啟動

yarn ios

稍等片刻。。。

至此,乙個rn專案的demo就成功執行起來了 

Electron開發初體驗

平時總會寫markdown,markdown整體語法用起來很方便,但依然有晦澀的地方,比如 markdown的 語法寫起來很容易出錯,而且每行每列單元格裡的內容長短不一編輯器裡就很容易亂掉,所以我在寫 時候都是借助tables generator來寫的,但是這個 不能儲存多個模板,每次寫不同的 都要...

React開發初體驗

react開發和初體驗 jsxstate setstate react的起源 他們就去思考 是否有一種新的模式來解決上面的問題 以元件的方式去劃分乙個個模組 元件內以jsx來描述ui的樣子,以state來儲存元件內的狀態。當應用的狀態發生改變的時候,通過setstate來修改狀態,狀態變化時候,ui...

Symbol 開發初體驗 3

今天研究的是 1.把 mc1000 掃瞄到的條碼儲存到 mc1000 機器本身的資料庫中 2.後又把該資料庫的資料轉成 txt檔案,並清空資料庫 3.把mc1000 機器中的txt檔案傳輸到pc電腦中。4.細節如下 1 vs2003 按預設選項安裝完畢後,會生成乙個dll檔案 system.data...