用vant开发小程序(零基础开发微信小程序)

微信小程序前端怎么做新手开发入门教程

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.善用公文。前端人员主要看组件，框架部分，够用了。小程序有自己的官方开发文档，很详细，就是对于第一次接触的人来说，有点头疼无从下手，不好读。

:

imagepng

1.image.png，此时你可以在项目文件夹中看到一个新生成的folder _npm，包括我们刚刚安装的vant组件库。

2、image.png，

4.在小程序开发工具中，单击右上角的“详细信息”并选中“使用npm模块”

3、image.png，

5.在需要使用这个组件库的组件中的json文件中，添加需要使用的组件中的内容(以button为例)

:

零基础开发微信小程序

1.课程基于新版微信小程序开发，开头为微信小程序。简介微信小程序开发

2.介绍新功能，Cloud开发，云功能的基本使用，后端路由的建立。

3.简介微信小程序与后端的联合使用，验证过程，授权机制的详细说明，token的生成，jwt与token的关系。

4.简介微信小程序框架，iview，ColorUI，Vant等UI框架，重点介绍canvas的使用，使用canvas前端生成共享海报图片，后端生成共享海报图片。

5.项目实战，两个项目，一个个人博客微信小程序项目，以wordpress为后端，前端微信小程序，集分享、评论、登录等功能于一体功能。第二个项目是UI库的实现，模仿Lagou.com做了一个简单的UI界面。