這篇文章給大家分享的是有關(guān)小程序應(yīng)用開發(fā)的示例分析的內(nèi)容。小編覺得挺實(shí)用的,因此分享給大家做個(gè)參考,一起跟隨小編過來看看吧。
創(chuàng)新互聯(lián)建站服務(wù)項(xiàng)目包括蘭州網(wǎng)站建設(shè)、蘭州網(wǎng)站制作、蘭州網(wǎng)頁制作以及蘭州網(wǎng)絡(luò)營銷策劃等。多年來,我們專注于互聯(lián)網(wǎng)行業(yè),利用自身積累的技術(shù)優(yōu)勢、行業(yè)經(jīng)驗(yàn)、深度合作伙伴關(guān)系等,向廣大中小型企業(yè)、政府機(jī)構(gòu)等提供互聯(lián)網(wǎng)行業(yè)的解決方案,蘭州網(wǎng)站推廣取得了明顯的社會(huì)效益與經(jīng)濟(jì)效益。目前,我們服務(wù)的客戶以成都為中心已經(jīng)輻射到蘭州省份的部分城市,未來相信會(huì)繼續(xù)擴(kuò)大服務(wù)區(qū)域并繼續(xù)獲得客戶的支持與信任!
便捷開發(fā)
最近在弄自己的小程序,所以整一篇文章總結(jié)一下。如果你已經(jīng)開發(fā)過小程序,這篇文章可以不用看了。
小程序開發(fā)相當(dāng)?shù)谋憬?,配合官方文檔,微信小程序文檔、支付寶小程序文檔,即可在本地運(yùn)行起來,如果只是單純的展示,那只需要開發(fā)完之后上傳,等待審核了。只需要一點(diǎn)前端基礎(chǔ),就可開發(fā)一個(gè)自己的小程序,有想法的同學(xué)可以行動(dòng)起來。
如果在開發(fā)中出現(xiàn)問題,也可以在小程序社區(qū)求助,微信小程序社區(qū)。
不是在給官方推廣。如果你希望開發(fā)屬于自己的應(yīng)用,小程序是一個(gè)可以快速入手的方案,便捷開發(fā),快速發(fā)布,自帶傳播功能。下面我選中微信小程序講解。
微信原生小程序開發(fā)
|—— component 組件目錄 |—— pages page頁面目錄 | ......more dir | |—— index index頁面 | | |—— index.js index.js- js邏輯文件 | | |—— index.json index.json- json配置文件 | | |—— index.wxml index.wxml- wxml頁面結(jié)構(gòu) | | |—— index.wxss index.wxss- wxss頁面樣式 |—— app.js 全局js文件 |—— app.json 全局json配置文件 |—— app.wxss 全局樣式文件 |—— project.config.json 項(xiàng)目配置 |—— sitemap.json 爬蟲文件
將項(xiàng)目導(dǎo)入到小程序開發(fā)工具中,就可以開始開發(fā)了。添加頁面,直接在pages目錄添加新的文件目錄。具體細(xì)節(jié)參考微信小程序文檔
語法支持:
目前最新版本庫已經(jīng) 支持Es6 / Es7,async/await 和 Promise;
開發(fā)工具會(huì)將代碼轉(zhuǎn)換成Es5 語法,保證各種機(jī)型的樣式適配;
部分語法類似于vue和react;
組件支持:
提供 template 模板支持, 微信小程序 template模版;
Component自定義組件支持,組件內(nèi)部存在生命周期, Component自定義組件;
API支持:
可以調(diào)用封裝過的系統(tǒng)原生方法,比如藍(lán)牙、網(wǎng)絡(luò)信息、掃碼等API方法;
常規(guī)的方法如:Storage、Reqeuest、Animation、Canvas等,更多可以查看微信小程序 API;
除小程序原生開發(fā)外,當(dāng)然也可以使用框架了,我個(gè)人覺得 Taro框架不錯(cuò),支持多端小程序開發(fā)
Taro開發(fā)
Taro開發(fā)文檔,Taro 支持多端開發(fā),包括微信/百度/支付寶/頭條小程序、H5、React-Native,目前我只使用開發(fā)過微信小程序和支付寶小程序、H5,其他的還沒有嘗試過。
|—— config 開發(fā)配置文件 |—— dist 目標(biāo)文件目錄 |—— src 開發(fā)目錄 | |—— actions redux action文件 | |—— constants 常量文件 | |—— pages page頁面目錄 ......more dir | | |—— index | | | |—— index.scss | | | |—— index.txs | |—— reducers redux reducers文件 | |—— store redux store文件 | |—— app.scss app全局樣式 | |—— app.tsx app全局js | |—— index.html html文件 |—— .editorconfig editor配置文件 |—— .eslintrc eslint配置文件 |—— global.d.ts global配置 |—— tsconfig.json ts配置文件 |—— package.json |—— project.config.json |—— readme.md
語法支持:
ts 語法支持;
React語法規(guī)范;
支持使用 CSS 預(yù)編譯器;
Es6/Es7 語法支持,如果需要更新的語法,可以在配置config配置;
組件支持:
react組件式開發(fā),不過最后還是會(huì)編譯成原生小程序;
npm包:
支持使用 npm/yarn 管理;
可以使用 Redux 進(jìn)行狀態(tài)管理;
API:
對小程序API、H5 API進(jìn)行一次封裝,更加方便;
react + ts + npm包,基本就是前端開發(fā)正常節(jié)奏。不論你開發(fā)的那個(gè)小程序,只需要運(yùn)行對應(yīng)的命令,同時(shí),將dist目錄文件導(dǎo)入到開發(fā)工具中,即可看見效果。
taro和原生小程序
原生小程序:上手快,對于接觸過前端開發(fā)的同學(xué),可以馬上上手,基本不存在技術(shù)壁壘。面向微信小程序文檔編程。
Taro開發(fā):react語法規(guī)范,react組件開發(fā),ts語法支持,支持redux。對于react有偏好的同學(xué),強(qiáng)烈推薦。如果你喜歡react,建議使用Taro開發(fā)。(易于團(tuán)隊(duì)協(xié)作)。
小程序開發(fā)問題
微信小程序 不可以使用cookie
微信小程序 非HTTPS的域名不被支持
微信小程序 分享API是同步操作,同時(shí)回調(diào)成功失敗被無法監(jiān)聽
微信小程序 wx.setStorageSync和wx.getStorageSync的API會(huì)頻繁報(bào)錯(cuò)
微信小程序 setData數(shù)據(jù)的1M限制,通過數(shù)據(jù)數(shù)據(jù)拆分可以解決
微信小程序 主包的限制2M,導(dǎo)致無法引入過多的外部文件(使用Taro會(huì)依賴npm包)
微信小程序 微信開發(fā)工具占用CPU過高,導(dǎo)致電腦卡頓
當(dāng)然問題肯定不止這些,還有微信小程序原生組件、API、官方插件等問題,這里不一一細(xì)講了,對于想做自己小程序的同學(xué),這些基本夠用。
不過可能會(huì)有人問,框架不是還沒有講嘛?其實(shí)使用Tora開發(fā)小程序,你只是在使用不同的語法,在編寫小程序,最后,命令工具都會(huì)將文件轉(zhuǎn)換成原生小程序的文件格式。
個(gè)人應(yīng)用
不論你使用哪一種方式,開發(fā)你的個(gè)人應(yīng)用,最后都會(huì)回歸到產(chǎn)品本身上。通過技術(shù)完成自己心目中的個(gè)人應(yīng)用,將應(yīng)用提供給用戶,這個(gè)才是終極目標(biāo)。(技術(shù)只是手段,產(chǎn)品才是目標(biāo))不過我個(gè)人使用Taro開發(fā),算是嘗嘗鮮。
感謝各位的閱讀!關(guān)于“小程序應(yīng)用開發(fā)的示例分析”這篇文章就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,讓大家可以學(xué)到更多知識(shí),如果覺得文章不錯(cuò),可以把它分享出去讓更多的人看到吧!