Applet de WeChat desde la entrada al tutorial de suelo (01)

1. Introducción al Mini Programa

Mini Programa WeChat: Es una nueva forma de conectar usuarios y servicios, se puede adquirir y difundir fácilmente en WeChat y se puede entender como una aplicación desarrollada en la plataforma WeChat.

  • El mini programa es una realización concreta del modelo de desarrollo híbrido.
  • Genere la representación de la página a través de wxml (similar a H5) y wxss (similar a css).
  • Controle la lógica de los datos a través de la capa de control lógico (similar al modelo de vista en vue).
  • La capa inferior implementa llamadas a dispositivos de hardware (como wifi, Bluetooth, etc.) mediante encapsulación.
  • Proporciona interfaces comunes como el inicio de sesión de WeChat y el almacenamiento en caché sin conexión.

Características del mini programa WeChat:

  1. Capacidades más poderosas
  2. Experiencia nativa
  3. Datos abiertos de WeChat seguros y fáciles de usar
  4. Desarrollo eficiente y sencillo

El lenguaje de desarrollo principal para el desarrollo de subprogramas y páginas web es JavaScript. El costo de desarrollo de la migración del desarrollo de la página web al desarrollo de subprogramas no es alto, pero existen algunas diferencias entre los dos.

  1. Los desarrolladores web pueden usar DOM, pero el desarrollo de programas pequeños está controlado principalmente por la capa lógica y carece de interfaces dom y bom
  2. La compatibilidad del desarrollo de páginas web es principalmente para navegadores, pero la compatibilidad de applets considera principalmente clientes WeChat de IOS y Android.
  3. El desarrollo web solo requiere el uso de un navegador y las herramientas de desarrollo relacionadas, pero el desarrollo de los applets de WeChat requiere pasos como solicitar una cuenta y descargar herramientas de desarrollo especiales.

Introducción de otros subprogramas:
Inserte la descripción de la imagen aquí
comparación de subprogramas de WeChat y subprogramas de Baidu

Diferentes entradas: WeChat está fragmentado, Baidu está centralizado.
Diferentes habilidades: WeChat es social fuerte, Baidu enfatiza la IA.
Apertura diferente: WeChat está cerrado, Baidu está abierto.


2. Proceso de lanzamiento del programa WeChat Mini

  1. Registre el mini programa en la plataforma pública de WeChat y, después de completar el registro, puede sincronizar la mejora y el desarrollo de la información.
  2. Complete la información básica del mini programa, incluido el nombre, la foto de perfil, la introducción y el alcance del servicio, etc.
  3. Después de completar la configuración de la información de desarrollo y el enlace del desarrollador del programa pequeño, el desarrollador puede descargar las herramientas del desarrollador y consultar el documento de desarrollo para desarrollar y depurar el programa pequeño.
  4. Después de completar el desarrollo del mini programa, envíe el código al equipo de WeChat para su revisión, y se puede publicar después de que se apruebe la revisión (no se puede publicar durante la versión beta pública).

Solicitud de cuenta

URL de registro: https://mp.weixin.qq.com/wxopen/waregister?action=step1
Inserte la descripción de la imagen aquí
Siga las instrucciones y siga los pasos para registrarse

Descarga e instalación de herramientas para desarrolladores

Herramientas para desarrolladores de WeChat : integre dos modos de desarrollo: depuración de la página web de la cuenta oficial y depuración de programas pequeños.

  • Utilizando la depuración de la página web de la cuenta oficial, los desarrolladores pueden depurar la autorización de la página web de WeChat y los detalles de WeChat JS-SDK
  • Mediante la depuración de subprogramas, los desarrolladores pueden completar el desarrollo y la depuración de la API y la página del subprograma, visualización y edición de código, vista previa y lanzamiento de subprogramas y otras funciones.

Enlace de descarga:
https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
Stable Build (1.03.2006090): después de que los defectos de la versión de prueba se hayan convergido, se convertirá a la
versión estable de RC Build (1.03) previa al lanzamiento .2007151): versión de prelanzamiento, contiene grandes características; a través de pruebas internas, la estabilidad es aceptable.Versión de
desarrollo Nightly Build: se utiliza para corregir defectos lo antes posible y lanzar rápidamente pequeñas funciones; verificación de autoprueba de desarrollo, mala estabilidad,
Inserte la descripción de la imagen aquí
aquí elijo Es una versión estable de Windows64, luego de descargarla instalarla paso a paso

Inserte la descripción de la imagen aquí
En la página de inicio de sesión, puede utilizar el código de escaneo de WeChat para iniciar sesión en la herramienta de desarrollador. La herramienta de desarrollador utilizará la información de esta cuenta de WeChat para desarrollar y depurar el subprograma. La información de la cuenta obtenida en este momento es la cuenta de WeChat escaneada.

Inserte la descripción de la imagen aquí
Crea un nuevo proyecto
Inserte la descripción de la imagen aquí
Descripción del campo principal

  • AppID: el identificador único del subprograma, debe solicitarse y el número de prueba se puede utilizar en la etapa de desarrollo.
  • Servicio de back-end: proporciona soporte completo en la nube, como base de datos y almacenamiento para el desarrollo del lado del servidor.
  • Idioma: compatible con ES6 o TypeScript.

Introducción a la estructura predeterminada del proyecto
Inserte la descripción de la imagen aquí

  • páginas: El directorio raíz de la página Se recomienda que el directorio de archivos sea la unidad de almacenamiento independiente de la página.

  • utils: directorio de herramientas recomendado por el sistema

  • app.js: capa de control de lógica global, utilizada para declarar atributos de datos globales, inicio de sesión del sistema o procesamiento de actualización y otra lógica empresarial

  • app.json: archivo de configuración global del mini programa, utilizado para ingresar la configuración de la ventana global, configuración de enrutamiento, etc.

  • app.wxss: el archivo de estilo global del subprograma.

  • project.config.json: archivo de configuración del proyecto, guarda la configuración personalizada del desarrollo del proyecto

  • sitemap.json: informa al motor de búsqueda qué contenido incluir al recuperar el subprograma actual.

Cree una nueva carpeta de prueba y cree un directorio de prueba debajo de la carpeta, que mostrará la estructura como se muestra en la siguiente figura.
Inserte la descripción de la imagen aquí
La composición del archivo después de la nueva prueba:

  1. test.wxml: estructura dom de página.
  2. test.json: configuración de la página.
  3. test.wxss: estilo de página.
  4. test.js: la capa de control lógico de la página.

Configuración de enrutamiento de página: cada página de visualización en el proyecto de subprograma debe configurar la ruta de acceso (ruta) de la página en app.json

  • Cambiar y saltar entre páginas requiere acceso a través de la misma ruta que la ruta.
  • Después de crear una nueva página, el IDE genera automáticamente la configuración de enrutamiento de la página actual en app.json.
  • La página de inicio del subprograma tiene como valor predeterminado la primera página de la matriz de páginas.
    Inserte la descripción de la imagen aquí

Continuará ,,,
haga clic aquí para ver el siguiente artículo

Supongo que te gusta

Origin blog.csdn.net/qq_44273429/article/details/108014565
Recomendado
Clasificación