微信小程序爬坑之旅（一）页面架构

前言：
前端小白，个人来说其实前端的基础并不扎实，微信小程序之前稍微接触过，目前在职产品岗，其中的巧合成分居多，目前产品岗位的工作个人感觉也很适合自己，不过偶尔还是会写一下代码，代码这个东西，长时间不写会生疏甚至遗忘（真的）
这次小程序的爬坑会陆续更新，不定期的更新，本人准备做一个类似打车的小程序，个人尝试，目前先搭建前端页面，后端的话准备用node.js写轻量级后端。
另：前端页面使用纯原生html语言（采用微信提供的框架）不知道是否有第三方框架，个人也不大会用第三方框架。
大神勿扰，其中遇到的问题会尽量抛出解决方案，个人也会写一下心路历程。

页面基础架构

微信本身的框架其实已经足够好了，不过对于小白来讲，再没有人带领的情况下还是需要先看一下网络视频，不然真的是门都进不去，之前一直在创建页面这个事情上徘徊了很久后来看过视频才知道其实很简单。先说一下在创建项目的时候微信小程序自带的目录文件吧：
微信的目录文件很简单
——项目名称
————pages
——————页面文件
————app.js
————app.json
————app.wxss
————project.config.json

其中pages是用来存放页面的文件夹，pages文件夹中，每一个文件夹都代表一个页面，每个页面的组成文件有：js.json,wxml,wss
js：用来存放脚本文件（javascript）
json:用来存放页面在整个小程序中的说明（个人理解）
wxml：用来存放页面代码（相当于Html文件）
wss：用来存放页面样式代码（相当于css）

1. 小程序如何创建页面文件
   小程序创建页面文件其实很简单
   只需要在app.json文件中pages数组中加入页面路径以及名称，微信小程序开发工具就会自动创建页面文件

比如我需要创建一个登录页面命名为login，如下：

app.json
{
  "pages":[
    "pages/login/login",
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle":"black"
  }
}

2. 页面编写
   页面编写的就按照正常的网页形式编写，不过微信小程序中已经封装了很多的基础组件
   比如用<view></view>替代<div></div>标签
   然后也有图片标签<image></image>
   路径的话可以在本地创建一个image 的文件夹专门用来存储页面需要的图片素材

下一篇准备接触一下微信小程序的 map 组件（预感到了大坑即将来临）