小程序入门(一)

        如果你是一点基础都没有的(html、css、js这些不会的)可以去看http://www.w3school.com.cn/这里先学学能够达到基本的页面布局就差不多了。


      小程序的基础配置(开发工具啊、个人先申请小程序啊、appid啊 什么乱七八糟的)具体请参考小程序开发文档 https://developers.weixin.qq.com/miniprogram/dev/quickstart/basic/getting-started.html

        准备就绪我们现在开始(刚开始建议多写些静态页面 熟悉新的环境)。打开开发者工具 用你的微信扫一下登录。在桌面新建一个空文件夹命名(随意那里记着路劲就好)。新建项目--》选择到你刚新建的文件夹-》填写appid(申请的小程序会有一个appid,也可以点击体验小程序)-》项目名称(以后项目多了  便于你识别)-》勾选新建空白快速启动模板

图片来自

这些看小程序的开发文档都有说明我就不说了文档比我说的清楚多了(小程序官方文档);了解小程序基础后。新建一个空白的page页面(名字随意 命名最好 见名知意)。

        小程序布局中主要用 “view、text、images”这几个标签布局(最常用的,还有一些组件详细见文档档-》组件)。我在github里上传了一个官方dome 里面的组件都有 下载后,把appid改成你的就好。

图片来自

下面我们做个这样的页面 (注意:我们拿到ui的设计图的时候 先分析下 它的布局结构。先搭建一个模块的整体框架 框架搭建搭完 在写样式  小程序推荐使用flex布局 贼鸡儿好用)。下面是头部轮播图的布局(轮播组件(swiper))。“flex、cloumn”类我在app.wxss里定义的(晚上我会上传一个关于flex布局的文章。大家可以去百度查一下)。

图片来自
图片来自

hot部分:


图片来自
图片来自

content:


图片来自


图片来自

这玩意太多了也没上传到github 想要的话加我qq 17472544 私我我发给你 。文笔不好都是大白话 见谅见谅。 有问题可以评论,您的评论是我最大的动力 蟹蟹。

emmmm

你可能感兴趣的:(小程序入门(一))