سالار ربال سالار ربال
شروع کار با Apache Cordova در ویژوال استودیو #2
اندازه‌ی قلم متن
تخمین مدت زمان مطالعه‌ی مطلب: پنج دقیقه
در قسمت اول، با Apache Cordova  آشنا شدیم. در این قست قصد دارم در مورد Phonegap, معایب و مزایای Cordova و روش نصب و راه اندازی آن را بر روی Visual Studio، خدمت شما ارائه دهم. 

توضیح مختصری در مورد  Adobe Phonegap
در حوالی سال 2009 ، phonegap به‌واسطه‌ی استارت آپی بنام Nitobi با هدف ایجاد یک راه حل سورس باز  برای  ساخت اپلیکیشن‌های بومی موبایل با تکنولوژی‌های تحت وب، تولید شد. شرکت Adobe در حوالی سال 2011 ، Notobi را به همرا حق مالکیت phonegap خریداری کرد و هسته‌ی سورس باز آن را با نام Cordova به شرکت Apache اهدا کرد. نسبت بین Cordova و phonegap مانند نسبت بین مرورگر Blink و کروم است. در واقع phonegap ترکیبی‌است از Cordova و یک سری امکانات اضافه‌ی شرکت Adobe. تفاوت اصلی بین Cordova و Phonegap مربوط است به ابزارهای Command-Line و سرویس Build فون گپ است که در مقالات بعدی به آنها خواهیم پرداخت.
بیشتر : اینجا و اینجا
 مزایای استفاده از Cordova:
  • محیط برنامه نویسی قدرتمند
  • هسته اصلی  کد‌های همه اپلیکیشن‌ها  تولید شده شبیه به هم است
  • نیازی به یادگیری زبان‌های مربوط به هر پلتفرم را ندارید
  • کم هزینه و زمان کمتر
  • طراحی رابط گرافیکی سریع و منعطف به کمک HTML5 , CSS3 
  • برنامه نویسی آسان و سریع با javascript , Typescript
  • قابلیت اجرا بر روی چندین پلتفرم مختلف(Android,iOS,Widnows Phone )
  • قابلیت استفاده از فریم‌ورکهای تحت وب مانند Bootstrap , Angular JS, ...
  • قابلیت طراحی پلاگین برای ارتباط با سیستم عامل
  • مناسب برای برای برنامه‌های چت و استفاد از وب سرویس‌ها
  • مناسب برای ساخت بازیهای آنلاین و آفلاین با تکنولوژی‌های تحت وب
  • راحتی کار با آن برای برنامه نویسان تحت وب 
معایب  استفاده از Cordova  :
  • نداشتن ابزار گزارش خطاهای مناسب؛ درنتیجه برطرف کردن خطاها خسته کننده خواهد بود .
  • UI, UX اپلیکیشن‌ها باید به نحوی باشد که کاربر حس کند با نرم‌افزارهای بومی گوشی کار می‌کند.
  • کاهش سرعت اجرایی جزئی نسبت به سایر برنامه‌ها (به دلیل استفاده از WebView)
  • عدم دسترسی مستقیم به سیستم عامل و امکانات آن 

نصب اتوماتیک وابستگی ها
ابزارهایی که ما نیاز داریم:

لازم است تا Visual Studio 2013، با حداقل آپدیت 2 بر روی سیستم شما نصب باشد.

بعد از اتمام دانلود فایل، اقدام به نصب آن نمایید. در این حین، یک سری وابستگی‌های مربوط به خود را دانلود و نصب خواهد کرد. لیست وابستگی ها:
  • Node.js
  • Git CLI
  • Google Chrome
  • Apache Ant
  • Oracle Java JDK 7 (حتما نسخه x86 نصب شود)
  • Android SDK 
  • SQLLite For Windows Runtime
  • Apple iTunes
فایل نصاب، همه‌ی این وابستگی‌ها را به‌غیر از Android SDK، نصب می‌کند. 
در آخر هم سیستم خود را راستارت کنید.
نصب دستی وابستگی‌ها:
اگر به هر دلیلی در نصب خودکار این وابستگی‌ها  توسط نصاب با مشکل بر خورد کردید، می‌توانید تک تک آنها را دانلود کرده و نصب کنید. لینک‌های مورد نظر را هم به همین دلیل قرار دادم. 
  1. node.js را از لینک مقابل دانلود کنید:  اینجا  (پیشنهاد می‌کنیم نسخه‌ی x86 آن را نصب کنید)
  2. Google Chrome را نصب کنید
  3. Git Command Line Tools را نصب کنید و توجه کنید که در هنگام نصب، گزینه مربوط به افزودن Git را به مسیر  Command Prompt  شما، انتخاب کرده باشید.
  4. Apchage Ant را  دانلود  و در مسیری از سیستم خودتان قرار دهید. 
  5. Java JDK 7 x86 را از لینک مشخص شده دانلود کنید و سپس عملیات نصب را انجام دهید.
  6. Android SDK را از آدرس مشحص شده دانلود کنید. پکیچ‌های مورد نیاز، به این SDK افزوده شده است. بعد از دانلود آن را در مسیری از سیستم خود قرار دهید.
  7. Apple iTunes و  SQLite را دانلود و نصب کنید.
  8. اگر از ویندوز 7 استفاده می‌کنید ، WebSocket4Net را از لینک مقابل دانلود کنید ( اینجا ) و سپس  فایل net45\Release\WebSocket4Net.dll  در مسیر زیر کپی کنید:
%ProgramFiles(x86)%\Microsoft Visual Studio 12.0\Common7\IDE\CommonExtensions\Microsoft\WebClient\Diagnostics\ToolWindows 

ویژوال استودیو  پیکربندی‌های مربوط به نرم افزار‌های  thrid-party (سوم شخص/ثالث: نرم افزارهایی که برای دستکاری بر روی سیستم عامل، توسط شرکت‌هایی غیر از شرکت‌های تولید کننده سیستم عامل تولید می‌شوند) را که شما نصب کرده‌اید، تشخیص می‌دهد و مسیر‌های نصب آنها را درون متغیر‌های محیطی (environment variables)  به شکل زیر نگه می‌دارد:
ADT_HOME :به مسیر نصب اندروید اشاره می‌کند
ANT_HOME: به فولدری که Apache Ant در آن قرار دارد اشاره می‌کند
JAVA_HOME: به مسیر نصب جاوا اشاره می‌کند
GIT_HOME: به مسیر نصب GIT اشاره می‌کند.
دقت کنید باید نام‌های متغیر‌ها، دقیقا به همین نام‌ها باشند.
برای تنظیم این متغیر‌ها، به مسیر Control Panel\System and Security\System وارد شده و گزینه‌ی Advanced System Setting را انتخاب کنید. سپس در پنجره‌ی باز شده گزینه‌ی Environment Variables را انتخاب کنید و در قست system variables، این 4 متغیری که ذکر شد را ایجاد کنید. سپس نیاز است این مسیر‌ها را به system path اضافه کنید. برای این کار از همان قسمت system variables متغییر path را انتخاب کرده و گزینه‌ی ویرایش را بزنید و ابتدا محتویات آن را در یک فایل notepad کپی کنید و مسیر‌های زیر را به اول آن اضافه کنید : 
%GIT_HOME%\cmd;C:\Program Files (x86)\nodejs\;%JAVA_HOME%\bin;%ANT_HOME%\bin;
%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools; C:\ProgramData\Oracle\Java\javapath;
 دقت کنید که مسیر‌های ذکر شده فقط یکبار در کل فایل وجود داشته باشند و سپس کل محتوای فایل را کپی کرده و در قسمت مربوط به path پیست کنید و با کلیک بر روی دکمه‌های OK کار را به اتمام رسانید.











نکته تکمیلی
نیازمندی Apache Cordova CTP3.1   :
یکی از سیستم عامل‌های مقابل: Windows 7, Windows 8, Windows 8.1, or Windows Server 2012 R2. 
آپدیت 4 مربوط به ویژوال استدیو (دقت کنید قبل از نصب آپدیت 4 ویژوال استدیو باید نسخه قبلی  Cordova CTP  را حذف کنید(uninstall) )
امکان توسعه اپلیکیشن‌های windows phone , windows برای کاربران ویندوز 7 وجود ندارد .

در مقاله‌ی بعدی یک پروژه جدید خواهیم ساخت .
منبع مفید برای نصب و راه اندازی :اینجا
ادامه دارد...
‫۹ سال و ۶ ماه قبل، پنجشنبه ۶ فروردین ۱۳۹۴، ساعت ۲۰:۴۰
۱۵۱۵۱
۱۲
Visual Studio 2013Apache CordovaMobile Programming
مطالب مشابه
  • #
    مرتضی رییسی مرتضی رییسی
    ‫۹ سال و ۶ ماه قبل، جمعه ۷ فروردین ۱۳۹۴، ساعت ۰۲:۵۲
    سلام!
    فایل Visual Studio Tools for Apache Cordova CTP3.1 رو دانلود کردم. منتها موقع نصب میگه:
    You must install Windows Management Framework 3.0...
    چی هست؟ و چرا باید نصبش کنم؟ درضمن از آپدیت 4 ویژوال استادیو و ویندوز 7 استفاده می‌کنم.
    ممنون!
    • #
      سالار ربال سالار ربال
      ‫۹ سال و ۶ ماه قبل، جمعه ۷ فروردین ۱۳۹۴، ساعت ۰۴:۳۲
      در واقع یک بروز رسان است که بعد از نصب این امکان رو به سیستم شما میدهد که به امکاناتی که در نسخه‌های جدید ویندوز اضافه شده است با دانلود آنها به آنها دسترسی داشته باشد. برای مثال PowerShell version 3  همراه ویندوز 8 منتشر شد ، با نصب این بروزرسان ، میتوانید در ویندوز 7 هم  به این انکانات دسترسی داشته باشند.
      اطلاعات بیشتر  
      از لینک زیر دانلود کنید 
      WMF 3.0   
      • #
        مرتضی رییسی مرتضی رییسی
        ‫۹ سال و ۶ ماه قبل، جمعه ۷ فروردین ۱۳۹۴، ساعت ۰۴:۵۱
        ممنون. به هرحال نصبش کردم. منتهای مراتب برای نصب وابستگی‌ها میگه نزدیک به 5 گیگ حافظه نیاز داره. توی تصویری که شما گذاشتین فقط 73 مگ نوشته. چطور دانلودش کنم؟ توی لیست وابستگی‌ها هم فقط WebSocket4Net اضافه شده که اونم حجمی نداره. به نظر شما مشکل کجاست؟
        • #
          سالار ربال سالار ربال
          ‫۹ سال و ۶ ماه قبل، جمعه ۷ فروردین ۱۳۹۴، ساعت ۰۸:۳۹
          طبق جستجویی که انجام دادم  چیز مفیدی به دست نیاوردم و قبلا هم خودم با این مسئله برخورد نکردم شخصی هم در وبلاگ Msdn  با همچین مسئله ای روبرو شده بود که جوابی برای سوال او داده نشده.بنده حدس میزنم به خاطر امکاناتی هست که هم اکنون بر روی سیستم شما نصب نیست و همگام به این وابستگی‌ها نصب خواهد شد.
          در کل پیشنهاد خود مایکروسافت هم ارتقا سیستم خود به ویندوز 8.1 است(برای بهرمندی از توسعه‌ی اپلیکیشن‌های ویندوز فون و ویندوز با استفاده از Cordova)
          • #
            مرتضی رییسی مرتضی رییسی
            ‫۹ سال و ۶ ماه قبل، جمعه ۷ فروردین ۱۳۹۴، ساعت ۱۹:۳۵
            سپاس. با همون 5 گیگ اقدام به نصب کردم. تعجب اینکه گویا همون 73 مگ رو نیاز داشت. (بر اساس زمان دانلود و نصب میگم)
  • #
    میثم ثوامری میثم ثوامری
    ‫۹ سال و ۶ ماه قبل، جمعه ۷ فروردین ۱۳۹۴، ساعت ۰۴:۲۱
    ممنون از مطلب آموزندتون
    SDK و تمامی وابستگیها اندروید میتونید از اینجا  دانلود کنید
  • #
    آرش مصیر آرش مصیر
    ‫۹ سال و ۶ ماه قبل، سه‌شنبه ۱۱ فروردین ۱۳۹۴، ساعت ۲۲:۱۸
    سلام و سپاس از مطلب خوبتون سوالی که مطرح میشه اینه که شنیده میشه تهیه اپلیکیشن با چنین frameworkهایی باعث میشه خروجی ایجاد شده حجیم‌تر و کند‌تر باشه. می‌خوام بدونم  این نقصان چقدر حاد هست و این که آیا شما به شخصه اپلیکیشنی رو عملیاتی کردید و مثلا خروجیتون رو با خروجی Android Studio یا سایر ابزارها مقایسه کردید؟ آیا این framework کاملا مورد اطمینان هست؟
    • #
      سالار ربال سالار ربال
      ‫۹ سال و ۶ ماه قبل، چهارشنبه ۱۲ فروردین ۱۳۹۴، ساعت ۰۲:۲۷
      سلام.
      کندی این فریمورک مربوط میشود به طبیعت خود تکنولوژی که در آن استفاده شده است.استفاده از  WebView به جای مرورگر هم باعث کاهش سرعت اجرای کد‌های جاوا اسکریپت خواهد شد. ولی حاد هم نیست  ،الان اگر این سایت  را مشاده کنید، بیشتر برنامه‌های چت و بازی، با استفاده از این فریمورک ساخته میشود. در مقابل شما لازم نیست لزوما با زبان بومی پلتفرم مورد نظر خود درگیر باشید. میتوانید از فریمورک‌های CSS , JS که الآن هم روز به روز بهینه‌تر و محبوبتر میشود ، استفاده کنید. اگر کارایی این فریمورک برای ساخت بازی‌ها کافی باشد  چرا باید برای ساخت اپلیکیشن‌های مورد نیاز ما بهینه نباشند.توجه کنید که این فریمورک ،وب اپلیکیشن ما را به زبان‌های بومی هر پلتفرم تبدیل نمی‌کند. زمانی که شما نیاز دارید به API‌های بومی سیستم عامل مورد نظری که دسترسی داشته باشید که برای آن امکان ساخت پلاگین وجود ندارد (در حال حاضر برای Calendar) در این صورت اگر برنامه شما نیاز به همچین امکانی دارد لذا نباید Cordova را انتخاب کنید.
      بنده تا حالا سمت Android Studio نرفتم اصلا و صرفا به دلیل اینکه Cordova با فیلد من(وب) نزدیکی زیادی داشت سمت آن رفتم(یکی از مزایای آن)
      در مقاله بعد در مورد این مبحث بیشتر تمرکز خواهیم کرد.
  • #
    نفسی نفسی
    ‫۹ سال و ۴ ماه قبل، جمعه ۱۵ خرداد ۱۳۹۴، ساعت ۲۲:۱۳
    برای کار کردن با پایگاه داده چطور ؟
    فرض کنید ما یک پایگاه داده در یک سرور جداگانه داریم و حالا قصد داریم از طریق برنامه به بانک متصل شده و عملیات CRUD  را پیاده سازی کنیم ، با توجه به اینکه cross platform  است و هر زبانی راهکار خود را دارد ، از چه زبانی برای یا فریم ورکی استفاده کنیم ؟
    و اینکه با توجه ب ماهیت cordova  برای امنیت connection string ای که به سرور راه دور متصل میشود ، چکاری میتوان انجام داد ؟
    آیا استفاده از وب سرویس یا web api و فراخوانی آن در cordova کار منطقی ست ؟
    • #
      محسن خان محسن خان
      ‫۹ سال و ۴ ماه قبل، شنبه ۱۶ خرداد ۱۳۹۴، ساعت ۰۳:۳۰
      در این نوع راه حل‌ها مستقیما به سرور دیتابیس وصل نمی‌شن. از یک واسط مثل ASP.NET Web API یا یک سرویس WCF استفاده می‌کنن تا ضریب امنیت رو بالا ببرن. برای کار با این‌ها یک REST Client کافی هست و در تمام سکوهای کاری یک نمونه از آن موجود هست.
  • #
    مهدی ناظم مهدی ناظم
    ‫۹ سال و ۳ ماه قبل، شنبه ۱۳ تیر ۱۳۹۴، ساعت ۰۷:۳۱

    سلام مرسی بابت مطلبتون لطفاً راهنماییم کنین
    مسیری هم که توی path دادم به این شکل هست
    C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files\Microsoft SQL Server\120\DTS\Binn\;C:\Program Files\Microsoft SQL Server\Client SDK\ODBC\110\Tools\Binn\;C:\Program Files (x86)\Microsoft SQL Server\120\Tools\Binn\;C:\Program Files\Microsoft SQL Server\120\Tools\Binn\;C:\Program Files (x86)\Microsoft SQL Server\120\Tools\Binn\ManagementStudio\;C:\Program Files (x86)\Microsoft SQL Server\120\DTS\Binn\;C:\Program Files (x86)\Windows Kits\8.1\Windows Performance Toolkit\;C:\Program Files\Microsoft SQL Server\110\Tools\Binn\;C:\Program Files (x86)\Skype\Phone\;C:\Program Files (x86)\CodeSmith\v5.2\;C:\Program Files (x86)\nodejs\;C:\Program Files (x86)\Microsoft SDKs\TypeScript\1.0\;%JAVA_HOME%\bin;%ADT_HOME%\tools;%ADT_HOME%\platform-tools;%ANT_HOME%\bin;%GIT_HOME%\cmd;C:\Program Files (x86)\nodejs\;%JAVA_HOME%\bin;%ANT_HOME%\bin;%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools;E:\Android Softwares\android-sdk Complete\android-sdk;

    مسیر sdk هم اینجا هست
    E:\Android Softwares\android-sdk Complete\android-sdk

     

    در ضمن  path قبلی هم این بود

    C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0\;C:\Program Files\Microsoft SQL Server\120\DTS\Binn\;C:\Program Files\Microsoft SQL Server\Client SDK\ODBC\110\Tools\Binn\;C:\Program Files (x86)\Microsoft SQL Server\120\Tools\Binn\;C:\Program Files\Microsoft SQL Server\120\Tools\Binn\;C:\Program Files (x86)\Microsoft SQL Server\120\Tools\Binn\ManagementStudio\;C:\Program Files (x86)\Microsoft SQL Server\120\DTS\Binn\;C:\Program Files (x86)\Windows Kits\8.1\Windows Performance Toolkit\;C:\Program Files\Microsoft SQL Server\110\Tools\Binn\;C:\Program Files (x86)\Skype\Phone\;C:\Program Files (x86)\CodeSmith\v5.2\;C:\Program Files (x86)\nodejs\;C:\Program Files (x86)\Microsoft SDKs\TypeScript\1.0\;%JAVA_HOME%\bin;%ADT_HOME%\tools;%ADT_HOME%\platform-tools;%ANT_HOME%\bin;%GIT_HOME%\cmd


    اما ارور زیر همچنان بر قرار است

     
    • #
      سالار ربال سالار ربال
      ‫۹ سال و ۲ ماه قبل، شنبه ۲۰ تیر ۱۳۹۴، ساعت ۰۲:۱۰
      خود بنده هم قبلا به همچین مشکلی برخورده بودم  و مجبور شدم  به شکل زیر از قسمت Tools-->options ، این متغییر را اوراید کنم .