# Developer Overview

Complete guide to developing with VibesEZ-Laptop.

## What Can You Build?

VibesEZ-Laptop provides comprehensive APIs for building:

### External Applications

Apps that run inside the VibesEZ-Laptop ecosystem

* Games and entertainment
* Productivity tools
* Analytics and reporting
* Business applications
* Community features
* Integration tools

### Server Integrations

Integrate your resources with VibesEZ-Laptop

* Get/send crypto
* Manage wallets
* Trigger events
* Query data
* Monitor activity

### Framework Adaptations

Adapt VibesEZ-Laptop for different frameworks

* QBCore integration
* ESX integration
* Custom framework support
* Hybrid frameworks

## Development Paths

### Path 1: Creating an App Store Application

**Best for:** Standalone features that enhance player experience

**Tools Needed:**

* JavaScript/TypeScript knowledge
* React framework familiarity (optional but recommended)
* API documentation
* VibesEZ-Laptop installed

**Steps:**

1. Plan your app
2. Set up development environment
3. Create app entry
4. Register with app store
5. Test thoroughly
6. Publish to app store

**Example:** Music player, social network, trading terminal

***

### Path 2: Server Integration

**Best for:** Connecting existing resources to crypto/wallet system

**Tools Needed:**

* Lua knowledge
* Server resource experience
* VibesEZ-Laptop exports knowledge
* FXServer understanding

**Steps:**

1. Understand VibesEZ exports
2. Create resource that uses exports
3. Set up server events
4. Test integration
5. Deploy to production

**Example:** Job rewards, criminal activity, business system

***

### Path 3: Framework Customization

**Best for:** Adapting VibesEZ-Laptop to your framework

**Tools Needed:**

* Deep Lua understanding
* Framework internals knowledge
* Database experience
* FXServer expertise

**Steps:**

1. Fork/modify VibesEZ-Laptop code
2. Adapt database layer
3. Modify event hooks
4. Test extensively
5. Maintain compatibility

**Example:** ESX server, custom framework

***

## Core Concepts

### Wallet System

Each player has a wallet per cryptocurrency:

* Unique address per wallet
* Secure storage
* Transaction history
* Balance tracking
* Transfer capability

### App Architecture

Apps run in isolated sandbox:

* Can't access other app data (unless permitted)
* Restricted permissions
* Event-based communication
* Secure data flow

### Event System

Apps communicate through events:

* Server → Client → App
* App → Client → Server
* Cross-app messaging (limited)
* System events

***

## Getting Started

### 1. Set Up Environment

**Install Requirements:**

* FXServer (latest version)
* Git
* Node.js (for web development)
* Text editor (VS Code recommended)

**Clone repository:**

```bash
git clone <VibesEZ-Laptop-repo>
cd VibesEZ-Laptop
```

### 2. Read the Documentation

* This overview
* [Creating Your First App](/vibesez/docs/laptop/for-developers/creating-apps.md)
* [API Reference](/vibesez/docs/laptop/for-developers/api-reference.md)
* [Integration Guide](https://github.com/VibesEZ/VibesEZ-Laptop/blob/main/docs/developer/integration.md)

### 3. Explore Examples

Check the examples folder:

* Simple calculator app
* Basic note-taking app
* Crypto ticker app
* Social messenger concept

### 4. Start Development

Choose your path and start building!

***

## Technology Stack

### Server-Side

* **Language:** Lua
* **Framework:** FXServer CFX
* **Database:** MySQL via oxmysql
* **Events:** Game event system

### Client-Side

* **Language:** JavaScript/TypeScript
* **Framework:** React (recommended)
* **Styling:** Tailwind CSS (recommended)
* **Build:** Vite (recommended)
* **NUI:** Custom NUI communication

### External Apps (Web)

* **Language:** TypeScript/JavaScript
* **Runtime:** Browser environment
* **Framework:** React optional but recommended
* **Styling:** CSS/Tailwind
* **Build:** Vite or Webpack

***

## API Overview

### Server API

```lua
-- Add cryptocurrency to player wallet
exports['VibesEZ-Laptop']:AddCrypto(identifier, currency, amount, note)

-- Create a transfer between players
exports['VibesEZ-Laptop']:TransferCrypto(from, to, currency, amount, note)

-- Get wallet balance
exports['VibesEZ-Laptop']:GetBalance(identifier, currency)

-- Get player wallets
exports['VibesEZ-Laptop']:GetWallets(identifier)
```

### Client API

```lua
-- Register an app
exports['VibesEZ-Laptop']:RegisterApp({
    id = 'unique_id',
    label = 'App Name',
    event = 'event_name'
})

-- Open/Close laptop
TriggerEvent('laptop:client:open')
TriggerEvent('laptop:client:close')

-- Send message to app
SendNUIMessage({
    action = 'your_action',
    data = { ... }
})
```

### NUI (Web) API

```javascript
// Listen for server messages
window.addEventListener('message', (event) => {
    const { action, data } = event.data;
    // Handle message
});

// Send message to server
fetch(`https://${GetParentResourceName()}/SendMessage`, {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ action: 'action_name', data: {} })
});
```

***

## Best Practices

✓ **Security First**

* Validate all inputs
* Sanitize user data
* Never trust client data
* Use server-side verification

✓ **Performance Optimized**

* Minimize database queries
* Cache when possible
* Optimize JavaScript
* Test on low-end machines

✓ **User Experience**

* Responsive design
* Clear error messages
* Quick load times
* Intuitive interface

✓ **Code Quality**

* Well-documented code
* Consistent style
* Error handling
* Testing coverage

✓ **Compatibility**

* Test with vanilla VibesEZ-Laptop
* Support multiple frameworks if possible
* Version compatibility
* Graceful degradation

***

## Resources

### Official Documentation

* [Creating Apps](/vibesez/docs/laptop/for-developers/creating-apps.md)
* [API Reference](/vibesez/docs/laptop/for-developers/api-reference.md)
* [Integration Guide](https://github.com/VibesEZ/VibesEZ-Laptop/blob/main/docs/developer/integration.md)
* [Best Practices](/vibesez/docs/laptop/for-developers/best-practices.md)

### External Resources

* FXServer Documentation
* React Documentation
* Tailwind CSS Guide
* Vite Guide

### Community

* Discord server (if available)
* GitHub discussions
* Community forums
* Example repositories

***

## Getting Help

### Documentation

Start with official documentation, then examples

### Community

Post in community forums or Discord

### Issues

Report bugs on GitHub with full details

### Contact

Reach out to developer team for specific questions

***

## Next Steps

Ready to start?

1. **App Developer?** → [Creating Your First App](/vibesez/docs/laptop/for-developers/creating-apps.md)
2. **Server Integrator?** → [Integration Guide](https://github.com/VibesEZ/VibesEZ-Laptop/blob/main/docs/developer/integration.md)
3. **Need API Details?** → [API Reference](/vibesez/docs/laptop/for-developers/api-reference.md)
4. **Want Examples?** → [Examples & Templates](/vibesez/docs/laptop/for-developers/examples.md)

***

Happy developing!


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://vibesez.gitbook.io/vibesez/docs/laptop/for-developers/overview.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.