search
Join Daphne's Discord Server

🛠️ Development

hashtag
Building React UI

If you want to modify React UI:

cd src/web
npm install
npm run dev      # Development server
npm run build    # Production build
npm run lint     # ESLint check

hashtag
Project Structure (Frontend)

src/web/src/
├── components/
│   ├── chat/           # Chat components
│   ├── admin/          # Admin editor components
│   └── ui/             # UI components
├── pages/
│   └── AdminEditor.tsx  # Admin editor page
├── hooks/
│   └── useNuiEvent.ts   # NUI event hook
├── lib/
│   ├── chat-utils.ts
│   ├── command-handler.ts
│   ├── discord-utils.ts
│   ├── icon-utils.tsx
│   └── utils.ts
├── types/
│   └── chat.types.ts
├── utils/
│   └── fetchNui.ts
├── config/
│   └── chat.config.ts
├── App.tsx
├── main.tsx
└── index.css

hashtag
Adding New Components

  1. Create component in src/web/src/components/

  2. Use TypeScript for type safety

  3. Follow existing patterns

  4. Use Tailwind CSS for styling

  5. Test with npm run dev

hashtag
Modifying Lua Backend

Client-side:

  • src/client/main.lua - Main client logic

  • src/client/utils.lua - Client utilities

Server-side:

  • src/server/main.lua - Main server logic

  • src/server/config-manager.lua - Config management

Framework:

  • src/framework/init.lua - Framework initialization

  • src/framework/detector.lua - Framework detection

  • src/framework/*.lua - Framework implementations

hashtag
Testing

Test Discord Integration:

Test Admin Editor:

Test Chat Modes:

hashtag
Code Style

  • Lua: Follow FiveM Lua style guide

  • TypeScript: Follow Airbnb style guide

  • Comments: Use clear, concise comments

  • Commit Messages: Use conventional commits

hashtag
External Links

hashtag
Community

  • Discord: https://discord.gg/daphne

  • Tebex: https://daphnestudio.net/

Previous📊 Performance Considerations

Last updated