Frontend Development 6 min read

Frontend Technology Exchange Meeting: YouZan and Meicai Share Development Practices

In a closed-door Frontend Technology Exchange, YouZan and Meicai teams shared practices ranging from YouZan Retail’s cross-platform receipt printing and Electron-based desktop cashier client to Meicai’s ReactNative CRM architecture, RAD rapid project scaffolding, and open-source component library development, sparking cross-team insights and collaboration.

Youzan Coder
Youzan Coder
Youzan Coder
Frontend Technology Exchange Meeting: YouZan and Meicai Share Development Practices

In mid-December, YouZan Frontend team jointly hosted a Frontend Technology Closed-door Exchange Meeting with Meicai Frontend team at YouZan's new office building.

The exchange meeting covered several major application scenarios of frontend technology, including print service practice in YouZan Retail, ReactNative technical architecture of Meicai CRM APP, desktop cashier client development practice based on Electron, and implementation of frontend basic technologies at YouZan.

This closed-door meeting broke the boundaries between YouZan and Meicai frontend teams. Through sharing and Q&A sessions, theories and thoughts collided, generating more insights and inspiration.

Print Business Practice in YouZan Retail - Printing receipts is an unavoidable issue in retail scenarios, involving diverse devices, varied protocols, and multiple platforms. By using js printing + cross-platform container solution, they achieved a single codebase to handle multiple receipt types and devices. Additionally, by upgrading the template language, merchants were empowered to customize all receipt blocks to meet various business scenarios.

Meicai CRM APP ReactNative Technical Architecture - As the company grows, it faces challenges of multi-business crossover, module integration, and rapid App construction. The sharing demonstrated how to design App architecture based on CRM business scenarios, how to decompose business scenarios during upgrades, and how to perform architecture upgrades, ultimately forming a cross-platform, cross-business ReactNative solution.

Desktop Client Development Practice Based on Electron - YouZan Retail shared their practice of achieving multi-end code reuse through Electron-based desktop cashier client. The presentation covered how to build a desktop client application, implement single-codebase multi-end reuse, and shared practical experiences in hardware integration, offline capabilities, and hot updates to solve rapid hardware device integration, cashier efficiency improvement, and elegant client version upgrades.

RAD - Rapid Frontend Project Setup - With rapid business development, numerous backend frontend projects, office projects, and chart display projects require development. To improve feature reuse, reduce maintenance costs, and ensure all components meet company UI/UE standards, Meicai introduced RAD tool for scaffolding setup, component warehouse (including component demos, downloads, visual page building), and defined Block as the smallest interactive element for reuse to quickly build backend applications meeting visual standards.

Frontend Basic Technology Implementation and Collaboration - This sharing introduced the complete process of basic technology from internal pilot, implementation, and collaboration to open-source promotion, using the development history of open-source component library Vant as a case study. Several methods to solve difficulties in technology project implementation were shared, such as cultivating service awareness, improving documentation details, and providing solutions for common problems.

frontend developmentElectroncomponent libraryCross-Platform DevelopmentReactNativeDesktop ApplicationPrint ServiceVant
Youzan Coder
Written by

Youzan Coder

Official Youzan tech channel, delivering technical insights and occasional daily updates from the Youzan tech team.

0 followers
Reader feedback

How this landed with the community

login Sign in to like

Rate this article

Was this worth your time?

Sign in to rate
Discussion

0 Comments

Thoughtful readers leave field notes, pushback, and hard-won operational detail here.