Vietnam Commerce Kit
Editor.tsx - IDEKIT
Explorer
components
VibeEditor.tsx
Sidebar.tsx
app
tsVibeEditor.tsx
1import React from "react";
2
3export function VibeEditor() {
4return (
5<div className="vibe-station">
6Hello World
7</div>
8);
9}
main*0 errorsLn 5, Col 24UTF-8TypeScript React

Included Snippets

MoMo Payment

Create a verified MoMo payment signature and redirect URL.

momo-pay
1export async function createMomoPayment(amount: number, orderId: string) {
2 const signature = crypto.createHmac('sha256', MOMO_SECRET)
3 .update(`accessKey=${ACCESS_KEY}&amount=${amount}&extraData=&ipnUrl=${IPN_URL}&orderId=${orderId}&orderInfo=${ORDER_INFO}&partnerCode=${PARTNER_CODE}&redirectUrl=${REDIRECT_URL}&requestId=${orderId}&requestType=captureWallet`)
4 .digest('hex');
5
6 const response = await fetch('https://test-payment.momo.vn/v2/gateway/api/create', {
7 method: 'POST',
8 body: JSON.stringify({
9 partnerCode: PARTNER_CODE,
10 requestId: orderId,
11 amount,
12 signature
13 })
14 });
15
16 return response.json();
17}

ZaloPay QR

Generate a dynamic ZaloPay QR code for orders.

zalo-qr
1const embed_data = { redirecturl: 'https://mysite.com/success' };
2const items = [{ itemid: 'vibes_1', itemname: 'Vietnam Commerce Kit', itemprice: 199000, itemquantity: 1 }];
3const order = {
4 app_id: config.app_id,
5 app_trans_id: `${moment().format('YYMMDD')}_${transID}`,
6 app_user: 'user123',
7 app_time: Date.now(),
8 item: JSON.stringify(items),
9 embed_data: JSON.stringify(embed_data),
10 amount: 50000,
11 description: 'IdeKit Payment #123',
12 bank_code: 'zalopayapp',
13};
14
15const data = config.app_id + '|' + order.app_trans_id + '|' + order.app_user + '|' + order.amount + '|' + order.app_time + '|' + order.embed_data + '|' + order.item;
16order.mac = CryptoJS.HmacSHA256(data, config.key1).toString();
PRO KITby IdeKit

Vietnam Commerce Kit

The essential e-commerce starter for the Vietnamese market. Next.js 14 pre-integrated with MoMo, ZaloPay, and VNPay. Includes localized checkout flows, QR code generation, and province/ward address selectors.

Tech Stack
Next.js 14MoMo APIZaloPay SDKVNPayTailwind
$149
One-time payment
Availability
50 / 50 left

Secured by Stripe