21天精通微信小程序开发 (移动开发系列) (王延平)（Z-Library）

# 21天精通微信小程序开发 — Reading Guide ## 【One-Line Pitch】 A structured 21-day, day-by-day tutorial for absolute beginners to learn WeChat Mini Program development from scratch — covering the framework architecture, WXML/WXSS styling, JavaScript fundamentals, and hands-on tooling — ideal for front-end developers and programming newcomers who want to enter the WeChat ecosystem. ## 【Book Arc】 - **Opening (~0%–10%)**: Introduces the philosophy and business context of WeChat Mini Programs — Zhang Xiaolong's "use-and-go" (用完即走) design values, the product's launch history, and why Mini Programs are neither pure H5 nor native apps. Sets expectations for what Mini Programs can and cannot do. - **Early (~10%–32%)**: Covers the technical architecture — the view layer vs. logic layer split, the four-file page structure (js/json/wxml/wxss), and why Mini Programs are not standard H5 (no DOM, no W3C compliance). Also walks through registration, WeChat certification, and the official developer tool's editing and debugging modes. - **Middle (~32%–48%)**: Dives into the framework itself — the app-level files (app.js, app.json, app.wxss), global configuration options like tabBar and networkTimeout, and the data-binding system that keeps the view and logic layers synchronized. - **Late (~48%–75%)**: Moves into the three core languages: WXML syntax and visual components, WXSS styling (box model, positioning, Flexbox), and JavaScript fundamentals (variables, data types, arrays, flow control) — all taught with Mini Program-specific examples. - **Ending (~75%–100%)**: Covers JavaScript advanced topics (OOP, functions, JSON, ES6 syntax), plus third-party visual development tools (Coolsite360, 即速应用) and community resources. Appendices serve as a reference for all components and APIs. ## 【Key Takeaways】 - **Mini Programs are not H5** (Early): They use a proprietary framework with no DOM, no Window/Document objects, and no support for jQuery or other web libraries — but they do reuse JavaScript, XML-like WXML, and CSS-like WXSS syntax, so front-end developers can ramp up quickly. - **The four-file page structure is mandatory** (Middle): Every page requires same-named .js, .json, .wxml, and .wxss files; the app root requires app.js, app.json, and app.wxss. This enforced separation of logic, config, structure, and style is the backbone of Mini Program development. - **Data binding keeps view and logic in sync** (Middle): The framework's core is a data-binding system — when you modify data in the logic layer, the bound view updates automatically. Understanding this model is essential before writing any real code. - **Configuration is done via JSON, not code** (Middle): app.json controls global settings like tabBar (2–5 tabs only), network timeouts, and window appearance; page-level .json files override global settings for individual pages. - **WXML and WXSS are simplified but powerful** (Late): WXML provides a custom tag library (view, scroll-view, swiper, form components, etc.), while WXSS inherits standard CSS with support for box model, positioning, float, and Flexbox — the layout skills transfer directly from web development. - **JavaScript is taught from the ground up** (Late): The book assumes no prior programming experience, covering variables, operators, data types, arrays, conditionals, and loops before moving to OOP, functions, JSON manipulation, and ES6 features like let/const and arrow functions. - **The official developer tool is your primary workspace** (Early): It offers edit and debug modes with a simulator, console, WXML inspector, AppData viewer, and Storage panel — plus keyboard shortcuts for efficient coding. Always verify on a real device, as the simulator may differ. - **Registration has real constraints** (Early): Mini Programs require an enterprise/government/organization account (no personal registration), and WeChat certification (300 RMB) is needed for advanced features like payment. Names and service categories are hard to change after approval. ## 【Reading Tips】 - **Skim the first two days** (~0%–10%) if you're already familiar with WeChat's ecosystem — the philosophy and history are interesting but not code-critical. Focus instead on the architecture explanation in Day 2. - **Deep-read Days 5–6** (framework and configuration) — this is where the mental model of Mini Programs clicks. Make sure you understand the four-file structure and data binding before moving on. - **Treat Days 12–13 (WXSS and Flexbox) as high-priority** — layout is where most beginners struggle. Practice the box model and Flex properties in the simulator until they feel natural. - **The JavaScript sections (Days 14–20) can be skimmed if you already know JS** — but pay attention to Mini Program-specific details like the wx object, Page() and App() functions, and how JSON is used for configuration. - **Use the appendices as a reference, not reading material** — they list all components and APIs (network, media, location, device, UI, open interfaces) and are best consulted when you need a specific feature. ## 【Coverage Limits】 The excerpts cover the book's structure, philosophy, architecture, tooling, and configuration in detail, but do not include full code examples for WXML components, WXSS styling, or JavaScript exercises — those sections are summarized from the table of contents and framework descriptions. ##