← الرئيسية

~/athlawi/stack

اللغات التي أكتب بها

ثلاث عشرة لغة وأداة تمرّ بها الشغلة من أول وسم في الواجهة إلى آخر صفّ في قاعدة البيانات. لكل واحدة: ما هي، لمَ وُجدت، كيف تبدأ بها، مثال قصير كما تراه في محرّرك، وروابط مصادرها الأصلية.

athlawi — stack.code-workspace13 files
uiindex.htmlهيود صغير: وسم لكل شيء، وملف الكود يُربط في آخر سطر
!doctype html><html lang="ar" dir="rtl">  <body>    <div id="hud">      <span class="cash">$0</span>      <button id="close">إغلاق</button>    </div>    <script src="app.js"></script>  </body></html>
● HTMLلغة ترميزمنذ 1991المتصفّح — وفي نافذة NUI فوق اللعبةافتح المرجع ↓

01/ui/ui/index.html

HTML

هيكل كل صفحة ويب

  • منذ1991
  • منTim Berners-Lee · WHATWG
  • النوعلغة ترميز
  • أين تعملالمتصفّح — وفي نافذة NUI فوق اللعبة

ما هي؟

HTML (لغة ترميز النصّ التشعّبي) ليست لغة برمجة بل لغة وصف: تخبر المتصفّح ما هذا الشيء — عنوان، فقرة، زر، صورة، قائمة — عبر وسوم مثل <button> و <img>. كل ما تراه في أي صفحة ويب يبدأ من شجرة وسوم HTML يحوّلها المتصفّح إلى ما يُعرض. ظهرت عام 1991 على يد تيم بيرنرز-لي، وتُطوَّر اليوم كمعيار حيّ عند WHATWG.

وش فايدتها؟

  1. 01الأساس الذي تقف عليه CSS و JavaScript: بلا هيكل لا يوجد ما يُنسَّق ولا ما يُحرَّك
  2. 02الوسم الصحيح يعطي المعنى مجانًا — زرّ حقيقي يعمل بلوحة المفاتيح وقارئ الشاشة بلا كود إضافي
  3. 03النماذج والصور والفيديو والروابط كلها مدمجة في اللغة نفسها

كيف تستخدمها؟

ملف نصّي بامتداد .html تفتحه بأي متصفّح — لا يحتاج تثبيتًا ولا ترجمة. تكتب الوسوم متداخلة كالصناديق: html يحوي head و body، و body يحوي ما يُعرض. في FiveM يُحمَّل الملف نفسه داخل نافذة NUI بسطر واحد في fxmanifest.

عندنا

كل واجهة يفتحها اللاعب عندنا — الجرد، الهيود، القائمة — صفحة HTML حقيقية تعمل فوق اللعبة.

المصادر الأصليةالمعيار الحيّ (WHATWG)مرجع MDNNUI في FiveM
ui/index.html
!doctype html><html lang="ar" dir="rtl">  <body>    <div id="hud">      <span class="cash">$0</span>      <button id="close">إغلاق</button>    </div>    <script src="app.js"></script>  </body></html>

هيود صغير: وسم لكل شيء، وملف الكود يُربط في آخر سطر

الطرفية — كيف تشغّله
$ npx serve uiServing ui at http://localhost:3000

02/ui/ui/style.css

CSS

الشكل واللون والحركة

  • منذ1996
  • منHåkon Wium Lie · W3C
  • النوعلغة تنسيق
  • أين تعملالمتصفّح — وكل واجهة NUI

ما هي؟

CSS (أوراق الأنماط المتتالية) تصف كيف يبدو ما وصفه HTML: الألوان والمسافات والخطوط والتخطيط والحركة. «المتتالية» تعني أن القواعد تتراكب ويتغلّب بعضها على بعض بترتيب معروف، فتكتب قاعدة عامّة ثم تخصّص. اقترحها هوكون ويوم لي عام 1994 وصدر معيارها الأول 1996، وهي اليوم تملك شبكات وتخطيطات مرنة وحركات بلا سطر JavaScript.

وش فايدتها؟

  1. 01تفصل الشكل عن المحتوى: صفحة واحدة تُعاد صياغتها كاملة بتغيير ملف الأنماط
  2. 02التخطيطات المتجاوبة — نفس الواجهة على شاشة 1080p وعلى الجوال — تُكتب بشرط واحد
  3. 03الحركات والانتقالات تعمل على كرت الشاشة، أنعم وأرخص من تحريكها بالكود

كيف تستخدمها؟

تربط ملف .css بالصفحة عبر وسم link، ثم تكتب محدِّدًا (من تستهدف) وبين قوسين الخصائص (ماذا تغيّر). المتغيّرات والوحدات النسبية ووسائط الاستعلام هي ما يجعل الواجهة تصمد على كل مقاس.

عندنا

هيود بلا خلفية ثقيلة، وقائمة تنفتح بحركة لا تُحسّ عند 60 إطارًا — كلها CSS.

المصادر الأصليةمرجع MDNW3C — CSSLearn CSS (web.dev)
ui/style.css
#hud {  position: fixed;  inset-inline-end: 24px;  bottom: 24px;  padding: 12px 16px;  border-radius: 12px;  background: rgb(7 10 17 / 0.8);  color: #dde4f0;  font: 500 14px system-ui;}#hud .cash { color: #3ba8f5; }

الهيود يثبت في ركن الشاشة، والرصيد بلون العلامة — قاعدتان فقط

الطرفية — كيف تشغّله
$ npx serve uiServing ui at http://localhost:3000

03/ui/ui/app.js

JavaScript

اللغة التي تُحرّك الويب

  • منذ1995
  • منBrendan Eich · Netscape — ECMA-262
  • النوعلغة برمجة
  • الأنواعديناميكية الأنواع
  • أين تعملالمتصفّح، والخادم عبر Node.js، وسكربتات FiveM

ما هي؟

JavaScript هي لغة البرمجة الوحيدة التي تفهمها المتصفّحات أصلًا، ولذلك هي الطريقة التي تستجيب بها الصفحة: ضغطة زر، جلب بيانات، تحديث رقم بلا إعادة تحميل. كتبها بريندان آيك في عشرة أيام عام 1995، وتُقنَّن اليوم باسم ECMAScript بإصدار سنوي. خرجت من المتصفّح إلى الخادم مع Node.js عام 2009، وتشغّل بوتات ديسكورد، وتُكتب بها سكربتات FiveM كاملة.

وش فايدتها؟

  1. 01لغة واحدة للواجهة والخادم والبوت — نفس المعرفة تُستعمل في ثلاثة أماكن
  2. 02أكبر منظومة مكتبات في البرمجة (npm)، فنادرًا ما تبني شيئًا من الصفر
  3. 03غير متزامنة بطبيعتها: تنتظر ردّ الشبكة بلا تجميد الواجهة

كيف تستخدمها؟

في المتصفّح تضيفها بوسم script؛ على الخادم تشغّلها بأمر node. لا تحتاج ترجمة، والأخطاء تظهر في وحدة تحكّم المتصفّح فورًا. في FiveM يُعلَن الملف بـ client_script أو server_script في fxmanifest وتصل إليك كل الـ natives كدوالّ عادية.

عندنا

تشغّل واجهات NUI من الداخل وتستقبل ردّ اللعبة، وتدير بوت TheC System على ديسكورد.

المصادر الأصليةمرجع MDNمعيار ECMAScriptjavascript.info
ui/app.js
// رسالة من اللعبة → تحديث الرصيد على الشاشةwindow.addEventListener("message", (e) => {  if (e.data.type !== "cash") return;  document.querySelector(".cash").textContent = "$" + e.data.value;});// زرّ الإغلاق → ردّ إلى سكربت Luadocument.getElementById("close").onclick = () =>  fetch("https://" + GetParentResourceName() + "/close", { method: "POST" });

الاتجاهان: اللعبة ترسل رسالة، والواجهة تردّ بطلب — هذا جسر NUI كله

الطرفية — كيف تشغّله
$ node app.js$ npm install discord.jsadded 32 packages

04/ui/lib/players.ts

TypeScript

JavaScript مع شبكة أمان

  • منذ2012
  • منAnders Hejlsberg · Microsoft
  • النوعلغة برمجة فوق JavaScript
  • الأنواعثابتة الأنواع
  • أين تعملأينما تعمل JavaScript — تُترجم إليها قبل التشغيل

ما هي؟

TypeScript هي JavaScript نفسها مضافًا إليها الأنواع: تصف شكل البيانات — هذا رقم، هذا نصّ، هذا لاعب له معرّف واسم — فيكتشف المحرّر الأخطاء وأنت تكتب لا بعد التشغيل. كل كود JavaScript هو كود TypeScript صالح. طوّرتها مايكروسوفت عام 2012 على يد أندرس هيلسبرغ مصمّم C#، وهي اليوم اللغة الافتراضية لمشاريع React و Next.js الجادّة.

وش فايدتها؟

  1. 01الخطأ يظهر تحت السطر في المحرّر بدل أن يظهر عند لاعب في منتصف الجولة
  2. 02الإكمال التلقائي يعرف كل حقل في كل كائن، فتكتب أسرع بأخطاء أقل
  3. 03إعادة الهيكلة آمنة: تغيّر اسم حقل فيدلّك على كل موضع يستعمله

كيف تستخدمها؟

ملفات .ts أو .tsx، وأداة tsc أو الإطار (Next.js) تترجمها إلى JavaScript. تبدأ بإضافة نوع لدالّة واحدة ثم تتوسّع؛ لا يلزمك تحويل المشروع دفعة واحدة.

عندنا

هذا الموقع كله TypeScript — كل نصّ فيه بلغتين نوعه T، فلا يمكن أن تُنسى ترجمة.

المصادر الأصليةالموقع الرسميالدليل (Handbook)
lib/players.ts
type Player = { id: number; name: string; cash: number };function richest(players: Player[]): Player | undefined {  return [...players].sort((a, b) => b.cash - a.cash)[0];}const top = richest([{ id: 1, name: "Ryan", cash: 2500 }]);console.log(top?.name); // "Ryan"

لو مرّرت لاعبًا بلا cash يرفض المحرّر السطر قبل أن يعمل

الطرفية — كيف تشغّله
$ npx tsc --noEmitFound 0 errors.

05/ui/ui/Cash.tsx

React

واجهات من مكوّنات

  • منذ2013
  • منJordan Walke · Meta
  • النوعمكتبة واجهات (JSX / TSX)
  • أين تعملالمتصفّح — وعلى الخادم مع Next.js

ما هي؟

React ليست لغة بل مكتبة JavaScript تبني الواجهة من مكوّنات: دوالّ صغيرة كل واحدة ترجع قطعة من الشاشة. تكتب الشكل داخل الكود بصيغة JSX — تبدو كـ HTML لكنها JavaScript — وتخبر React بالحالة، فتعيد رسم ما تغيّر فقط. أصدرتها ميتا عام 2013 وصارت الطريقة الأشيع لبناء الواجهات التفاعلية.

وش فايدتها؟

  1. 01الواجهة دالّة للحالة: تغيّر البيانات فتتغيّر الشاشة، بلا تتبّع يدوي لكل عنصر
  2. 02المكوّن يُكتب مرة ويُستعمل في كل مكان — زرّ واحد، عشر شاشات
  3. 03منظومة ضخمة: توجيه وحركة ونماذج، وكلها تتكلّم نفس اللغة

كيف تستخدمها؟

تحتاج خطوة بناء (Vite أو Next.js) تحوّل JSX إلى JavaScript. تبدأ بمكوّن واحد يعيد وسمًا، ثم تضيف useState لما يتغيّر و useEffect لما يتصل بالعالم الخارجي.

عندنا

واجهات NUI الأكبر عندنا مبنية بها، وهذا الموقع نفسه React.

المصادر الأصليةالموقع الرسميتعلّم React
ui/Cash.tsx
import { useState } from "react";export function Cash({ value }: { value: number }) {  const [open, setOpen] = useState(false);  return (    <button className="cash" onClick={() => setOpen(!open)}>      ${value.toLocaleString()} {open ? "▲" : "▼"}    </button>  );}

مكوّن واحد: حالة (مفتوح أم لا) وشكل يتبعها — لا سطر يعدّل الشاشة يدويًّا

الطرفية — كيف تشغّله
$ npm create vite@latest ui -- --template react-ts$ npm run devVITE ready in 312 ms

06/ui/app/servers/page.tsx

Next.js

React على الخادم

  • منذ2016
  • منVercel
  • النوعإطار عمل
  • أين تعملالخادم والمتصفّح معًا

ما هي؟

Next.js إطار مبني فوق React يتولّى ما لا تتولّاه React: الصفحات والمسارات، والرندر على الخادم قبل وصول الصفحة للمتصفّح، والصور والخطوط وبيانات محرّكات البحث. الملف في مجلّد app يصير صفحة تلقائيًا، والمكوّن يُنفَّذ على الخادم افتراضيًا فلا يصل التوكن أو الاستعلام إلى المتصفّح.

وش فايدتها؟

  1. 01الصفحة تصل مرسومة: أسرع في الظهور وأوضح لمحرّكات البحث
  2. 02كود الخادم وكود المتصفّح في مشروع واحد بلغة واحدة
  3. 03النشر بأمر واحد على Vercel، مع صور مضغوطة وخطوط مستضافة تلقائيًا

كيف تستخدمها؟

npx create-next-app ينشئ المشروع، و npm run dev يشغّله محليًّا. مجلّد app فيه layout.tsx للإطار العام و page.tsx لكل صفحة؛ أضف "use client" فوق أي مكوّن يحتاج تفاعلًا في المتصفّح.

عندنا

هذا الموقع: Next.js 16 — جلب أسماء مالكي السيرفرات من ديسكورد يحدث على الخادم ولا يرى المتصفّح التوكن.

المصادر الأصليةالموقع الرسميالتوثيق
app/servers/page.tsx
// يُنفَّذ على الخادم — لا يصل هذا الطلب إلى المتصفّحexport const metadata = { title: "السيرفرات" };export default async function Servers() {  const list = await fetch("https://api.example.com/servers", {    next: { revalidate: 3600 },  }).then((r) => r.json());  return <ul>{list.map((s) => <li key={s.id}>{s.name}</li>)}</ul>;}

صفحة كاملة في ملف: بياناتها تُجلب على الخادم وتُخزَّن ساعة، والمتصفّح يستلم HTML جاهزًا

الطرفية — كيف تشغّله
$ npx create-next-app@latest$ npm run dev▲ Next.js — Local: http://localhost:3000

07/server/bot/index.js

Node.js

JavaScript خارج المتصفّح

  • منذ2009
  • منRyan Dahl · OpenJS Foundation
  • النوعبيئة تشغيل
  • أين تعملالخادم وسطر الأوامر

ما هي؟

Node.js تأخذ محرّك JavaScript الذي في متصفّح Chrome وتشغّله كبرنامج مستقلّ على جهازك أو خادمك، مع وصول إلى الملفات والشبكة. بها تُبنى خوادم الويب وبوتات ديسكورد وأدوات البناء نفسها (npm و Vite و Next). أنشأها رايان دال عام 2009، ونموذجها غير المتزامن يجعلها تخدم آلاف الاتصالات بخيط واحد.

وش فايدتها؟

  1. 01نفس لغة الواجهة تكتب بها البوت والخادم
  2. 02npm: أي مكتبة تحتاجها بأمر تثبيت واحد
  3. 03يشغّل كل أدوات الويب الحديثة — لا تهرب منه حتى لو لم تكتب به

كيف تستخدمها؟

ثبّته من الموقع الرسمي، ثم node file.js يشغّل أي ملف. npm init يبدأ مشروعًا و npm install يجلب المكتبات. للبوتات مكتبة discord.js هي الطريق المعتاد.

عندنا

بوت TheC System الذي يربط السيرفر بمجتمعه يعمل على Node.js.

المصادر الأصليةالموقع الرسميالتوثيقdiscord.js
bot/index.js
import { Client, GatewayIntentBits } from "discord.js";const bot = new Client({ intents: [GatewayIntentBits.Guilds] });bot.on("ready", () => console.log("online as " + bot.user.tag));bot.on("interactionCreate", (i) => {  if (i.isChatInputCommand() && i.commandName === "ping") i.reply("pong");});bot.login(process.env.TOKEN);

بوت كامل يردّ على أمر /ping — والتوكن من متغيّر بيئة لا من الكود

الطرفية — كيف تشغّله
$ node bot/index.jsonline as TheC System#0001

08/game/client.lua

Lua

لغة اللعبة نفسها

  • منذ1993
  • منPUC-Rio · Roberto Ierusalimschy
  • النوعلغة برمجة
  • الأنواعديناميكية الأنواع
  • أين تعملداخل اللعبة: كلاينت وسيرفر FiveM

ما هي؟

Lua لغة صغيرة وسريعة صُمّمت لتُضمَّن داخل برامج أخرى، ولهذا اختارتها ألعاب كثيرة — World of Warcraft و Roblox و FiveM. اللغة كلها بضع كلمات محجوزة وبنية واحدة للبيانات (الجدول)، فتُتعلَّم في أيام وتبقى قابلة للقراءة. وُلدت في جامعة PUC-Rio البرازيلية عام 1993، و FiveM يشغّل إصدارها 5.4 مع إضافات خاصّة به.

وش فايدتها؟

  1. 01كل native في اللعبة دالّة Lua جاهزة — من إنشاء سيارة إلى قراءة موقع اللاعب
  2. 02الكود يُعاد تحميله بأمر restart بلا إغلاق السيرفر
  3. 03أغلب سكربتات FiveM المفتوحة مكتوبة بها، فما تتعلّمه يفتح لك كل ما بُني قبلك

كيف تستخدمها؟

ملف client.lua يعمل على جهاز اللاعب و server.lua على السيرفر، ويُعلَنان في fxmanifest.lua. الأحداث (TriggerServerEvent / RegisterNetEvent) هي الجسر بينهما، والقاعدة الذهبية: القرار الذي يمسّ المال أو الحماية يُتَّخذ على السيرفر دائمًا.

عندنا

كل سكربتاتنا داخل اللعبة — الجرد والقتال والباركور والإدارة — مكتوبة بها.

المصادر الأصليةالموقع الرسميمرجع Lua 5.4مرجع natives في FiveMدليل السكربتات في FiveM
client.lua
RegisterCommand('car', function(source, args)    local model = joaat(args[1] or 'adder')    RequestModel(model)    while not HasModelLoaded(model) do Wait(0) end    local ped = PlayerPedId()    local veh = CreateVehicle(model, GetEntityCoords(ped), GetEntityHeading(ped), true, false)    SetPedIntoVehicle(ped, veh, -1)    SetModelAsNoLongerNeeded(model)end)

أمر car يطلب الموديل وينتظره ثم يضعك في السيارة — الدرس الأول في كل سكربت

الطرفية — كيف تشغّله
> ensure athlawi_carStarted resource athlawi_car> restart athlawi_car

09/server/sql/accounts.sql

SQL

ما يبقى بعد إعادة التشغيل

  • منذ1974
  • منIBM · Chamberlin & Boyce — ISO
  • النوعلغة استعلام
  • أين تعملقاعدة البيانات: MySQL / MariaDB

ما هي؟

SQL اللغة التي تكلّم بها قواعد البيانات العلائقية: تصف ما تريد (كل الحسابات التي رصيدها فوق ألف) لا كيف تجلبه، والمحرّك يتكفّل بالباقي. نشأت في IBM عام 1974 وصارت معيارًا دوليًّا، وتفهمها MySQL و MariaDB و PostgreSQL بفروق طفيفة. في FiveM هي مكان الأرصدة والرُّتب والهويات — كل ما يجب أن يبقى بعد خروج اللاعب.

وش فايدتها؟

  1. 01البيانات تبقى بعد إعادة تشغيل السيرفر وتحديث السكربت
  2. 02سؤال واحد يرتّب ويجمع ويصفّي ملايين الصفوف في ملّي ثوانٍ
  3. 03القيود (مفتاح أساسي، لا يقبل الفراغ) تمنع البيانات الخاطئة قبل أن تُكتب

كيف تستخدمها؟

تأتي MariaDB مع txAdmin غالبًا وتديرها بأداة مثل HeidiSQL. من Lua تُنفَّذ الاستعلامات عبر oxmysql بمعاملات لا بلصق النصوص — هذا الفرق بين سيرفر آمن وسيرفر يُخترق بحقن استعلام.

عندنا

الصرّاف ورانك PVP وحرب العشائر والهويات — كل واحد له جداوله.

المصادر الأصليةتوثيق MariaDBتوثيق MySQLoxmysql
sql/accounts.sql
CREATE TABLE accounts (  citizenid VARCHAR(50) PRIMARY KEY,  cash      INT NOT NULL DEFAULT 0,  bank      INT NOT NULL DEFAULT 0);-- سحب آمن: لا ينقص الرصيد إلا إذا كان يكفيUPDATE accounts SET bank = bank - 500WHERE citizenid = 'ABC123' AND bank >= 500;SELECT citizenid, bank FROM accounts ORDER BY bank DESC LIMIT 10;

جدول، وسحب لا يسمح بالسالب، وقائمة الأغنى — ثلاث عمليات تراها في كل سيرفر

الطرفية — كيف تشغّله
$ mariadb -u root -p qbx < sql/accounts.sql> SELECT COUNT(*) FROM accounts;1284

10/data/config.json

JSON

اللغة المشتركة بين كل ما سبق

  • منذ2001
  • منDouglas Crockford — RFC 8259
  • النوعصيغة بيانات
  • أين تعملفي كل مكان: ملفات إعدادات، ردود واجهات، رسائل بين الكلاينت والسيرفر

ما هي؟

JSON ليس لغة برمجة بل صيغة لكتابة البيانات نصًّا: كائنات بين أقواس معقوفة، وقوائم بين أقواس مربّعة، ونصوص وأرقام وصح/خطأ. اشتُقّ من صيغة كائنات JavaScript ونشره دوغلاس كروكفورد أوائل الألفية، وصار الطريقة التي تتبادل بها البرامج بياناتها بغضّ النظر عن لغتها: يكتبه Rust ويقرؤه Lua ويعرضه المتصفّح.

وش فايدتها؟

  1. 01يقرؤه الإنسان والآلة معًا — ملف إعدادات يعدّله صاحب السيرفر بلا برمجة
  2. 02كل لغة تملك json.encode و json.decode جاهزتين
  3. 03صارم: فاصلة زائدة تكسره، وهذه الصرامة هي ما يجعله موثوقًا

كيف تستخدمها؟

ملف بامتداد .json، مفاتيح بين علامتي اقتباس مزدوجتين دائمًا، ولا تعليقات. في Lua: json.decode(LoadResourceFile(...)) وفي JavaScript: JSON.parse. قائمة سيرفرات dropship نفسها ملف JSON يُجلب من الشبكة.

عندنا

إعدادات السكربتات، ونصوص اللغتين في dropship (en.json و ar.json).

المصادر الأصليةjson.orgالمعيار RFC 8259JSON في MDN
config.json
{  "name": "ATM System",  "version": "1.2.0",  "limits": { "withdraw": 5000, "deposit": 20000 },  "locations": [    { "id": "bank_1", "x": 150.2, "y": -1040.4, "z": 29.3 }  ]}

إعدادات صرّاف: نصّ ورقم وكائن وقائمة — كل أنواع JSON في ثمانية أسطر

الطرفية — كيف تشغّله
$ node -p "require('./config.json').limits"{ withdraw: 5000, deposit: 20000 }

11/desktop/src/ping.rs

Rust

سرعة C بلا أخطاء الذاكرة

  • منذ2015
  • منGraydon Hoare · Mozilla — Rust Foundation
  • النوعلغة برمجة نظم
  • الأنواعثابتة الأنواع مع ضمان الذاكرة
  • أين تعملبرامج سطح المكتب والأدوات: تُترجم إلى ملف تنفيذي

ما هي؟

Rust تُترجم إلى كود آلة مباشر كـ C و C++، لكن مترجمها يمنع أخطاء الذاكرة والتزامن قبل التشغيل عبر نظام الملكية: كل قيمة لها مالك واحد، والمترجم يرفض أي كود قد يقرأ ذاكرة محرَّرة. بدأت في موزيلا وصدر إصدارها الأول 2015، وتُستعمل اليوم في نواة لينكس ومتصفّح Firefox وأدوات مثل dropship.

وش فايدتها؟

  1. 01ملف exe واحد بلا وقت تشغيل ولا تثبيت — يعمل على أي ويندوز
  2. 02الأداء عند حدّ العتاد، وهذا ما تحتاجه أداة تقيس البينق كل ثانية
  3. 03«إذا تُرجم فغالبًا يعمل»: المترجم صارم لكنه يمسك الأخطاء بدلك

كيف تستخدمها؟

rustup يثبّت المترجم و cargo يدير المشروع: cargo new ثم cargo run. المكتبات (crates) من crates.io، والكتاب الرسمي مجاني ويكفي للبداية. توقّع أن تتعارك مع المترجم في الأسبوع الأول ثم يصير أفضل مراجع لك.

عندنا

dropship — النسخة العربية: الواجهة بـ egui، وقياس البينق عبر iphlpapi، وحجب السيرفرات على مستوى جدار حماية ويندوز.

المصادر الأصليةالموقع الرسميالكتاب الرسميegui
src/ping.rs
use std::time::Instant;fn ping(host: &str) -> Result<u32, String> {    let started = Instant::now();    send_echo(host)?; // ICMP عبر iphlpapi    Ok(started.elapsed().as_millis() as u32)}fn main() {    match ping("34.88.0.1") {        Ok(ms) => println!("{ms} ms"),        Err(e) => eprintln!("failed: {e}"),    }}

الدالّة ترجع إمّا رقمًا أو خطأً، والمترجم يجبرك على التعامل مع الحالتين — هكذا يُقاس البينق في dropship

الطرفية — كيف تشغّله
$ cargo run --releaseFinished release [optimized] target(s)34.88.0.1: 24 ms

12/game/Hello.cs

C#

الخيار الثالث في FiveM

  • منذ2000
  • منAnders Hejlsberg · Microsoft
  • النوعلغة برمجة
  • الأنواعثابتة الأنواع
  • أين تعمل‎.NET — ومنه سكربتات FiveM وألعاب Unity

ما هي؟

C# لغة مايكروسوفت العامّة: كائنية، ثابتة الأنواع، تعمل على منصّة .NET. تُكتب بها برامج ويندوز وخوادم الويب وألعاب Unity، و FiveM يدعمها إلى جانب Lua و JavaScript: يُترجم السكربت إلى dll يُحمَّل داخل المورِد. أقلّ انتشارًا في مجتمع FiveM، لكنها الأقرب لمن جاء من عالم Unity أو الخوادم.

وش فايدتها؟

  1. 01أنواع صارمة وأدوات مايكروسوفت الكاملة: Visual Studio يمسك الخطأ قبل التشغيل
  2. 02أسرع من Lua في الحسابات الثقيلة على السيرفر
  3. 03نفس اللغة تخدمك في Unity وفي تطبيقات سطح المكتب

كيف تستخدمها؟

تحتاج .NET SDK ومشروعًا يبني dll، ثم تعلنه في fxmanifest بـ client_script أو server_script مع لاحقة .net.dll. الـ natives تصل عبر CitizenFX.Core.Native.API.

عندنا

لا نستعملها في سكربتاتنا الحالية — نذكرها لأنها الخيار الثالث الرسمي في FiveM.

المصادر الأصليةتوثيق C#C# في FiveM
Hello.cs
using CitizenFX.Core;using static CitizenFX.Core.Native.API;public class Hello : BaseScript{    public Hello()    {        EventHandlers["playerSpawned"] += new Action(() =>            TriggerEvent("chat:addMessage", new { args = new[] { "welcome" } }));    }}

نفس ما يفعله سطران في Lua: عند ظهور اللاعب تُرسل رسالة ترحيب في الشات

الطرفية — كيف تشغّله
$ dotnet buildHello -> bin/Release/Hello.net.dll

13/gpu/flow.frag

GLSL

برنامج يعمل لكل بكسل

  • منذ2004
  • منKhronos Group
  • النوعلغة تظليل
  • أين تعملكرت الشاشة — عبر WebGL في المتصفّح

ما هي؟

GLSL لغة الشيدرات في OpenGL و WebGL: برنامج صغير يشغّله كرت الشاشة ملايين المرّات بالتوازي — مرة لكل بكسل أو لكل رأس. تشبه C في شكلها، وتعمل بالمتّجهات (vec2، vec3) كأنواع أساسية. بها تُصنع الخلفيات الحيّة والتأثيرات التي يستحيل رسمها بالمعالج العادي في الزمن الحقيقي.

وش فايدتها؟

  1. 01التوازي الكامل: شاشة 4K تُحسب كل إطار بلا أن يشعر المعالج
  2. 02الحركة الحيّة (ضجيج، أمواج، توهّج) في بضعة أسطر
  3. 03نفس المبادئ في Unity و Unreal وفي المتصفّح

كيف تستخدمها؟

في المتصفّح تحتاج WebGL: كانفس، وشيدر رؤوس وشيدر أجزاء كنصّين، وبضع سطور JavaScript تربطهما. gl_FragCoord يعطيك موضع البكسل و gl_FragColor لونه — والباقي رياضيات.

عندنا

خطوط الكنتور التي تلتفّ خلف هذه الصفحة شيدر GLSL يعمل على كرت شاشتك الآن.

المصادر الأصليةمرجع GLSL (Khronos)WebGL في MDNThe Book of Shaders
flow.frag
precision mediump float;uniform vec2  u_res;uniform float u_time;void main() {  vec2 uv = gl_FragCoord.xy / u_res;  float wave = 0.5 + 0.5 * sin(uv.x * 12.0 + u_time);  gl_FragColor = vec4(0.23, 0.66, 0.96, wave);}

لكل بكسل: أين هو، وكم الوقت، فيخرج لونه — موجة زرقاء تتحرّك عبر الشاشة

الطرفية — كيف تشغّله
$ glslangValidator flow.fragflow.frag: OK

مقارنة سريعة

اللغةالنوعالأنواعأين تعملعندنا في
HTMLلغة ترميز—المتصفّح — وفي نافذة NUI فوق اللعبةكل واجهة يفتحها اللاعب عندنا — الجرد، الهيود، القائمة — صفحة HTML حقيقية تعمل فوق اللعبة.
CSSلغة تنسيق—المتصفّح — وكل واجهة NUIهيود بلا خلفية ثقيلة، وقائمة تنفتح بحركة لا تُحسّ عند 60 إطارًا — كلها CSS.
JavaScriptلغة برمجةديناميكية الأنواعالمتصفّح، والخادم عبر Node.js، وسكربتات FiveMتشغّل واجهات NUI من الداخل وتستقبل ردّ اللعبة، وتدير بوت TheC System على ديسكورد.
TypeScriptلغة برمجة فوق JavaScriptثابتة الأنواعأينما تعمل JavaScript — تُترجم إليها قبل التشغيلهذا الموقع كله TypeScript — كل نصّ فيه بلغتين نوعه T، فلا يمكن أن تُنسى ترجمة.
Reactمكتبة واجهات (JSX / TSX)—المتصفّح — وعلى الخادم مع Next.jsواجهات NUI الأكبر عندنا مبنية بها، وهذا الموقع نفسه React.
Next.jsإطار عمل—الخادم والمتصفّح معًاهذا الموقع: Next.js 16 — جلب أسماء مالكي السيرفرات من ديسكورد يحدث على الخادم ولا يرى المتصفّح التوكن.
Node.jsبيئة تشغيل—الخادم وسطر الأوامربوت TheC System الذي يربط السيرفر بمجتمعه يعمل على Node.js.
Luaلغة برمجةديناميكية الأنواعداخل اللعبة: كلاينت وسيرفر FiveMكل سكربتاتنا داخل اللعبة — الجرد والقتال والباركور والإدارة — مكتوبة بها.
SQLلغة استعلام—قاعدة البيانات: MySQL / MariaDBالصرّاف ورانك PVP وحرب العشائر والهويات — كل واحد له جداوله.
JSONصيغة بيانات—في كل مكان: ملفات إعدادات، ردود واجهات، رسائل بين الكلاينت والسيرفرإعدادات السكربتات، ونصوص اللغتين في dropship (en.json و ar.json).
Rustلغة برمجة نظمثابتة الأنواع مع ضمان الذاكرةبرامج سطح المكتب والأدوات: تُترجم إلى ملف تنفيذيdropship — النسخة العربية: الواجهة بـ egui، وقياس البينق عبر iphlpapi، وحجب السيرفرات على مستوى جدار حماية ويندوز.
C#لغة برمجةثابتة الأنواع‎.NET — ومنه سكربتات FiveM وألعاب Unityلا نستعملها في سكربتاتنا الحالية — نذكرها لأنها الخيار الثالث الرسمي في FiveM.
GLSLلغة تظليل—كرت الشاشة — عبر WebGL في المتصفّحخطوط الكنتور التي تلتفّ خلف هذه الصفحة شيدر GLSL يعمل على كرت شاشتك الآن.

تبي تبدأ فعليًا؟

صفحة تعلّم معنا فيها أول سكربت لك خطوة بخطوة — بالمجلّد والملفّين والأمر الذي تكتبه في اللعبة

تعلّم معنا