Top Related Projects
微信小程序商城,微信小程序微店
又一个小商城。litemall = Spring Boot后端 + Vue管理员前端 + 微信小程序用户前端 + Vue用户移动端
🔥 🎉newbee-mall是一套电商系统,包括基础版本(Spring Boot+Thymeleaf)、前后端分离版本(Spring Boot+Vue 3+Element-Plus+Vue-Router 4+Pinia+Vant 4) 、秒杀版本、Go语言版本、微服务版本(Spring Cloud Alibaba+Nacos+Sentinel+Seata+Spring Cloud Gateway+OpenFeign+ELK)。 前台商城系统包含首页门户、商品分类、新品上线、首页轮播、商品推荐、商品搜索、商品展示、购物车、订单结算、订单流程、个人订单管理、会员中心、帮助中心等模块。 后台管理系统包含数据面板、轮播图管理、商品管理、订单管理、会员管理、分类管理、设置等模块。
mall项目是一套电商系统,包括前台商城系统及后台管理系统,基于Spring Boot+MyBatis实现,采用Docker容器化部署。 前台商城系统包含首页门户、商品推 荐、商品搜索、商品展示、购物车、订单流程、会员中心、客户服务、帮助中心等模块。 后台管理系统包含商品管理、订单管理、会员管理、促销管理、运营管理、内容管理、统计报表、财务管理、权限管理、设置等模块。
ruoyi-vue-pro 全新 Cloud 版本,优化重构所有功能。基于 Spring Cloud Alibaba + MyBatis Plus + Vue & Element 实现的后台管理系统 + 用户 小程序,支持 RBAC 动态权限、多租户、数据权限、工作流、三方登录、支付、短信、商城、CRM、ERP、AI 大模型等功能。你的 ⭐️ Star ⭐️,是作者生发的动力!
Quick Overview
M-Mall is a WeChat mini-program e-commerce project built with WePY, a framework for developing WeChat mini-programs. It provides a complete shopping experience, including product browsing, cart management, and order processing, all within the WeChat ecosystem.
Pros
- Fully functional e-commerce solution tailored for WeChat mini-programs
- Built with WePY, offering better structure and maintainability compared to vanilla WeChat mini-program development
- Includes comprehensive features such as user authentication, product management, and order processing
- Well-organized codebase with clear separation of concerns
Cons
- Limited documentation, which may make it challenging for new developers to understand and contribute to the project
- Dependency on the WeChat ecosystem, limiting its portability to other platforms
- Potential scalability issues for larger e-commerce operations due to the constraints of mini-programs
- Lack of recent updates, which may indicate reduced maintenance and potential compatibility issues with newer WeChat APIs
Code Examples
// Example of a product list component
<template>
<view class="weui-panel weui-panel_access">
<view class="weui-panel__bd">
<navigator url="" class="weui-media-box weui-media-box_appmsg" hover-class="weui-cell_active" wx:for="{{ items }}" wx:key="">
<view class="weui-media-box__hd weui-media-box__hd_in-appmsg">
<image class="weui-media-box__thumb" src="{{ item.thumb_url }}" />
</view>
<view class="weui-media-box__bd weui-media-box__bd_in-appmsg">
<view class="weui-media-box__title">{{ item.name }}</view>
<view class="weui-media-box__desc">
<text class="text-orangered">¥ {{ item.price }}</text>
</view>
</view>
</navigator>
</view>
</view>
</template>
// Example of adding an item to the cart
addToCart(e) {
const id = e.currentTarget.dataset.id
App.WxService.navigateTo('/pages/cart/add', {
id: id
})
}
// Example of user authentication
async onLoad() {
try {
const token = await this.$parent.getToken()
console.log('token', token)
this.redirectTo()
} catch(err) {
console.log(err)
}
}
Getting Started
-
Clone the repository:
git clone https://github.com/skyvow/m-mall.git
-
Install dependencies:
cd m-mall npm install
-
Install WePY CLI globally:
npm install -g wepy-cli
-
Build and run the project:
wepy build --watch
-
Open WeChat Developer Tools, import the project, and select the
dist
folder as the project root.
Competitor Comparisons
微信小程序商城,微信小程序微店
Pros of wechat-app-mall
- More active development with frequent updates and contributions
- Comprehensive documentation and setup instructions
- Wider range of features including user management and order processing
Cons of wechat-app-mall
- More complex codebase, potentially harder to customize
- Heavier reliance on external services and APIs
Code Comparison
m-mall:
Page({
data: {
items: [],
hidden: !0,
hasMore: !0,
page: 1,
limit: 10,
},
onLoad() {
this.getList()
},
})
wechat-app-mall:
Page({
data: {
goodsDetail: {},
selectSizePrice: 0,
selectSizeOPrice: 0,
totalScoreToPay: 0,
shopNum: 0,
hideShopPopup: true,
buyNumber: 0,
buyNumMin: 1,
buyNumMax: 0,
},
onLoad(e) {
this.data.goodsId = e.id
this.data.kjJoinUid = e.kjJoinUid
this.getGoodsDetail(this.data.goodsId)
},
})
The wechat-app-mall code snippet shows a more detailed and feature-rich implementation, with additional properties and methods for handling product details, pricing, and shopping cart functionality. In contrast, the m-mall code is simpler and focuses on basic list loading functionality.
又一个小商城。litemall = Spring Boot后端 + Vue管理员前端 + 微信小程序用户前端 + Vue用户移动端
Pros of litemall
- More comprehensive e-commerce solution with admin, API, and Vue storefront
- Better documentation and setup instructions
- More active development and larger community (3.5k+ stars vs 1.5k+)
Cons of litemall
- More complex architecture, potentially harder to customize
- Heavier resource requirements due to its full-stack nature
- Steeper learning curve for developers new to the tech stack
Code Comparison
m-mall (WeChat Mini Program):
Page({
data: {
goods: {},
total: 0,
prompt: {
hidden: !0,
},
},
onLoad() {
this.getGoods()
},
})
litemall (Vue.js):
export default {
data() {
return {
goods: {},
total: 0,
loading: false
}
},
created() {
this.getGoods()
},
}
Both projects use similar data structures and lifecycle methods, but litemall uses Vue.js conventions while m-mall follows WeChat Mini Program patterns. litemall's code is more modular and easier to maintain in larger applications.
litemall offers a more complete e-commerce solution with better documentation and community support. However, it may be overkill for simpler projects where m-mall's lightweight approach could be more suitable. The choice between them depends on project requirements and developer expertise.
🔥 🎉newbee-mall是一套电商系统,包括基础版本(Spring Boot+Thymeleaf)、前后端分离版本(Spring Boot+Vue 3+Element-Plus+Vue-Router 4+Pinia+Vant 4) 、秒杀版本、Go语言版本、微服务版本(Spring Cloud Alibaba+Nacos+Sentinel+Seata+Spring Cloud Gateway+OpenFeign+ELK)。 前台商城系统包含首页门户、商品分类、新品上线、首页轮播、商品推荐、商品搜索、商品展示、购物车、订单结算、订单流程、个人订单管理、会员中心、帮助中心等模块。 后台管理系统包含数据面板、轮播图管理、商品管理、订单管理、会员管理、分类管理、设置等模块。
Pros of newbee-mall
- More comprehensive e-commerce features, including order management and payment integration
- Better documentation and setup instructions for easier deployment
- Active development with frequent updates and bug fixes
Cons of newbee-mall
- Larger codebase, potentially more complex to understand and maintain
- Requires more server resources due to its full-stack nature
- Less focus on mobile-specific optimizations compared to m-mall
Code Comparison
m-mall (WeChat Mini Program):
Page({
data: {
goods: [],
prompt: {
hidden: !0,
icon: '../../../assets/images/iconfont-empty.png',
},
},
onLoad() {
this.getList()
},
})
newbee-mall (Spring Boot):
@RestController
@Api(value = "v1", tags = "商品分类页面接口")
@RequestMapping("/api/v1")
public class NewBeeMallGoodsCategoryAPI {
@Resource
private NewBeeMallCategoryService newBeeMallCategoryService;
@GetMapping("/categories")
@ApiOperation(value = "获取分类数据", notes = "分类页面使用")
public Result<List<NewBeeMallIndexCategoryVO>> getCategories() {
List<NewBeeMallIndexCategoryVO> categories = newBeeMallCategoryService.getCategoriesForIndex();
return ResultGenerator.genSuccessResult(categories);
}
}
mall项目是一套电商系统,包括前台商城系统及后台管理系统,基于Spring Boot+MyBatis实现,采用Docker容器化部署。 前台商城系统 包含首页门户、商品推荐、商品搜索、商品展示、购物车、订单流程、会员中心、客户服务、帮助中心等模块。 后台管理系统包含商品管理、订单管理、会员管理、促销管理、运营管理、内容管理、统计报表、财务管理、权限管理、设置等模块。
Pros of mall
- More comprehensive e-commerce solution with backend and frontend components
- Actively maintained with frequent updates and a larger community
- Extensive documentation and deployment guides
Cons of mall
- More complex architecture, potentially steeper learning curve
- Heavier resource requirements due to its full-stack nature
Code Comparison
mall (Java):
@ApiOperation("Add product to cart")
@RequestMapping(value = "/add", method = RequestMethod.POST)
@ResponseBody
public CommonResult add(@RequestBody OmsCartItem cartItem) {
int count = cartItemService.add(cartItem);
if (count > 0) {
return CommonResult.success(count);
}
return CommonResult.failed();
}
m-mall (JavaScript):
addCart(params) {
return this.post('/cart/add', params)
}
delCart(id) {
return this.delete('/cart/delete', {
id: id
})
}
Key Differences
- mall is a full-stack Java-based e-commerce platform, while m-mall focuses on the frontend using WeChat Mini Program
- mall offers more features and scalability for larger projects
- m-mall is simpler and easier to get started with for small-scale applications
- mall has a more active community and regular updates
- m-mall's codebase is more concise and focused on frontend interactions
ruoyi-vue-pro 全新 Cloud 版本,优化重构所有功能。基于 Spring Cloud Alibaba + MyBatis Plus + Vue & Element 实现的后台管理系统 + 用 户小程序,支持 RBAC 动态权限、多租户、数据权限、工作流、三方登录、支付、短信、商城、CRM、ERP、AI 大模型等功能。你的 ⭐️ Star ⭐️,是作者生发的动力!
Pros of yudao-cloud
- More comprehensive and feature-rich enterprise-level application
- Actively maintained with frequent updates and contributions
- Extensive documentation and community support
Cons of yudao-cloud
- Higher complexity and steeper learning curve
- Requires more resources to run and deploy
Code Comparison
m-mall (JavaScript):
Page({
data: {
items: [],
hasMore: !1,
showLoading: !1,
start: 0,
limit: 10,
},
onLoad() {
this.getItems()
},
})
yudao-cloud (Java):
@RestController
@RequestMapping("/system/tenant")
@Validated
@Tag(name = "管理后台 - 租户")
public class TenantController {
@PostMapping("/create")
@Operation(summary = "创建租户")
@PreAuthorize("@ss.hasPermission('system:tenant:create')")
public CommonResult<Long> createTenant(@Valid @RequestBody TenantCreateReqVO createReqVO) {
return success(tenantService.createTenant(createReqVO));
}
}
The code comparison shows that m-mall is a simpler, frontend-focused project using JavaScript, while yudao-cloud is a more complex, backend-oriented Java application with advanced features like tenant management and role-based access control.
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual CopilotREADME
微信å°ç¨åº-ç§»å¨ç«¯å°åå
项ç®è¯´æï¼
- åºäºå¾®ä¿¡å°ç¨åºå¼åç䏿¬¾ç§»å¨ç«¯å°åå
- åºäº weui.wxssães6 åç«¯ææ¯å¼å
- åºäº wx-extend ç¬¬ä¸æ¹æ©å±æä»¶ï¼åé请æ±ãPromise APIã表åéªè¯ï¼
- åå° m-mall
- åå° m-mall-admin
ç®å½ç»æï¼
m-mall/
|-assets/ # éææä»¶
|- images/ # å¾ç
|- plugins/ # æä»¶
|- styles/ # æ ·å¼
|- ...
|-etc/ # é
ç½®æä»¶
|- config.js
|- ...
|-helpers/ # 叮婿件
|- HttpResource.js
|- HttpService.js
|- ...
|-pages/ # å°ç¨åºé¡µé¢ç¸å
³æä»¶
|- start
|- index.js
|- index.json
|- index.wxml
|- index.wxss
|- ...
|-app.js # å°ç¨åºé»è¾
|-app.json # å°ç¨åºå
Œ
±è®¾ç½®
|-app.wxss # å°ç¨åºå
Œ
±æ ·å¼è¡¨
|-...
é¡¹ç®æªå¾:














è´¡ç®
æä»»ä½æè§æå»ºè®®é½æ¬¢è¿æ issue
License
MIT
Top Related Projects
微信小程序商城,微信小程序微店
又一个小商城。litemall = Spring Boot后端 + Vue管理员前端 + 微信小程序用户前端 + Vue用户移动端
🔥 🎉newbee-mall是一套电商系统,包括基础版本(Spring Boot+Thymeleaf)、前后端分离版本(Spring Boot+Vue 3+Element-Plus+Vue-Router 4+Pinia+Vant 4) 、秒杀版本、Go语言版本、微服务版本(Spring Cloud Alibaba+Nacos+Sentinel+Seata+Spring Cloud Gateway+OpenFeign+ELK)。 前台商城系统包含首页门户、商品分类、新品上线、首页轮播、商品推荐、商品搜索、商品展示、购物车、订单结算、订单流程、个人订单管理、会员中心、帮助中心等模块。 后台管理系统包含数据面板、轮播图管理、商品管理、订单管理、会员管理、分类管理、设置等模块。
mall项目是一套电商系统,包括前台商城系统及后台管理系统,基于Spring Boot+MyBatis实现,采用Docker容器化部署。 前台商城系统包含首页门户、商品推荐、商品搜索、商品展示、购物车、订单流程、会员中心、客户服务、帮助中心等模块。 后台管理系统包含商品管理、订单管理、会员管理、促销管理、运营管理、内容管理、统计报表、财务管理、权限管理、设置等模块。
ruoyi-vue-pro 全新 Cloud 版本,优化重构所有功能。基于 Spring Cloud Alibaba + MyBatis Plus + Vue & Element 实现的后台管理系统 + 用户小程序,支持 RBAC 动态权限、多租户、数据权限、工作流、三方登录、支付、短信、商城、CRM、ERP、AI 大模型等功能。你的 ⭐️ Star ⭐️,是作者生发的动力!
Convert
designs to code with AI
Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.
Try Visual Copilot