logo أكاديمية أكسبورت للتطوير والبرمجة logo-alt أكاديمية أكسبورت للتطوير والبرمجة
تسجيل الدخول  أو  تسجيل حساب
  • الرئيسية
  • دروس برمجية
    • HTML
    • CSS
    • ANGULAR
    • IONIC / MOBILE
    • YII 2.0
    • Odoo /epen ERP
    • مواضيع متنوعة
  • مفاهيم برمجية
  • من نحـن
  • اتصل بنا

تنصيب اطار عمل Yii Framework وادماج api

installing api

Mobile development الصفحة الرئيسية

قبل كل شيء يجب ان يتوفر بجهازك سرفر محلي apache من أجل تشغيل php ويتوفر الكثير من هده البرامج على الانترنت أهمها wampserver على ويندوز و apache على لنكس

سنقوم بتنصيب اطار عمل  Yii Framework  Yii2.0 وسنقوم بادماج api  بداخله

لسنا بصدد شرح  مفصل عن Yii Framework لكن بامكانك الاطلاع على مجموعة من الدروس التي نقدمها بالموقع

  • مجموعة من الدروس تتناول الـ Yii Framework من هنا 
  • شرح مفهوم الـ API و REST API من هنا

في حال ما ادا كنت متمكن من اطار عمل Yii2 وترغب بتخطي خطوة تنصيب ال api في درسنا . بامكانك عمل download مباشرة للمشروع الناتج الدي ستجده جاهز في أسفل الدرس

ماهو اطار Yii : هو اطار عمل  من اطارات عمل php يعتمد على هندسة MVC 

يقدم اطار العمل Yii2.0  نوعين من المشاريع .. basic و advanced حيث ان النوع advanced يسمح لنا بتنصيب عدة مشاريع مصغرة داخل المشروع الأب ,مما يمكننا ايضا من تقسيم العمل الى backend +frontend  وما الى دلك من المميزات 

سنجد المشروع بمخزن github  من هنا

https://github.com/yiisoft/yii2-app-advanced

 

ستجد توثيق مشروع Yii2 -advanced

https://github.com/yiisoft/yii2-app-advanced/blob/master/docs/guide

ستجد ملفات المشروع باخر الدرس من اجل التحميل وستجد قاعدة البيانات جاهزة بمجلد data

مراحل تنصيب المشروع 

1. يجب تنصيب أداة composer وهي اداة تخص php تسهل الكثير على المطورين حيث يستعملها المطورون من اجل اختصار العمل وجلب الاضافات أو مكتبات عن طريق مجموعة من التعليمات في سطر الأوامر دون الحاجة لتحميل الاضافة ووضعها بالمشروع  وانما فقط نحتاج لأمر بسطر الاوامر لجل شيء معين موجود بمخازن الاكواد عبر اتصال انترنت  وهكدى يتم تضمينها مباشرة الى مشروعك بسهولة

حمل برنامج composer من الموقع الرسمي وقم بتنصيبه بشكل طبيعي كأي برنامج

https://getcomposer.org

التنصيب على ويندوز  يكون بشكل اعتيادي كأي برنامج next next  وأعد تشغيل ويندوز

التنصيب على نظام linux ubuntu (بالنسبة لمن يستخدم لنكس) يتبع التعليمات التالية

//test for Ubuntu 18.04
$ curl -sS https://getcomposer.org/installer | php
$ sudo mv composer.phar /usr/local/bin/composer.phar
$ gedit ~/.bashrc
//add this  inn the end line :
alias composer='/usr/local/bin/composer.phar'

//run this on terminal :
$ . ~/.bashrc
//test if success
$composer

 

2. بعد تنصيب composer سنقوم بجلب اطار عمل Yii عن طريقه  حيث سنقوم بفتح سطر الأوامر ونشغل برنامج apache  ويفضل ان تكون نسخة php لديك 5.6+ فما فوق ,نتوجه الى  مجلد المشاريع www حيث سننشيء مشروعنا

cd c:\wamp/www
composer create-project --prefer-dist yiisoft/yii2-app-advanced yii-application

yii-application هو اسم مجلد المشروع الرئيسي , تستطيع تغييره بما يلائمك

بعد اكتمال التنصيب نتوجه الى داخل مجلد المشروع عن طريق سطر الأوامر

cd yii-application

3. نقوم بتمهيد المشروع وتجهيزه عن طريق الأمر init في حال كنت تستعمل windows  أو php init في حال استعمال linux /mac  ,تستطيع الاطلاع على المزيد بالـ guide التوثيق الخاص باطار عمل yii2 

-ستظهر لك نافدة اختيارية بسطر الاوامر فتختار developement mode  ثم أكد الاختيار وسيقوم بتجهيز ملفات المشروع 

4. تنصيب قاعدة البيانات : قم بانشاء قاعدة بيانات جديدة  

http://localhost/phpmyadmin

انشيء قاعدة بيانات ولتكن مثلا باسم yii2advanced

قم بربط  مشروع yii-application  مع قاعدة البيانات yii2advanced عن طريق التوجه الى ملف   yii-application/common/config/main-local.php وهو الملف المسؤول عن اعدادات قاعدة البيانات 

 'db' => [
            'class' => 'yii\db\Connection',
            'dsn' => 'mysql:host=localhost;dbname=yii2advanced', // + اضف اسم قاعدة البيانات
            'username' => 'root',
            'password' => '',   // تحقق من اسم المسخدم وكلمة المرور بمدير قواعد البيانات بجهازك
            'charset' => 'utf8',
        ],

 

5. نقوم بعمل migration لقاعدة البيانات برمجيا أو بامكانك عمل import لقاعدة البيانات مباشرة من المجلد data بالملف المرفق بنهاية الدرس

migration : هي عبارة عن كلاسات برمجية بلغة php يقوم المطورن بانشاءها ووضعها بالمكتبات او الاضافات . مهمة هده الكلاسات هي انشاء جداول بقاعدة البيانات حسب الاعمدة والتعليمات التي تم تحديدها بالكلاس .وبهدا يتم انشاء الجداول اللازمة لمكتبة ما أو اضافة معينة مباشرة بتعليمة واحدة بسطر الاوامر.  دون الحاجة للدخول لمدير قواعد البيانات phpmyadmin وتوفير عناء انشاء الجدول يدويا   

لعمل migration  نفتح سطر الاوامر ونتوجه لمجلد المشروع الرئيسي

cd c:\wamp/www/yii-application

 ثم

// ادا كنت تستخدم ويندوز
yii migrate
//ادا كنت تستخدم انظمة لنكس
php yii migrate

الان سيقوم بتنصيب الجداول الافتراضية الموجودة بمجلد yii-application\console\migrations بالمشروع حيث سوف يتم تضمين هده الجداول بقاعدة البيانات  والتي عادة يكون جدول user بشكل افتراضي مع مشروع Yii

تحقق أن المشروع يعمل معك جيدا عبر هده المسارات

http://localhost/yii-application/frontend/web  // الصفحة الافتراضية لبرمجة موقع او تطبيق ويب
http://localhost/yii-application/backend/web   //الصفحة المفترضة لبرمجة لوحة تحكم المدير أو ماشابه دلك

 

الجدير بالدكر أنه في حال ادا لم تستوعب جيدا فكرة migration بامكانك تضمين قاعدة البيانات مباشرة بمجلد data بالمشروع المرفق اسفل الدرس

عند القاء نظرة على مجلدات المشروع سنلاحظ مجلدين  backend و frontend  هدين المجلدين احدهما خاص ببرمجة المواقع الالكتروني وهو frontend والاخر خاص ببرمجة لوحة تحكم الموقع CMS 

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

لقد اخترنا هدا المشروع لتنوعه ومرونة الاستخدام عليه كما يسمح بفصل المشاريع عن بعضها البعض فادا كنت ترغب ببرمجة موقع الكتروني فبامكانك العمل فقط على مجلد fronend اما ادا كنت تريد برمجة لوحة تحكم فسيكون الشغل باكمله على مجلد backend  علما انهما يشتركان بقاعدة بيانات واحدة . ولهدا السبب اخترنا اطار عمل yii advanced  من اجل مرونة الاستخدام وفصل الكود

6. نقوم بعمل copy  لمجلد frontend ونسمي المجلد المسوخ api

7. نقوم بحدف الملفات الغير هامة  والتي لن نحتاج اليها ونترك هدا الهيكل من الملفات

api
-- config
---- bootstrap.php
---- main.php
---- main-local.php
---- params.php
---- params-local.php
-- models
-- modules
---- v1
-------- controllers
-------- models
--runtime
-- web

 

8. قم بنسخ المجلد frontend الى api والدي ستجده بهده المسارات :

environments/dev/frontend الى environments/dev/api

environments/prod/api الى environments/prod/frontend

9. توجه الى الملف common\config\bootstrap.php نقوم باضافة هده التعليمة لكي يتعرف على مسار الـ api  الديناميكي

Yii::setAlias('api', dirname(dirname(__DIR__)) . '/api');

10. قم بالتوجه نحو المجلد environments/index.php وأضف ماهو مشار اليه بعلامة (+)

return [
    'Development' => [
        'path' => 'dev',
        'setWritable' => [
            'backend/runtime',
            'backend/web/assets',
            'frontend/runtime',
            'frontend/web/assets',
            'api/runtime',                 //+
            'api/web/assets',              //+
        ],
        'setExecutable' => [
            'yii',
            'yii_test',
        ],
        'setCookieValidationKey' => [
            'backend/config/main-local.php',
            'frontend/config/main-local.php',
            'api/config/main-local.php',        //+
        ],
    ],
    'Production' => [
        'path' => 'prod',
        'setWritable' => [
            'backend/runtime',
            'backend/web/assets',
            'frontend/runtime',       
            'frontend/web/assets', 
            'api/runtime',                   //+
            'api/web/assets',                //+
        ],
        'setExecutable' => [
            'yii',
        ],
        'setCookieValidationKey' => [
            'backend/config/main-local.php',
            'frontend/config/main-local.php',
            'api/config/main-local.php',      //+
        ],
    ],
];

 

11. توجه الى ملف api/config/main.php وقم باستبدال المحتوى الى التالي

<?php
$params = array_merge(
    require(__DIR__ . '/../../common/config/params.php'),
    require(__DIR__ . '/../../common/config/params-local.php'),
    require(__DIR__ . '/params.php'),
    require(__DIR__ . '/params-local.php')
);
return [
    'id' => 'app-api',
    'basePath' => dirname(__DIR__),
    'bootstrap' => ['log'],
    'modules' => [
        'v1' => [
            'basePath' => '@app/modules/v1',
            'class' => 'api\modules\v1\Module'
        ]
    ],
    'components' => [
        'user' => [
            'identityClass' => 'common\models\User',
            'enableAutoLogin' => false,
        ],
        'log' => [
            'traceLevel' => YII_DEBUG ? 3 : 0,
            'targets' => [
                [
                    'class' => 'yii\log\FileTarget',
                    'levels' => ['error', 'warning'],
                ],
            ],
        ],
        'urlManager' => [
            'enablePrettyUrl' => true,
            'enableStrictParsing' => true,
            'showScriptName' => false,
            'rules' => [
                [
                    'pluralize'     => false,
                    'class' => 'yii\rest\UrlRule',
                    'controller' => 'v1/user',
                    'tokens' => [
                        '{id}' => '<id:\\w+>'
                    ]

                ]
            ],
        ]
    ],
    'params' => $params,
];

 

نقوم المجلد modules داخل api  ثم ننشئ هده التشكيلة من المجلدات والملفات

api
¦-index.php           # ملف
¦-.htaccess           # ملف
¦-modules              #مجلد
¦--v1                  #مجلد
¦---controllers        #مجلد
¦----UserController    # ملف
¦---models             #مجلد
¦---Module.php         # ملف

 

محتوى Module.php

<?php
namespace api\modules\v1;
class Module extends \yii\base\Module
{
    public $controllerNamespace = 'api\modules\v1\controllers';
    public function init()
    {
        parent::init();
    }
}

 

محتوى UserControler

<?php
namespace api\modules\v1\controllers;
use yii\rest\ActiveController;

class UserController extends ActiveController
{
    public $modelClass = 'common\models\User';
}

 

.htaccess

RewriteEngine On

RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d

RewriteRule . index.php

 

index.php

<?php
defined('YII_DEBUG') or define('YII_DEBUG', true); // يجب تفعيل هده التعليمة حتى تتمكن من استعراض الاخطاء بالمتصفح
//defined('YII_ENV') or define('YII_ENV', 'dev');

require __DIR__ . '/../../vendor/autoload.php';
require __DIR__ . '/../../vendor/yiisoft/yii2/Yii.php';
require __DIR__ . '/../../common/config/bootstrap.php';
require __DIR__ . '/../config/bootstrap.php';

$config = yii\helpers\ArrayHelper::merge(
    require __DIR__ . '/../../common/config/main.php',
    require __DIR__ . '/../../common/config/main-local.php',
    require __DIR__ . '/../config/main.php',
    require __DIR__ . '/../config/main-local.php'
);

(new yii\web\Application($config))->run();

الان كل شيء ممتاز ولم يتبقى سوى عملية testing  لتجربة فعالية ال api  , لأجل دلك سنستخدم أداة تسمى postman

للتاكد من ان api يعمل بالكامل لديك اكثر من طريقة لتجربة دلك سواء كانت عن طريق برمجة موقع أو تطبيق للاتصال بالـ API او عن طريق بعض الادوات التي تساعدك في اختبار الـ API منها postman وهو برنامج تنفيدي يتوفر أيضا على شكل اضافة لمتصفح الكروم  فعلى سبيل المثال اذا اردت استخدام الـ Postman قم بتحميله من الموقع الرسمي 

أو حمل اضافة postman الخاصة بالـ chrome 

تحميل postman كبرنامج تنفيدي

https://www.getpostman.com/downloads/

أو تحميل اضافة postman  للكروم 

https://chrome.google.com/webstore/detail/postman/fhbjgbiflinjbdggehcddcbncdddomop?hl=en

 

التطبيق سهل ماعليك سوى تشغيل سرفر apache والدخول الى postman ووضع مسار ال api ثم تختار الmethod  وأهمها GET or POST or PUT or DELETE ثم الضفط على زر send وتحليل النتائج 

رابط صفحة الاعضاء الخاص بال api 

http://localhost/yii-application/api/v1/user

- yii-application هو اسم المشروع

- v1 هو اسم ال module قمنا بتسميته بهدا الشكل على أساس تحديد نسخة ال api .مما يسهل على المطور بالمستقبل ترقية كود ال api على شكل عدة نسخ v1 , v2 , ...

- user هو ال controller الدي يعالج بيانات المستخدمين users

تحميل المشروع الناتج بهدا الدرس ستجده هنا

https://www.mediafire.com/file/1hf1n72784cd9at/yii-application.zip/file

 

ماهو تقييمك للدرس
تقييم الزوار للدرس
الدرس السابق : انشاء صفحة profile الدرس القادم : انشاء جدول السيارات وتوجيه التطبيق نحو api لجلب البيانات
  • قم بتسجيل الدخول للتعليق : تسجيل الدخول أو تسجيل عضوية
الدروس المقبلة
  • انشاء جدول السيارات وتوجيه التطبيق نحو api لجلب البيانات
    Integrating PHP and MySQL with Ionic
  • JWT Authentication with Ionic
    Adding json web token Authentication
  • ربط صفحة login مع api
    ionic login with jwt
  • تحديث القائمة menu بعد تسجيل الدخول والتعرف على الأحداث
    refresh side menu after login with events
ANGULAR
  • المستوى 101 من دورة angular
  • المستوى 102 من دورة angular
  • الدورة 103 من angular
Mobile Development
دورة تطوير تطبيق موبايل

sitemap - Exportdeveloper Academy © 2019 All rights reserved