CodeRanch - cMarket

A market resource for RedM (FiveM/RedM framework) that allows players to buy and sell items through an NPC-based shop with a modern Vue.js UI. Built by CodeRanch and depends on the cBase framework.

---

Dependencies

• cBase - Core framework (must be started before cMarket)

• oxmysql - MySQL library

• ox_target - Required only if Config.InteractionType is set to "target"

---

How It Works

1

NPCs are spawned at configured locations when the resource starts.

2

Players approach an NPC and interact using the configured interaction method.

3

A NUI (Vue.js) market panel opens, showing items available for purchase and items the player can sell.

4

The server validates inventory space, funds, and item counts before completing transactions.

5

All buy/sell transactions are logged via cBase:SendLog.

---

Configuration

All configuration is done in config.lua.

Image Path

Config.ImagePath = "nui://rsg-inventory/html/images/"

Path where item images are stored. Each item image should be named <itemName>.png. Change this to match your inventory resource's image directory.

Interaction Type

Config.InteractionType = "target" -- Options: "drawtext", "prompt", "target"

Type	Description
drawtext	Floating 3D text appears near the NPC. Press E to interact.
prompt	RedM native prompt system. Press E when the prompt appears.
target	Uses ox_target to show an interaction option on the NPC.

Blips

Config.Blips = {
    enabled = true,
}

Set enabled to false to hide market blips from the map.

Locations

Config.Locations = {
    {
        name = "Valentine Market",
        pedCoord = vector4(-239.15, 770.79, 118.1, 115.19),
        pedModel = "a_f_m_lowersdtownfolk_02"
    },
}

Field	Description
name	Display name for the blip and prompt label.
pedCoord	vector4(x, y, z, heading) - NPC spawn position and facing direction.
pedModel	The ped model hash name to use for the NPC.

To add a new location, copy an existing entry and change the values. To remove one, delete the entry from the table.

Buyable Items

Config.Market = {
    {
        itemName = "bread",
        price = 10,
    },
}

Field	Description
itemName	Must match the item name registered in your inventory/items system.
price	Cost in dollars. Cash is used first; if insufficient, bank is used.

Sellable Items

Config.SellableItems = {
    {
        itemName = "bread",
        price = 3
    },
}

Field	Description
itemName	The item name the player can sell.
price	Amount paid per unit. Payment is always added to cash.

Only items listed here can be sold. The sell page only shows items the player currently has in their inventory.

---

Localization

Language files are located in locales/locale.lua. Supported languages out of the box:

• English (en)

• Turkish (tr)

• Arabic (ar)

• French (fr)

• Italian (it)

• Spanish (es)

The active language is determined by cBase:GetLangPreference(). To add a new language, copy an existing Locales['xx'] block and translate the values.

The ui sub-table contains strings shown in the NUI panel (button labels, search placeholder, empty state messages).

---

File Structure

cMarket/
  config.lua            -- All configurable options
  fxmanifest.lua        -- Resource manifest
  locales/
    locale.lua          -- Multi-language strings
  client/
    main.lua            -- NPC spawning, interaction handling, NUI communication
  server/
    main.lua            -- Buy/sell logic, fund management, logging
    versionchecker.lua  -- Auto version check on startup
  ui/                   -- Built Vue.js NUI (production files)
  web/                  -- Vue.js source (development)

---

Transaction Flow

Buying

1

Player selects items and quantities in the UI, then confirms.

2

Server checks if the player can carry all selected items.

3

Server checks cash first. If cash covers the total, it is deducted from cash. Otherwise, the bank balance is checked.

4

Items are added to the player's inventory and a log is sent.

Selling

1

Player selects items they own and quantities, then confirms. Right-clicking an item sets quantity to max.

2

Server verifies the player actually has the items in the required amounts.

3

Items are removed and the total earnings are added to the player's cash.

---