微信小程序輕松入門,教程+案例demo

2018-12-08 11:49 更新

微信小程序開發(fā)難嗎?應該怎么學?針對這些問題,W3Cschool為您收集整理了關于微信小程序的一切。以下為《微信小程序入門教程+案例demo》原文:


首先擺在好姿態(tài),——微信小程序開發(fā)也就那么回事。你只需要一點點css(真的只要一點點)的基礎就可以了。

目錄


  1. 微信小程序入門教程案例demo
    1. 認清微信小程序開發(fā)
    2. 怎么學
      1. 開發(fā)工具你得有吧
      2. 開發(fā)文檔得有吧
      3. 基礎會了再來點實戰(zhàn)
      4. 項目還不夠
      5. 最后

認清微信小程序開發(fā)

其實,我覺得小程序就是將微信官方提供20+個基礎組件(目前有26個)進行排列組合,然后加上一些css樣式,對用戶的操作進行反饋(調(diào)微信官方提供的60+個api)。26個基礎組件+60個開放api=半天就搞定了吧?(認真跟著下面的教程走半天足夠了)

怎么學?

1、開發(fā)工具你得有吧?

這里是最新版下載鏈接(傳送門)—>微信web開發(fā)者工具最新版下載地址

目前微信小程序開發(fā)工具已經(jīng)不需要破解都可以了,你只要使用手機端微信掃一掃登錄開發(fā)工具,在創(chuàng)建應用的時候選擇為無APPID就可以開發(fā)了。


2、開發(fā)文檔得有吧?

很多人可能覺得看視頻要習慣點(CSDN學院的微信小程序?qū)崙?zhàn)視頻),但是本人建議學新東西不要看視頻,入門最好的方式就是看官方文檔(還有什么誰比官方自己更懂自己的東西呢?。?,下面是官網(wǎng)地址:

微信小程序官方文檔(傳送門)

當然這里推薦看W3CSchool官網(wǎng)整理的文檔,思路相對比較清晰。(再來個傳送門

3、基礎會了,再來點實戰(zhàn)

學完一樣東西,最好的方式就是將這個東西付諸于實踐,下面進入實戰(zhàn)《微信小程序之百思不得其姐(簡版)》,如果你能全程跟著做出來,那么你就已經(jīng)入門成功了。

先看效果圖



說明這個項目的IDEA是借鑒了這位大哥的,感謝這位大哥

再來看看項目截圖


具體的代碼這里我不就貼了,我把整個項目打包直接下下來就可以用(點我下載DEMO)。

我使用到的圖標都是從阿里巴巴的iconfont下載的(之前不知道的簡直就是非常大的福利哦,你用了就知道)。

4、項目還不夠?

如果你覺得上面的實戰(zhàn)還不夠激發(fā)你的潛能,那么下面給出幾個我在學習過程中找的IDEA,希望對你有幫助。

1)、計算器
https://github.com/dunizb/wxapp-sCalc

2)、豆瓣圖書
http://www.jianshu.com/p/c35084200470

3)、移動商城
https://github.com/liuxuanqiang/wechat-weapp-mall

4)、天氣
http://swiftcafe.io/2016/10/03/wx-weather-app/

5)、空氣質(zhì)量查詢
http://blog.csdn.net/yulianlin/article/details/52692066

6)、github客戶端
https://blog.zhengxiaowai.cc/post/weapp-demo.html

7)、知乎日報
http://www.apkbus.com/forum.php?mod=viewthread&tid=268626&extra=page%3D1%26filter%3Dsortid%26sortid%3D12


最后

感謝上面提到demo的作者們,共同進步……





作者:大力-哥

原文鏈接:微信小程序入門教程+案例demohttp://blog.csdn.net/qq137722697/article/details/52988719


以上內(nèi)容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號