علی یگانه مقدم علی یگانه مقدم
اشتراک‌ها
دیالوگ های بوت استراپ با استفاده از jquery

اگه از نوشتن کد زیاد html برای ایجاد دیالوگ خسته شدید یا قصد دارید با عملیات کدنویسی آزادتری روی دبالوگ‌ها داشته باشید از این پلاگین استفاده کنید.

سورس در گیت هاب 

نسخه MVC آن 

دیالوگ های بوت استراپ با استفاده از jquery
‫۹ سال و ۴ ماه قبل، پنجشنبه ۲۸ خرداد ۱۳۹۴، ساعت ۰۴:۳۸
وحید نصیری وحید نصیری
اشتراک‌ها
برنامه GitHub Desktop

GitHub Desktop is a seamless way to contribute to projects on GitHub and GitHub Enterprise.

برنامه GitHub Desktop
‫۹ سال و ۲ ماه قبل، جمعه ۳۰ مرداد ۱۳۹۴، ساعت ۰۰:۵۰
علی یگانه مقدم علی یگانه مقدم
مطالب
آشنایی با فریمورک الکترون Electron
فریمورک الکترون، ساخته شده توسط Github، مدتی است سر و صدای زیادی به پا کرده است و شرکت‌های بزرگی در حال استفاده‌ی از این فریمورک در برنامه‌های دسکتاپ خود هستند که Microsoft Visual Studio Code یکی از آنهاست. الکترون از چند لحاظ مورد لطف جامعه‌ی برنامه نویسان قرار گرفته است که تعدادی از علل آن را بررسی می‌کنیم:

  1. ساخت برنامه‌های دسکتاپ به صورت چندسکویی (ویندوز، لینوکس، مک)
  2. استفاده از HTML,CSS,JavaScript که طراحان وب در این زمینه با آن به آسانی ارتباط برقرار می‌کنند.
  3. قابلیت استفاده از کتابخانه‌های قدرتمند تحت وب چون Bootstrap,Jquery,Angular Js و ...
  4. متن باز و رایگان است.
برای راه اندازی الکترون نیاز است که یکی از بسته‌های Node.js یا IO.js را نصب نمایید تا از طریق مخزن npm نسبت به نصب آن اقدام کنیم. محیط کنسول آن را باز میکنیم و مشغول نوشتن می‌شویم. ابتدا از طریق npm در دایرکتوری پروژه، فایل package.json را ایجاد می‌کنیم. بدین منظور دستور زیر را در کنسول وارد می‌کنیم:
D:\electron\test1>npm init
تعدادی سوال از شما میکند و بر اساس پاسخ‌هایتان فایل package.json را می‌سازد که فعلا می‌توانید وارد نکنید و بعدا طبق میلتان آن را ویرایش کنید. بعد از آن نیاز است الکترون را داخل این دایرکتوری نصب کنیم تا در لیست وابستگی‌های (Dependencies) فایل Package.json قرار بگیرد. برای نصب آن لازم است دستور زیر وارد کنید:
npm i electron-prebuilt --save-dev
دستور بالا با فلگ save  یا s، باعث می‌شود نسخه‌ی prebuilt الکترون به عنوان یکی از وابستگی‌ها، به سیستم اضافه شود و فلگ dev اعلام می‌دارد که بسته‌ی الکترون را در وابستگی‌های توسعه و دیباگینگ قرار بده.

 لازم است در اینجا توضیحی کوتاه در مورد انواع وابستگی‌ها داشته باشیم:

Dependencies این نوع از وابستگی‌ها، بسته‌هایی را نصب میکنند که شما از آن‌ها در کدهایتان استفاده می‌کنید و در آینده به همراه پروژه کمپایل می‌شوند. به طور خودکار وقتی بسته‌ای را به عنوان وابستگی معرفی میکنید، npm وابسته‌های آن بسته را به صورت درختی بررسی می‌کند و آن‌ها را هم نصب میکند.

DevDependencies : این نوع از وابستگی‌های برای کارهای دیباگینگ و ... است؛ مثل آزمون واحد و ... که نیازی نیست در کامپایل نهایی لحاظ گردند. اگر این نوع کتابخانه‌ها را به جای devdependencies به dependencies ارسال کنید، اتفاق خاصی نمی‌افتد. ولی در حجم برنامه‌ی نهایی شما تاثیرگذار خواهند بود.

PeerDependencies: این نوع وابستگی‌ها برای معرفی بسته‌هایی استفاده می‌شوند که در پلاگین‌هایی که استفاده می‌کنید تاثیر دارند. ممکن است پلاگینی نیاز به استفاده‌ی از یک بسته را دارد، ولی آن را در کد، Require نکرده باشد (در مورد Require بعدا صحبت می‌کنیم). ولی برای اجرا نیاز به این بسته دارد. به همین دلیل از نسخه‌ی 3 به بعد، به شما هشدار میدهد که این بسته‌ها را نیز لحاظ کنید (تا نسخه‌ی npm2 به طور خودکار نصب می‌شد). همچنین نسخه بندی این وابستگی‌ها را نیز در نظر می‌گیرد. این حالت را می‌توانید مانند پلاگین‌های جی‌کوئری تصور کنید که نیاز است قبل از آن‌ها، کتابخانه‌ی جی‌کوئری صدا زده شود؛ در صورتی که در خود پلاگین، جی کوئری صدا زده نشده است.

ویرایشگر اتم
قبل از اینکه بخواهیم کدنویسی با هر زبانی را آغاز کنیم، عموما یک ادیتور مناسب را برای کارمان بر می‌گزینیم. الکترون نیازی به ادیتور خاصی ندارد و از Notepad گرفته تا هر ادیتور قدرتمند دیگری را می‌توانید استفاده کنید. ولی ادیتور اتم Atom که توسط خود الکترون هم تولید شده است، برای استفاده رایج است. ویژوال استودیو هم در این زمینه بسیار خوب و قدرتمند ظاهر شده است و حاوی Intellisense هوشمندی است.
 
این ادیتور که با ظاهری جذاب، توسط تیم گیت هاب تولید شده است، یک ویرایشگر متن باز با قابلیت توسعه و تغییر پذیری بالاست و از بسته‌های Node.js پشتیانی میکند و به صورت داخلی مجهز به سیستم گیت می‌باشد. بیشتر فناوری‌های استفاده شده در این ویرایشگر، رایگان بوده و دارای جامعه‌ی بزرگ متن باز می‌باشند. از فناوری‌های مورد استفاده‌ی آن می‌توان به الکترون، CoffeScript ، Node.js ,LESS و ... اشاره کرد. شعار سازندگان این ادیتور «یک ویرایشگر قابل هک برای قرن 21» می‌باشد.
برای پشتیبانی از زبان‌های مختلف، حاوی تعدادی زیادی پلاگین پیش فرض است مانند روبی ، سی شارپ، PHP ,Git,Perl,C/C++, Go,Objective-C,YAML و ...

آغاز کدنویسی
بگذارید کدنویسی را شروع کنیم. اگر اتم را نصب کرده باشید، می‌توانید با وارد کردن عبارت زیر، پروژه خود را در ادیتور باز کنید:
atom .
نماد "." به معنی دایرکتوری جاری است و به ادیتور اتم می‌گوید که این دایرکتوری را به عنوان یک پروژه، باز کن. بعد از باز شدن می‌توانید ساختار دایرکتوری و فایل‌ها را در سمت چپ ببینید. فایل package.json را باز کنید و به شکل زیر، آن را تغییر دهید:
{
  "name": "electron",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "electron ."
  },
  "author": "",
  "license": "ISC"
}
این تغییر، شامل حذف خصوصیت test و افزودن خصوصیت start به بخش scripts است. مقدار خصوصیت start را برابر . electron بگذارید تا موقع اجرا و تست پروژه، الکترون، پروژه‌ی موجود را در دایرکتوری جاری که فایل package.json در آن قرار دارد، اجرا کند. در بخش Main، نام فایل آغازین را نوشته است که باید آن را بسازید ( اگر این خصوصیت وجود هم نداشته باشد به طور پیش به این مقدار تنظیم شده است). به همین علت New File را اجرا کنید تا فایل Index.js را بسازید:
const electron = require('electron');
const {app} = electron;
const {BrowserWindow} = electron;
سه خط بالا را می‌نویسیم ، اولین خط نیاز ما را به کتابخانه و شیء الکترون فراهم می‌کند و بعد از آن، از الکترون درخواست دو شیء را به نام‌های app و BrowserWindow، می‌کنیم. شیء app مسئول چرخه‌ی زندگی اپلیکیشن است و موارد مربوط به آن را کنترل می‌کند؛ مثل رویدادهایی که ممکن است در برنامه رخ بدهند که در جلوتر با یکی از این رویدادهای آشنا می‌شویم. شیء BrowserWindow می‌تواند برای شما یک نمونه پنجره‌ی جدید را ایجاد کند و بتوانید آن پنجره را از این طریق مدیریت کنید.
let win;
app.on('ready', function() {
  // Create the browser window.
  win = new BrowserWindow({
           width: 800,
           height: 600
     });
});
در قسمت بعدی برای رویداد ready، یعنی زمانیکه الکترون آماده سازی‌ها را انجام داده است و برنامه آماده بارگذاری است، متدی را تعریف می‌کنیم که در آن یک پنجره‌ی با پهنای 800 پیکسل در 600 پیکسل، می‌سازد.این پنجره، پنجره‌ی اصلی شماست. کلمه‌ی کلید let و const را که می‌بینید، جز قوانین جدید Ecma Script هستند که در سایت جاری قبلا به آن‌ها پرداخته شده است و از تکرار آن خودداری می‌کنیم. دلیل اینکه متغیر win را به صورت عمومی تعریف کردیم این است که این احتمال زیاد می‌رود بعدا با اجرای سیستم Garbage در جاوااسکریپت، پنجره به طور خودکار بسته شود.
اکنون در کنسول می‌نویسیم:
npm start
حال npm با بررسی خصوصیت start در فایل package.json دستور . electron را اجرا خواهد کرد و برنامه‌ی ما، یک پنجره‌ی خالی را نمایش خواهد داد.
برای اینکه اولین برنامه واقعا خالی نباشد و ظاهری به آن بدهیم، یک فایل html می‌سازیم و در callback رویداد ready، بعد از ساخت پنجره آن را صدا می‌زنیم:
win.loadURL(`file://${__dirname}/index.html`);
با متد loadURL به راحتی می‌توانید یک صفحه‌ی وب را از شبکه و یا از روی سیستم، بخوانید. در بخش آرگومان، از پروتکل فایل استفاده شده است تا به آن بگوییم فایل مورد نظر روی سیستم جاری است. عبارت بعدی که به صورت template string تعریف شده‌است، حاوی مسیر index.js یا همان startup path است و سپس فایل index.html معرفی شده‌است. مجددا برنامه را اجرا کنید تا فایل index.html خود را داخل آن ببینید.
‫۸ سال و ۵ ماه قبل، سه‌شنبه ۴ خرداد ۱۳۹۵، ساعت ۰۱:۳۵
مهدی پایروند مهدی پایروند
مطالب
راه اندازی سرور Git با استفاده از Bonobo Git Server و انتقال از ساب ورژن به گیت
تا چندی پیش شاید برای استفاده‌ی از گیت و راه اندازی سرور عملیاتی آن در ویندوز، مشکلاتی مانند سبک راه اندازی آن که لینوکسی و کامندی بود، مانعی برای استفاده بود. ولی با استفاده از Bonobo Git Server که با ASP.NET MVC نوشته شده‌است و بصورت مدفون شده (embedded) از گیت استفاده می‌کند، راه انداختن سرور گیت خیلی آسان و با مراحلی خیلی کمتر و پسندیده‌تر، قابل انجام است. من تا مدتی قبل، برای استفاده‌ی شخصی به مدتی طولانی از Subversion برای نگهداری تاریخچه‌ی پروژه‌ها استفاده و حتی مثالهایی را که می‌نوشتم در این سرور ذخیره می‌کردم. ولی با توجه به سرعت فوق العاده‌ای که گیت داشت و نیز یکپارچگی که با آن در داخل ویژوال استودیو به‌وجود آمده، شاید بد نباشد حتی برای استفاده‌ی شخصی و بصورت تیم تک نفره هم این سورس کنترلر قوی را انتخاب کرد.
برای این منظور ابتدا آخرین نسخه‌ی  Bonobo Git Server را از آدرس مخرن آن دریافت می‌کنید و با توجه ویندوز، پیشنیاز‌های آن را نصب می‌کنیم:
- نصب و راه اندازی IIS
- نصب دات نت فریمورک 4.5
- نصب ASP.NET MVC نسخه 4.0
مانند هاست کردن یه برنامه وب ASP.NET محتوای آن را هاست میکنیم:
 همانطور که در تصویر زیر می‌بینید، این برنامه از فولدر App_Data بصورت پیش فرض برای نگهداری گیت و مخازن آن استفاده کرده است :

این سرور در فایل config.xml قرار گرفته در فولدر App_Data، تنظیمات مربوط به فراخوانی‌هایی را که در داخل برنامه‌ی وب به گیت می‌دهد، ذخیره می‌کند؛ از جمله در آن مشخص می‌شود که فولدر نگهداری مخازن کجا قرار گرفته‌است. من برای استفاده، این آدرس را به درایوی غیر از درایو ویندوز تغییر دادم:
<?xml version="1.0"?>
<Configuration xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
  <AllowAnonymousPush>false</AllowAnonymousPush>
  <Repositories>D:\GitRepo</Repositories>
  <AllowUserRepositoryCreation>true</AllowUserRepositoryCreation>
  <AllowAnonymousRegistration>false</AllowAnonymousRegistration>
  <DefaultLanguage>en-US</DefaultLanguage>
  <IsCommitAuthorAvatarVisible>true</IsCommitAuthorAvatarVisible>
</Configuration>
و در ادامه باید در این فولدر، به کاربر IIS دسترسی خواندن و نوشتن داد:

حالا آدرس مربوط به سرور وب آن را در مرورگر وارد می‌کنیم و با کاربر admin و کلمه‌ی عبور admin وارد سیستم می‌شویم.

قابلیت جالبی که در اینجا به نظر من خیلی مهم بود، استخراج تاریخچه‌ی کامل ساب ورژن توسط گیت و انتقال همه آنها به مخزن گیت است که تنها با یک خط فرمان انجام پذیر است. برای اینکار مخرنی را در گیت ساخته و آدرس .git آن را برای اجرای فرمان نگه می‌داریم:

البته نصب گیت برای ویندوز برای صدور فرمان انتقال به گیت الزامی است که می‌توانید از این آدرس آن‌را دانلود و نصب کنید.

پس از آن در 2 مرحله مخرن ساب ورژن را به گیت انتقال می‌دهیم:

1- استخراج آن در یک مخزن لوکال

2- افزودن به سرور گیت (که راه اندازی شده)

برای استخراج مخزنی از ساب ورژن به یک مخزن لوکال گیت، یک فولدر خالی را ایجاد می‌کنیم. سپس با خط فرمان به آن وارد می‌شویم و بعد فرمان زیر را اجرا می‌کنیم:

در ادامه نام کاربری و کلمه‌ی عبور را وارد می‌کنیم. البته به صورت پیش فرض، نام کاربری جاری ویندوز را در نظر می‌گیرد و بعد نام کاربری و کلمه‌ی عبور سرویس ساب ورژن را می‌پرسد و حالا گیت کارش را شروع میکند:


پس از اتمام کار با توجه به مقاله‌ی «مراحل ارسال یک پروژه‌ی Visual Studio به GitHub» برای کار با گیت در ویژوال استودیو، می‌توان به کار با گیت بصورت ریموت ادامه دهید.

و اما نکته‌ی آخر: من برای استفاده از این سرور مجبور بودم که نام localhost را با نام mehdi-pc جابجا کنم تا بتوانم از طریق یک کامپیوتر دیگر با سورس کنترل کار کنم و طی جستجوهایی که در اینترنت کردم، این کار بصورت کامند و فرمان‌های شبه لینوکسی انجام پذیر بود. ولی راهی را همچون این مقاله «مشکل در جابجایی پروژه‌های svn» پیدا کردم که بنظرم آن‌را مرتبط با موضوع می‌دانم و گفتن آن را خالی از لطف نمی‌بینم.

فایل config در واقع فایل کانفیگ داخل مخزن لوکال است؛ یعنی داخل فولدر .git و بصورت متنی ذخیره شده است:

طبق انتظار قسمتی از فایل که در زیر آمده، مربوط به مشخصات اتصال به سرور ریموت میباشد:

[remote "origin"]
url = http://mehdi-pc:8551/NewsService.git
fetch = +refs/heads/*:refs/remotes/origin/*

البته باید بسیار با دقت این تغییر را ایجاد کنید و مطمئن باشید که آدرس را بطور صحیح و به یک مخزن درست گیت تغییر می‌دهید.

‫۹ سال و ۶ ماه قبل، پنجشنبه ۱۷ اردیبهشت ۱۳۹۴، ساعت ۲۳:۳۰