前言
今天微信小程序正式发布，我开始以学习新技术的心态与微信小程序进行首次接触。无论微信小程序如何被吹散，它都会杀死大量本机应用程序。作为新事物，它必须存在。它具有存在的价值。作为学习者，我们必须保持正确的学习态度。勇敢地追求新事物。
适用范围
张小龙对小程序的定义：
小程序是无需下载和安装即可使用的应用程序。它实现了“触手可及”的应用程序梦想。用户可以扫描或搜索以打开应用程序。它还体现了“使用和使用”的概念，用户不在乎是否要安装太多的应用程序。应用程序将无处不在，可以随时随地使用，而无需安装和卸载。
可以看出小程序具有以下特征：
无论开发人员是否使用小程序开发应用程序，都应结合小程序的特征来分析其是否合适。
开发人员工具
如果工人想尽力而为，首先必须改进他们的工具。目前，微信小程序有其自己的概念。下面是ide的下载地址。
开发人员工具
扫描QR码以登录，当前打开内容如下：
使用特定的说明，并给出正式说明。
使用开发人员工具的第一个欢迎页面
通过查找信息开始微信小程序的开发，这是第一个欢迎页面：
页面分析
整个页面非常简单，主要由图片，文本和按钮+文本组成。这三个垂直居中。您可以将它们放在容器中，将它们居中放置，然后垂直向下放置。每个节点都会调整css样式。
目录结构
要编写欢迎页面，请首先在ide中建立相应的目录结构：
目录结构和文件分析：
直接运行时会发生错误，因为未指定应用程序加载的页面。通过查找官方api文档找到加载页面的方法：
您需要在app.json文件中进行相应的更改：
{ "pages":[ "pages/welcome/welcome" ]}
运行效果如下：
CSS样式
将相应的样式添加到welcome.wxss文件中：
.container{ display: flex; flex-direction: column; align-items: center;}.myphoto{ width: 200rpx; height:200rpx; margin-top: 200rpx;}.motto{ margin-top: 100rpx; font-size: 32rpx;}.button{ margin-top: 200rpx; border: 2rpx solid #405f80; border-radius:10rpx; height: 60rpx; width:200rpx; text-align: center;}.button-text{ font-size: 22rpx; color: #405f80;}page{ height: 100%; background-color:#b3d4db;}
可以在全局app.wxss文件中定义字体：
text{ font-family: Microsoft Yahei; }
最后，通过更改导航栏的颜色使其与背景颜色一致。 api文件：
在app.json文件中配置以删除黑色导航栏：
{ "pages":[ "pages/welcome/welcome" ], "window": { "navigationBarBackgroundColor": "#b3d4db" }}
最终效果：
摘要
通过使用微信提供的ide编写欢迎页面，我觉得ide不够完善。图片不能与ide直接添加。只能通过在计算机中找到与磁盘相对应的目录来添加它。欢迎页面几乎被使用都是web前端技术，因此您可以开始学习Web前端的基本知识+官方文档微信小程序。