微信小程序前端怎么做新手開發入門教程

1、單位變化，寫H5頁，一般用rem、px、percentage等。在小程序，它有自己的單位rpx。我自己的理解是，一個寬度為100%的div，也就是常說的橫幅，所以它的寬度是750rpx。50%寬，也就是375rpx。這個rpx可以自動適應不同的屏幕尺寸，所以不用擔心小程序中頁面的兼容性問題。

2.完全支持flex布局。flex布局之前也接觸過，因為瀏覽器兼容性還沒有完全覆蓋，所以沒什么用。現在還在用float，在小程序，可以放心使用。實際使用后，感覺比float強多了。我相信再過幾年，flex布局會成為主流，這將是前端布局的一次革命，因為它徹底改變了現有的模式。不熟悉flex的小伙伴們，趕緊學起來吧。

3.關于背景圖，首先小程序中不支持背景圖。Base64，對于前端人員來說，這兩種方法完全不現實。因此，不支持背景圖像。那我該怎么辦呢？解決辦法是：小圖，用字體圖標寫。大圖，用圖像寫，再寫絕對定位。到目前為止，還沒有更好的辦法。

4.字體圖標的使用。小程序有自己的字體圖標，但是太少了。這根本不夠好。我們還是要用大阿里的logo庫，但是不能直接用。我們必須將ttf字體轉換成base64。百度有具體方法。

5.關于標簽閉包小程序，標簽閉包的要求特別嚴格，過于精確。可以說稍微短一點就會報錯，有點像xhtml。標簽必須是關閉的。要特別注意像input這樣的單標簽，如果跟隨/不寫的話是永遠不行的。

6，模板和文件引用，只要當遇到重用的代碼塊時，可以構建一個模板在任何地方引用它，比如頭、底、列表。模板的用法也不難，就是把代碼放進去，給它起個名字，就是一個模板。使用IS屬性引用模板。詳情請查閱官方文件。

7.善用公文。前端人員主要看組件，框架部分，夠用了。小程序有自己的官方開發文檔，很詳細，就是對于第一次接觸的人來說，有點頭疼無從下手，不好讀。

微信小程序開發版和體驗版的區別

1，小程序架構，小程序主要分為兩個主要部分：視圖模塊和服務模塊。查看模塊負責UI展示。它包括：wxml和wxss轉換后的代碼和微信提供幫助模塊。一個視圖模塊對應一個webview組件，小程序支持多個視圖。視圖模塊通過微信jsbridge對象與后臺通信。

2.類型小程序，小程序主要分為三種版本類型開發版，體驗版，正式版。開發板和體驗版不需要審核。你需要給許可微信。掃描二維碼小程序即可訪問。正式版需要經過微信的審核流程。開發版和體驗版的區別在于開發小程序版的二維碼有效期比較短。在項目中，你可以準備兩到三套環境。開發版本訪問測試環境，正式版訪問生產環境。

3.測試5，電話號碼小程序。雖然小程序是在微信推出的新品，但是和模式上的其他客戶端測試是一樣的。小程序的測試主要分為四個方面，分別是功能測試，兼容性測試，性能測試，后臺接口測試。對于安全性測試，因為小程序集成在微信客戶端，相比傳統的網頁，安全性更能得到保障。只要保證后臺接口上數據的安全性測試，客戶端的安全性由

4，功能測試，功能測試類似于傳統的web端測試，這里就不贅述了。

5.兼容性測試，兼容性測試要考慮三個方面系統兼容性，微信兼容性和緩存數據兼容性。