كيف تبني أول تطبيق Flutter باستخدام Claude Code وCursor في…

Сhoose

الفئة: تطوير تطبيقات الموبايل

التاريخ: April 14, 2026

الكاتب: Joyboy Team

عن الكاتب

Joyboy Team

Editorial Team

Joyboy's editorial team writes practical guides on software, apps, automation, and digital product delivery.

يبدو تطور الرفرفة في عام 2026 مختلفًا جذريًا عما كان عليه قبل عامين. ليس لأن الإطار نفسه قد تغير بشكل كبير - Flutter 3.41.2 ناضج ومستقر وممتاز - ولكن لأن الأدوات التي يستخدمها المطورون لكتابة كود Flutter قد تم تحويلها بواسطة الذكاء الاصطناعي. لقد أصبح Claude Code وCursor أهم إضافتين إلى مجموعة أدوات مطور Flutter، ويعملان معًا على ضغط الوقت من الفكرة إلى التطبيق العامل بطرق يجب تجربتها حقًا حتى يتم تصديقها.

قام كلود كود بضغط أيام العمل في عملية مبسطة مدتها ساعتان لمطور واحد يقوم ببناء تطبيق iOS قائم على السياج الجغرافي - وتتوافق هذه التجربة مع ما تقوم الفرق بالإبلاغ عنه عبر مشاريع Flutter ذات التعقيد المتفاوت.

يغطي هذا الدليل كل ما تحتاجه لإعداد كلتا الأداتين وإنشاء تطبيق Flutter الأول من البداية - بدءًا من تثبيت Flutter وClaude Code وحتى كتابة شاشتك الأولى وتشغيلها على جهاز محاكاة.

ما الذي ستبنيه

بحلول نهاية هذا الدليل، سيكون لديك تطبيق Flutter فعال - وهو مدير مهام نظيف وعملي مزود بشاشة رئيسية، والقدرة على إضافة المهام وإكمالها، واستمرارية البيانات المحلية، وواجهة مستخدم مصقولة. يعد إنشاء الأمر بسيطًا بما يكفي في جلسة واحدة ومعقدًا بدرجة كافية لإظهار القدرات الحقيقية لكلتا الأداتين.

ينطبق سير العمل نفسه على أي تطبيق Flutter تقوم بإنشائه بعد ذلك - الأدوات والنهج يتسع للتطبيقات بأي تعقيد.

الجزء 1: تثبيت الرفرفة

قبل أن يساعدك Claude Code أو Cursor في إنشاء تطبيق Flutter، تحتاج إلى تثبيت Flutter نفسه. الإصدار الثابت الحالي هو Flutter 3.41.2، وتم آخر تحديث في 6 مارس 2026.

على نظام التشغيل MacOS:

bash
# Install via Homebrew (recommended)
brew install --cask flutter

# Verify installation
flutter doctor

على الويندوز:

قم بتنزيل Flutter SDK من Flutter.dev/docs/get-started/install/windows. قم باستخراج الرمز البريدي إلى مكان مثل C:\src\flutter وإضافة C:\src\flutter\bin إلى متغير بيئة PATH للنظام الخاص بك.

على نظام لينكس:

bash
# Install via snap
sudo snap install flutter --classic

# Or download manually
wget https://storage.googleapis.com/flutter_infra_release/releases/stable/linux/flutter_linux_3.41.2-stable.tar.xz
tar xf flutter_linux_3.41.2-stable.tar.xz
export PATH="$PATH:`pwd`/flutter/bin"

بعد التثبيت، قم بتشغيل flutter doctor في المحطة الخاصة بك. يتحقق هذا الأمر من بيئتك ويسرد أي تبعيات مفقودة. اعمل على حل أية مشكلات يتم الإبلاغ عنها قبل المتابعة — عملية تنظيف flutter doctor يستحق الإخراج الحصول عليه بشكل صحيح قبل البدء في البناء.

إعداد جهاز محاكاة أو محاكي:

بالنسبة لنظام التشغيل iOS (نظام التشغيل macOS فقط): قم بتثبيت Xcode من Mac App Store، ثم قم بتشغيل:

bash
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
open -a Simulator

بالنسبة لنظام التشغيل Android: قم بتثبيت Android Studio، وانتقل إلى الأدوات > إدارة الأجهزة، وقم بإنشاء جهاز افتراضي. وبدلاً من ذلك، قم بتوصيل جهاز Android فعلي مع تمكين تصحيح أخطاء USB.

الجزء 2: تثبيت كود كلود

لقد تطور Claude Code من معاينة بحثية تجريبية إلى واحدة من أكثر أدوات البرمجة المتاحة بالذكاء الاصطناعي قدرة - وقد تغيرت طريقة تثبيتها بشكل كبير. أصبح المثبت الأصلي الآن هو النهج الموصى به، حيث يقوم بإسقاط Claude Code على نظامك بأمر واحد دون الحاجة إلى تبعيات وقت التشغيل.

المتطلبات الأساسية:

يتطلب Claude Code حساب Pro أو Max أو Teams أو Enterprise أو Console. خطة Claude.ai المجانية لا تتضمن Claude Code. ستحتاج على الأقل إلى اشتراك Claude Pro (20 دولارًا شهريًا) أو حساب Anthropic Console مع أرصدة API.

على الرغم من أن المثبت الأصلي لـ Claude Code لا يتطلب Node.js، فإن العديد من خوادم MCP الشائعة تعمل عبر npx - لذلك إذا كنت تخطط لاستخدام تكاملات MCP (ويجب عليك ذلك)، فقم بتثبيت Node.js 18+ كجزء من الإعداد الخاص بك.

التثبيت على نظام التشغيل macOS/Linux (المثبت الأصلي — موصى به):

bash
curl -fsSL https://claude.ai/install.sh | bash

يتعامل هذا الأمر الفردي مع تنزيل Claude Code وتثبيته وإضافته إلى PATH الخاص بك. يقوم المثبت بتنزيل الملف الثنائي المناسب لبنيتك ويقوم بتكوين الصدفة الخاصة بك تلقائيًا.

التحقق من التثبيت:

bash
claude --version

** التثبيت على نظام التشغيل macOS عبر Homebrew:**

bash
brew install claude-code

ملاحظة: لا يتم تحديث عمليات تثبيت Homebrew تلقائيًا. يجري brew upgrade claude-code يدويا للحصول على الإصدارات الجديدة.

** التثبيت على نظام التشغيل Windows: **

يتطلب Claude Code على نظام التشغيل Windows Git لنظام التشغيل Windows أو WSL. يمكنك تشغيل Claude من PowerShell أو CMD أو Git Bash.

الخيار 1 - نظام التشغيل Windows الأصلي (مستحسن):

powershell
# Run in PowerShell
irm https://claude.ai/install.ps1 | iex

الخيار 2 – WSL: قم بتثبيت WSL2 أولاً (wsl --install في PowerShell كمسؤول)، ثم داخل محطة WSL الخاصة بك:

bash
curl -fsSL https://claude.ai/install.sh | bash

المصادقة على كود كلود:

يجري claude في المحطة الخاصة بك لأول مرة. سيُطلب منك المصادقة. اختر طريقتك:

اشتراك Claude Pro/Max: اتبع تدفق OAuth القائم على المتصفح
مفتاح واجهة برمجة تطبيقات وحدة التحكم البشرية: قم بتعيين مفتاحك كمتغير بيئة:

bash
export ANTHROPIC_API_KEY='your-api-key-here'
# Add to ~/.zshrc or ~/.bashrc to make permanent
echo 'export ANTHROPIC_API_KEY="your-key"' >> ~/.zshrc
source ~/.zshrc

اختيار النموذج الخاص بك:

يدعم كلود كود نماذج متعددة. يعد Claude Sonnet 4.6 أفضل نموذج ترميز مع تحسين الاتساق. بالنسبة لأعمال التطوير الجادة، يقدم Claude Sonnet 4.6 أو Opus نتائج أفضل بكثير.

bash
# Start with Sonnet 4.6 (recommended for Flutter)
claude --model claude-sonnet-4-6

# Or set as default in settings
claude config set model claude-sonnet-4-6

الجزء 3: إعداد حاوية Flutter Dev لـ Claude Code

أفضل طريقة لاستخدام Claude Code مع Flutter هي من خلال حاوية التطوير - وهي بيئة تم تكوينها مسبقًا والتي تمنح Claude Code وصولاً كاملاً إلى أدوات Flutter وأجهزة المحاكاة وDart SDK.

قم بتثبيت ملحق Dev Containers في Cursor (أو VS Code)، ثم قم بإعداد تكوين Flutter devcontainer:

bash
# Install the Flutter skill for Claude Code
mkdir -p .claude/skills/flutter-development &#x26;&#x26; \
curl -L -o skill.zip "https://fastmcp.me/Skills/Download/242" &#x26;&#x26; \
unzip -o skill.zip -d .claude/skills/flutter-development &#x26;&#x26; \
rm skill.zip

يؤدي ذلك إلى تثبيت مهارة Flutter الشاملة التي تمنح Claude Code معرفة عميقة باتفاقيات Flutter وأنماط عناصر واجهة المستخدم وأساليب إدارة الحالة وممارسات الاختبار الخاصة بتطوير Flutter.

أضف هذه الأسماء المستعارة Flutter المفيدة إلى تكوين Shell الخاص بك لتسريع سير العمل الخاص بك:

bash
# Add to ~/.zshrc or ~/.bashrc
alias fclean="flutter clean"
alias fpg="flutter pub get"
alias fpu="flutter pub upgrade"
alias brb="dart run build_runner build -d"
alias brw="dart run build_runner watch -d"
alias fpgbrb="fpg &#x26;&#x26; brb"

# Claude Code shortcut
alias c-dsp='claude --dangerously-skip-permissions'

يجري source ~/.zshrc لتفعيل الأسماء المستعارة.

الجزء 4: تثبيت وتكوين المؤشر للرفرفة

تسرد وثائق Flutter الرسمية Cursor كأحد أدوات الذكاء الاصطناعي الموصى بها لتطوير Flutter جنبًا إلى جنب مع Claude Code وWindsurf وGemini Code Assist.

قم بتنزيل Cursor من cursor.sh وقم بتثبيته على نظامك الأساسي (راجع دليلنا السابق للحصول على خطوات تثبيت Cursor التفصيلية). بمجرد التثبيت:

تثبيت ملحقات Flutter وDart:

افتح المؤشر واضغط Cmd+Shift+X (ماك) أو Ctrl+Shift+X (Windows/Linux) لفتح لوحة الامتدادات. البحث عن وتثبيت:

رفرفة (بواسطة رمز دارت)
** دارت ** (بواسطة كود دارت)

توفر هذه الملحقات تمييزًا لبناء الجملة، وإكمال التعليمات البرمجية، ومقتطفات عناصر واجهة المستخدم، والقدرة على تشغيل أوامر Flutter مباشرةً من المؤشر.

** تكوين المؤشر للرفرفة: **

افتح إعدادات المؤشر (Cmd+,) وأضف هذه الإعدادات الخاصة بالرفرفة:

json
{
  "dart.flutterSdkPath": "/path/to/flutter",
  "dart.debugExternalPackageLibraries": false,
  "dart.debugSdkLibraries": false,
  "[dart]": {
    "editor.formatOnSave": true,
    "editor.selectionHighlight": false,
    "editor.suggest.snippetsPreventQuickSuggestions": false,
    "editor.suggestSelection": "first",
    "editor.tabCompletion": "onlySnippets",
    "editor.wordBasedSuggestions": "off"
  }
}

** قم بتعيين Claude Sonnet 4.6 كنموذج لك في المؤشر: **

انقر فوق محدد النموذج في لوحة الدردشة Cursor واختر ** claude-sonnet-4-6 **. هذا هو نفس النموذج الذي يستخدمه Claude Code افتراضيًا - حيث يضمن الاحتفاظ بالأداتين في نفس النموذج تفكيرًا متسقًا حول قاعدة التعليمات البرمجية الخاصة بك.

الجزء الخامس: إنشاء مشروع Flutter الخاص بك

بعد تكوين كلتا الأداتين، قم بإنشاء مشروعك. افتح المحطة الطرفية الخاصة بك وقم بتشغيل:

bash
flutter create task_manager_app
cd task_manager_app

افتح المشروع في المؤشر:

bash
cursor .

الآن قم بتهيئة Claude Code في المشروع:

bash
claude

يجري /init للسماح لـ Claude Code بتحليل مشروعك وإنشاء ملف CLAUDE.md ملف. يعمل هذا الملف كسياق دائم لـ Claude عبر الجلسات - حيث يلتقط نظرة عامة على المشروع والهندسة المعمارية وإرشادات الترميز والمتطلبات الأساسية.

يكتب /init في محطة Claude Code وانتظر حتى يكتمل. ثم افتح الملف الذي تم إنشاؤه CLAUDE.md ملف وإضافة السياق الخاص بالمشروع الخاص بك:

markdown
# Task Manager App

## Project Overview
Flutter task manager app for iOS and Android.
Target: UAE market, Arabic and English support planned for v2.

## Tech Stack
- Flutter 3.41.2
- Dart 3.x
- State Management: Riverpod
- Local Storage: Hive
- Navigation: go_router

## Architecture
Feature-first clean architecture.
- lib/features/ - Feature modules
- lib/shared/ - Shared widgets and utilities
- lib/core/ - Core services and configuration

## Coding Conventions
- Prefer small, composable widgets
- Use const constructors wherever possible
- Use flex values over hardcoded sizes
- Use log from dart:developer (not print)
- Format on save enabled

## Commands
- flutter run - Run on connected device
- flutter test - Run all tests
- flutter build apk - Android release build
- flutter build ios - iOS release build

يتم حفظ ملف CLAUDE.md هذا في مستودعك — ويستفيد منه كل عضو في الفريق يقوم باستنساخ المشروع تلقائيًا.

الجزء السادس: إعداد التبعيات

اطلب من Claude Code إعداد تبعيات مشروعك. في محطة Claude Code، اكتب:

code
Add the following dependencies to pubspec.yaml and run flutter pub get:
- flutter_riverpod (latest stable) for state management
- hive_flutter (latest stable) for local storage
- go_router (latest stable) for navigation
- hive_generator and build_runner as dev dependencies

After adding dependencies, create the basic folder structure for 
feature-first clean architecture:
lib/features/tasks/
lib/features/tasks/presentation/screens/
lib/features/tasks/presentation/widgets/
lib/features/tasks/domain/models/
lib/features/tasks/data/repositories/
lib/shared/widgets/
lib/core/theme/

سيتم تحديث كلود كود pubspec.yaml، يجري flutter pub get، وإنشاء بنية المجلد - كل ذلك في مسار واحد. تحقق من الإخراج عن طريق التحقق من لوحة Explorer في المؤشر.

الجزء 7: إنشاء التطبيق باستخدام Claude Code والمؤشر معًا

وهنا تعمل الأداتان معًا بشكل أكثر فعالية. استخدم Claude Code لإجراء تغييرات هيكلية كبيرة عبر ملفات متعددة - قرارات التصميم وتنفيذ الميزات وإعداد طبقة البيانات. استخدم المؤشر للعمل المركّز على واجهة المستخدم على مستوى الشاشة حيث تريد رؤية النتيجة المرئية أثناء التكرار.

الخطوة 1: إنشاء نموذج المهمة (كود كلود)

في محطة كلود كود:

code
Create a Task model in lib/features/tasks/domain/models/task.dart with:
- id (String, auto-generated UUID)
- title (String)
- description (String, nullable)
- isCompleted (bool, default false)
- createdAt (DateTime)
- priority (enum: low, medium, high)

Add Hive annotations for local storage.
Generate the Hive adapter using build_runner.

سيقوم Claude Code بإنشاء ملف النموذج، وإضافة التعليقات التوضيحية للخلية، وتشغيل الأمر build_runner لإنشاء المحول.

الخطوة 2: إنشاء المستودع وموفري Riverpod (كود كلود)

code
Create the task repository in lib/features/tasks/data/repositories/
with methods for:
- getAllTasks() returning List&#x3C;Task>
- addTask(Task task)
- updateTask(Task task)
- deleteTask(String id)
- toggleTaskCompletion(String id)

Using Hive for storage.

Then create Riverpod providers in 
lib/features/tasks/presentation/providers/task_providers.dart
that expose these repository methods to the UI.

الخطوة 3: إنشاء الشاشة الرئيسية (المؤشر)

قم بالتبديل إلى المؤشر لعمل واجهة المستخدم. افتح دردشة المؤشر واكتب:

code
Create the home screen widget in 
lib/features/tasks/presentation/screens/home_screen.dart

The screen needs:
- An AppBar with the app name and an add button
- A ListView showing all tasks from the taskProvider
- Each task item shows the title, priority badge, and a 
  completion checkbox
- Completed tasks show with a strikethrough and reduced opacity
- An empty state widget when there are no tasks
- Pull-to-refresh functionality

Use the Riverpod ConsumerWidget pattern.
Color scheme: deep navy (#0A1628) primary, amber (#F59E0B) accent.

سيقوم Cursor's Composer بإنشاء أداة الشاشة الرئيسية الكاملة. استخدم التحديث السريع لامتداد Flutter — اضغط r في المحطة الخاصة بك حيث flutter run قيد التشغيل - لرؤية التغييرات على الفور على جهاز المحاكاة الخاص بك.

الخطوة 4: إنشاء شاشة إضافة مهمة (المؤشر)

code
Create an add task bottom sheet in
lib/features/tasks/presentation/screens/add_task_sheet.dart

It needs:
- A title text field (required)
- A description text field (optional, multiline)
- A priority selector with three options (Low, Medium, High)
  displayed as segmented buttons
- A Save button that validates the form and calls addTask
- A Cancel button

Show it as a modal bottom sheet from the home screen's add button.
Use proper form validation.

الخطوة 5: إضافة الرسوم المتحركة والتلميع (المؤشر)

code
Add these polish improvements to the home screen:
- AnimatedList for smooth task addition and removal animations
- Slide-to-delete on task items with a red delete background
- A Hero animation on the priority badge when opening task details
- A subtle bounce animation on the empty state illustration

Keep everything smooth at 60fps.

الجزء الثامن: استخدام الوكلاء الفرعيين لـ Claude Code 2.0 للعمل الموازي

قدم Claude Code 2.0 وكلاء فرعيين — وكلاء صغار يعملون على أجزاء محددة من مشروعك في وقت واحد. يمكن أن يكون لديك وكيل فرعي واحد يعمل على شاشات واجهة المستخدم، وآخر على المنطق، وواحد لإعداد Firebase، وآخر للاختبارات - فهم يعملون بشكل منفصل ولكن يظلون متزامنين.

بالنسبة لتطبيق إدارة المهام، استخدم الوكلاء الفرعيين لإنشاء ميزات بالتوازي:

code
I want to build three things simultaneously using sub-agents:

Sub-agent 1: Add a task detail screen that shows full task 
information with edit capability.

Sub-agent 2: Add search and filter functionality to the 
home screen — search by title, filter by priority and 
completion status.

Sub-agent 3: Write widget tests for the home screen and 
unit tests for the task repository.

Coordinate them so they don't conflict with each other.

سيقوم كلود كود بتدوير ثلاثة عملاء متوازيين، يعمل كل منهم على اهتمام منفصل. تعد هذه واحدة من أهم مزايا السرعة في Claude Code 2.0 - حيث يمكن تشغيل العمل الذي قد يستغرق عدة ساعات من المطور لتسلسله بالتوازي.

الجزء 9: استخدام وضع الخطة للميزات المعقدة

يمكن الوصول إلى وضع الخطة في Claude Code بالضغط على Shift + Tab مرتين. لقد تم تصميمه للاستدلال وتقسيم المتطلبات إلى خطوات قابلة للتنفيذ قبل كتابة أي تعليمات برمجية.

استخدم وضع الخطة قبل تنفيذ أي ميزة معقدة:

يضعط Shift + Tab مرتين للدخول في وضع الخطة، ثم اكتب:

code
I want to add a notification system that reminds users about 
high-priority incomplete tasks. It should:
- Send a local notification at 9am daily
- Only notify about tasks created more than 24 hours ago
- Allow users to set a custom reminder time
- Work on both iOS and Android
- Request notification permissions on first use

Plan the implementation before writing any code.

سينتج Claude Code خطة تنفيذ خطوة بخطوة تغطي الحزم المطلوبة، ونهج التعامل مع الأذونات، ومنطق جدولة الإشعارات، وواجهة مستخدم الإعدادات. مراجعة الخطة وتعديلها قبل اعتمادها للتنفيذ.

الجزء 10: إعداد مفتش الرفرفة MCP

يعمل تكامل mcp_flutter على ربط Claude Code مباشرة بخدمة تصحيح الأخطاء الخاصة بـ Flutter، مما يسمح لـ Claude بفحص تطبيقك قيد التشغيل، وقراءة أشجار عناصر واجهة المستخدم، وإجراء تغييرات بناءً على ما يراه فعليًا بدلاً من مجرد الكود.

bash
# Clone and build the MCP flutter inspector
cd ~/Developer
git clone https://github.com/Arenukvern/mcp_flutter
cd mcp_flutter
make install

قم بتشغيل تطبيق Flutter في وضع التصحيح مع تمكين خدمة VM:

bash
flutter run --debug --host-vmservice-port=8181 \
  --enable-vm-service --disable-service-auth-codes

لاحظ منفذ خدمة VM من المخرج، ثم قم بتوصيل Claude Code:

bash
claude mcp add flutter-inspector \
  ~/Developer/mcp_flutter/mcp_server_dart/build/flutter_inspector_mcp \
  -- --dart-vm-host=localhost --dart-vm-port=8181 \
  --no-resources --images

أعد تشغيل كود كلود. يمكنك الآن أن تطلب منه فحص تطبيقك قيد التشغيل مباشرةً:

code
Look at the current widget tree on the home screen and identify 
any widgets that are rebuilding unnecessarily. Show me the 
specific widgets and suggest fixes.

هذا المستوى من الاستبطان المباشر للتطبيق هو ما يفصل سير عمل ترميز الذكاء الاصطناعي الأساسي عن تجربة التطوير المتكاملة حقًا.

الجزء 11: التشغيل على جهاز حقيقي والإنشاء للإصدار

اختبره على جهاز حقيقي قبل تقديمه إلى المتاجر. قم بتوصيل جهازك عبر USB وتشغيل:

bash
# List connected devices
flutter devices

# Run on a specific device
flutter run -d [device-id]

عندما تكون جاهزًا للإنشاء للإصدار، اطلب من Claude Code التعامل مع التكوين:

code
Set up release build configuration for both iOS and Android:
- Configure app icons (I'll provide the source image separately)
- Set up the app bundle ID: ae.joyboy.taskmanager
- Configure signing for iOS release build
- Generate a signed APK and AAB for Android
- Update the version number to 1.0.0+1

Walk me through any manual steps that require Xcode or 
Android Studio.

سير العمل في الممارسة العملية

المجموعة التي تعمل بشكل أفضل لتطوير Flutter في عام 2026 هي استخدام Claude Code وCursor لما يفعله كل منهما بشكل أفضل.

كلود كود هو المهندس المعماري الخاص بك. استخدمه في الوحدة الطرفية لاتخاذ القرارات الهيكلية، وتغييرات الملفات المتعددة، وتنفيذ الميزات المعقدة، وكتابة الاختبار، وأي شيء يتطلب فهمًا عميقًا لقاعدة التعليمات البرمجية بأكملها. استخدم Claude Haiku للعصف الذهني السريع، وSonnet كنموذج عملك الرئيسي لتغييرات الملفات المتعددة، وانتقل إلى Opus عندما يكون التطبيق على وشك الانتهاء لاكتشاف المشكلات المخفية مثل تسرب الذاكرة وأنماط المزامنة السيئة.

المؤشر هو منشئ واجهة المستخدم لديك. استخدمه داخل المحرر لعمل عناصر واجهة المستخدم على مستوى الشاشة حيث تريد التكرار بسرعة على المخرجات المرئية، راجع قيام الملحن بإجراء تغييرات متعددة الملفات في السياق، واستخدام إكمال علامة التبويب لكتابة كود Dart بشكل أسرع. إن معاينة التغييرات في الوقت الفعلي من خلال إعادة التحميل السريع تجعل من Cursor الأداة الأسرع لتكرار واجهة المستخدم النقية.

تعمل هذه الأدوات معًا على تغطية دورة حياة تطوير Flutter الكاملة - بدءًا من الهندسة المعمارية وواجهة المستخدم وحتى الاختبار والإصدار - بشكل أسرع وبجودة تعليمات برمجية أفضل من أي أداة بمفردها.

الاستنتاج الصادق من المطورين الذين استخدموا سير العمل هذا باستمرار: الذكاء الاصطناعي لا يحل محل حدس المطورين - بل يضخمه. مستقبل تطوير Flutter هو الإبداع البشري المقترن بكفاءة الذكاء الاصطناعي.

Want a production-ready Flutter app built with the latest AI-assisted workflows?

At Joyboy, Flutter is our mobile framework of choice — and we build with Claude Code and Cursor in our daily workflow. The result is faster delivery, cleaner architecture, and apps that actually perform. Talk to us about your app project.

Similar Publications:

View all

Joyboy × Lexel CGI: لماذا تهم CGI والسرد ثلاثي الأبعاد في دبي والإمارات في 2026

3d-video-production

April 15, 2026

Joyboy × Lexel CGI: لماذا تهم CGI والسرد ثلاثي الأبعاد في دبي والإمارات في 2026

Joyboy has partnered with Lexel CGI to strengthen our CGI and 3D storytelling capabilities. Here’s why that matters for brands in Dubai and across the UAE in 2026.

كيف تستخدم الشركات الصغيرة والمتوسطة في الإمارات الأتمتة لإنجاز المزيد بفرق أصغر في 2026

automation-solutions

April 14, 2026

كيف تستخدم الشركات الصغيرة والمتوسطة في الإمارات الأتمتة لإنجاز المزيد بفرق أصغر في 2026

Across the UAE, small and medium businesses are using intelligent automation to run leaner, move faster, and compete with larger players — without proportionally growing their headcount.

المشاريع

الإمارات

كيف تبني أول تطبيق Flutter
باستخدام Claude Code وCursor في 2026

Joyboy Team

ما الذي ستبنيه

الجزء 1: تثبيت الرفرفة

الجزء 2: تثبيت كود كلود

الجزء 3: إعداد حاوية Flutter Dev لـ Claude Code

الجزء 4: تثبيت وتكوين المؤشر للرفرفة

الجزء الخامس: إنشاء مشروع Flutter الخاص بك

الجزء السادس: إعداد التبعيات

الجزء 7: إنشاء التطبيق باستخدام Claude Code والمؤشر معًا

الجزء الثامن: استخدام الوكلاء الفرعيين لـ Claude Code 2.0 للعمل الموازي

الجزء 9: استخدام وضع الخطة للميزات المعقدة

الجزء 10: إعداد مفتش الرفرفة MCP

الجزء 11: التشغيل على جهاز حقيقي والإنشاء للإصدار

سير العمل في الممارسة العملية

Want a production-ready Flutter app built with the latest AI-assisted workflows?

Similar Publications:

Joyboy × Lexel CGI: لماذا تهم CGI والسرد ثلاثي الأبعاد في دبي والإمارات في 2026

كيف تستخدم الشركات الصغيرة والمتوسطة في الإمارات الأتمتة لإنجاز المزيد بفرق أصغر في 2026

الإمارات

المشاريع

الإمارات

كيف تبني أول تطبيق Flutter باستخدام Claude Code وCursor في 2026

Joyboy Team

ما الذي ستبنيه

الجزء 1: تثبيت الرفرفة

الجزء 2: تثبيت كود كلود

الجزء 3: إعداد حاوية Flutter Dev لـ Claude Code

الجزء 4: تثبيت وتكوين المؤشر للرفرفة

الجزء الخامس: إنشاء مشروع Flutter الخاص بك

الجزء السادس: إعداد التبعيات

الجزء 7: إنشاء التطبيق باستخدام Claude Code والمؤشر معًا

الجزء الثامن: استخدام الوكلاء الفرعيين لـ Claude Code 2.0 للعمل الموازي

الجزء 9: استخدام وضع الخطة للميزات المعقدة

الجزء 10: إعداد مفتش الرفرفة MCP

الجزء 11: التشغيل على جهاز حقيقي والإنشاء للإصدار

سير العمل في الممارسة العملية

Want a production-ready Flutter app built with the latest AI-assisted workflows?

Similar Publications:

Joyboy × Lexel CGI: لماذا تهم CGI والسرد ثلاثي الأبعاد في دبي والإمارات في 2026

كيف تستخدم الشركات الصغيرة والمتوسطة في الإمارات الأتمتة لإنجاز المزيد بفرق أصغر في 2026

كيف تبني أول تطبيق Flutter
باستخدام Claude Code وCursor في 2026