وبلاگ شخصی
محمّدرضا
علی حسینی

جایی که تجربیات, علایق
و چیزهایی که یادگرفته‌ام را
با هم مرور می‌کنیم.

چرا به یک کتابخانه‌ی دیگر برای انگولار نیاز داشتیم؟

چرا به یک کتابخانه‌ی ngx-persian برای انگولار نیاز داشتیم؟ به عدد برنامه‌نویس‌های جاوااسکریپت، لایبری و فریمورک برای این زبان ساخته شده است. به همین خاطر خیلی‌ها فکر می‌کنند که دیگر لازم نیست کتابخانه‌ی جدیدی برای جاوااسکریپت بنویسیم. نظری که بعید می‌دانم کسی که حتّی یک اپلیکیشن فارسی توسعه داده است آن را بپذیرد. مشکل ما توسعه‌دهندگان فارسی زبان به قدمت خود کامپیوتر است. از آن زمان‌ها که برای دو کلمه فارسی نوشتن باید در به در دنبال یک فارسی ساز می‌گشتیم تا حالا که برای استفاده از تاریخ جلالی، اعتبارسنجی متن‌ها و اعداد و هرچیز دیگری که مختص به ایران است با مشکل مواجهیم. مشکل برای افرادی که با Angular کار می‌کنند جدی‌تر است. حالا شاید بتوانید چندتا چیز نصفه‌نیمه برای خود جاوااسکریپت پیدا کنید، امّا برای انگولار، مخصوصاً نسخه‌های جدید، هیچ‌چیز به‌دردبخوری نیست. به همین خاطر من یک سری از کدهایی که قبلاً زده بودم را مرتب و منظم کردم و در یک کتابخانه‌ی جدید به نام ngx-persian منتشرش کردم. امّا قبل از اینکه به سراغ خود کتابخانه برویم، ببینم که چه مشکلاتی پیش از این داشتیم؟

چه مشکلاتی وجود داشت که بدون این کتابخانه حل نمی‌شد؟

اعداد فارسی

اعداد فارسی از نظر هیچ‌کدام از زبان‌های برنامه‌نویسی عدد نیستند. صرفاً کاراکترهای متنی‌‌ای مانند دیگران اند. ما خیلی جاها نیاز داریم که از کاربر عدد بگیریم، امّا نتیجه را به صورت اعداد فارسی به او نشان بدهیم. خیلی جاها هم صرفاً به ارقام انگلیسی نیاز داریم و لازم است که ارقام فارسی را به آن‌ها تبدیل کنیم. تازه مسئله این است که بعضی کیبردها به جای اعداد فارسی ۴ تا ۶، از کاراکترهای عربی استفاده می‌کنند که باز هم کار را برای ما سخت می‌کند. یعنی یک عدد تایپ‌کردن ساده هم برای ما با کلّی مصیبت همراه است.

حروف فارسی

شما برای اینکه بفهمید یک متن با حروف فارسی نوشته شده است یا نه چه کار می‌کنید؟ دنبال حروف انگلیسی درونش می‌گردید؟ خب اگر حروف چینی وارد شده بود چی؟ از کجا می‌فهمید که یک متن کاملاً فارسی است یا بخش‌هایی از آن فارسی است و  بخش‌های دیگر به زبان‌های دیگر نوشته شده اند؟ خیلی‌ها از کیبردهایی استفاده می‌کنند که در آن‌ها تنها «ی» و «ک» عربی وجود دارد. چطوری نام کاربرانتان را با یک استاندارد و صرفاً به صورت فارسی ذخیره می‌کنید؟ اعتبارسنجی عبارات فارسی هم خودش دردسر دیگری است که توسعه‌دهنده‌ی سیاه‌بخت ایرانی باید با آن سر و کلّه بزند.

تاریخ شمسی

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

این شماره موبایل معتبر است؟

مشکل بزرگ بعدی اعتبارسنجی شماره‌ی تلفن همراه کاربران ایرانی است. معدود کتابخانه‌های موجود صرفاً به یک regular expression ساده کفایت می‌کنند. اگر ۱۱ رقم داشت و با 09 شروع شد حتماً موبایل است. با این حساب «09556471235» یک شماره موبایل است. امّا هیچ‌کدام از اپراتورهای ایرانی اصلاً چنین پیش‌شماره‌ای ندارند.

انگولار زنده است، کتابخانه‌های ایرانی نه

انگولار مدام در حال پیشرفت و توسعه است. نسخه‌های جدید می‌آیند و توسعه‌دهندگان به آن‌ها مهاجرت می‌کنند. امّا کتابخانه‌های محدود ایرانی موجود اینطوری نیستند. برخی  از این مشکلاتی که گفتم را برخی از کتابخانه‌ها حل کرده اند. مسئله این است که آن‌ها بیش از حد آپدیت‌نشده  اند. برخی از آن‌ها issue  هایی برای چند سال پیش دارند که هنوز که هنوز است پاسخی به آن‌ها داده نشده است. بقیه هم دیگر به درد استفاده در نسخه‌های جدید انگولار (نسخه‌ی ۴ به بعد) نمی‌خورند. بله، شما باید همه‌چیز را خودتان از نو بنویسید.

راه حل های موجود برای انگولار ساخته نشده اند

برای برخی از این مشکلات راه حل هایی وجود دارد، امّا هیچ‌کدام برای انگولار ساخته نشده اند. نه pipe های درست و حسابی‌ای ساخته شده اند، نه سرویس‌های Injectable دارند  و نه اکثر اوقات به زبان Typescriptنوشته شده اند. اکثر راه حل ها صرفاً وصله‌ای بین کد جاوااسکریپت ناکافی به انگولار اند.

چرا باید از کتابخانه‌ی ngx-persian استفاده کنیم؟

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

یک کتابخانه برای تمام مشکلات

شما اگر الان بخواهید بخشی از مشکلاتتان را حل کنید، باید چندین کتابخانه‌ی مختلف را نصب کنید. به علاوه تمام این کتابخانه‌ها در کنار هم باز نمی‌توانند تمامی مشکلاتی که گفتیم را حل کنند. امّا در ngx-persian راه حل کامل تمامی مشکلاتی که دیدیم کنار هم قرار دارند. یعنی به جای اینکه با چندین کتابخانه بخشی از مشکلاتتان را حل کنید، با استفاده از همین یک کتابخانه می‌توانید تمام مشکلات را برطرف کنید (به جای آنکه چندین کتاب بخوانید، کتاب‌های گاج را چندین بار بخوانید).

ngx-persian زنده است

این کتابخانه برای نسخه‌های جدید انگولار ساخته شده است. شما به راحتی می‌توانید آن را روی انگولار ۷ و نسخه‌های پایین‌تر استفاده کنید. برعکس اکثر کتابخانه‌های دیگر که عملاً روی نسخه‌های جدید انگولار قابل استفاده نیستند. به علاوه این کتابخانه زنده است و توسعه‌ی آن رها نشده است. شما اگر جست و جو کنید کتابخانه‌های فارسی‌ای را می‌بینید که issue های پاسخ‌داده نشده ای از سال‌ها قبل دارند و از آخرین آپدیت آن‌ها سال‌ها می‌گذرد.

کتابخانه‌ای برای Angular

این کتابخانه برای انگولار ساخته شده است. به  جای اینکه ملغمه‌ای از روش‌های مربوط به جاوااسکریپت و کلاس‌های مختلف باشد، از روش انگولار برای حل مسائل استفاده کرده است. در این کتابخانه از سرویس‌های Injectable استفاده شده است. به علاوه مجموعه‌ای از pipe ها برای استفاده در template درونش قرارگرفته است. تازه شما به توابع validatorی که برای reactive form ها ساخته شده اند و directive هایی که برای فرم‌های template-driven ساخته شده اند دسترسی دارید. تمام کتابخانه به زبان Typescript نوشته شده است و هیچ وصله‌ای به جاوااسکریپت درونش وجود ندارد.

همه چیز تست شده و قابل اطمینان است

در ngx-persian تقریباً همه‌چیز تست شده است. بیشتر از ۵۹۰ تا unit test تا الان در آن نوشته شده است و test coverage آن برابر با ۹۰٪ است. یعنی شما با خیال راحت می‌توانید از بخش‌های مختلف آن استفاده کنید.

چیز غیر قابل فهمی وجود ندارد

یکی دیگر از ویژگی‌های این کتابخانه که آن را از دیگر کتابخانه‌ها متمایز می‌کند، داشتن مقدار زیاد و خوبی داکیومنت است. علاوه بر داکیومنت مفصّل شیوه‌ی استفاده در گیت‌هاب، داکیومنت‌های دقیق و کاملی برای تمامی بخش‌های کد در code document آن وجود دارد. توضیحات، مثال‌ها و ارجاعات مختلف هیچ جای غیر قابل فهمی برای شما باقی نمی‌گذارند و شما می‌توانید همه‌چیز را به خوبی و راحتی فرا بگیرید. به علاوه برای برخی بخش‌ها یک اپلیکیشن تست هم آماده شده است که می‌توانید از آن هم برای بهتر یادگرفتن نحوه‌ی کار استفاده کنید.

ngx-persian چه امکاناتی را برای ما فراهم می‌کند؟

حالا که درمورد ویژگی‌های این کتابخانه صحبت کردیم، بهتر است ببینیم که این کتابخانه چه امکاناتی را برای ما فراهم می‌کند؟

pipe ها

برای تبدیل و فرمت‌دادن به مقادیر در تمپلیت‌ها، چندین pipe مختلف آماده شده اند. از این pipe ها می‌توان برای: تبدیل اعداد فارسی به انگلیسی و بالعکس، فرمت‌دادن انعطاف‌پذیر به قیمت‌ها با واحد‌ها متفاوت (ریال و تومان) و فرمت‌دادن به شماره‌ی ملّی استفاده کرد.

سرویس‌ها

سرویس‌های مختلفی در این کتابخانه قرار داده شده اند. سرویس‌هایی برای تبدیل اعداد فارسی به انگلیسی و برعکس، تبدیل حروف و اعداد عربی به فارسی و اعتبارسنجی زبان ورودی‌ها (فارسی بودن اعداد یا حروف، شامل زبان فارسی بودن ورودی و…). به علاوه سرویس‌هایی برای تبدیل تاریخ شمسی به میلادی و برعکس، اطمینان از درست بودن تاریخ شمسی وارد شده و تقریباً هر کاری که به تاریخ جلالی مربوط می‌شود هم در آن قرار دارند. به تمام این‌ها می‌توانید یکی از دقیق‌ترین و احتمالاً کامل‌ترین سرویس اعتبارسنجی شماره‌ی تلفن همراه، فهمیدن اپراتور و… را هم اضافه کنید.

تاریخ جلالی

مهم‌ترین بخش این کتابخانه معرفی کلاس JDate است. این کلاس به صورت کامل اینترفیس Date جاوااسکریپت را پیاده‌سازی کرده است. یعنی دقیقاً همان آبجکت Date، امّا این بار برای تاریخ جلالی. چرا این مهم است؟ چون شما می‌توانید در هر متد یا تابعی که تا به امروز شی Date جاوااسکریپت را قبول می‌کرد، از JDate استفاده کنید.  و این یعنی بدون هیچ زحمتی از تمامی ابزارهایی که برای تاریخ میلادی ساخته شده‌اند، می‌توانید برای تاریخ شمسی استفاده کنید. انگار که خود جاوااسکریپت شی Dateش را برای تاریخ جلالی ساخته باشد. حالا تمامی ۵۲ متد کلاس Date را برای تاریخ جلالی در اختیار دارید. به علاوه‌ی چند متد دیگر برای فرمت دادن تاریخ به شکل دلخواه و… .

Validator ها

یک مسئله‌ی خیلی مهم اعتبارسنجی ورودی فرم‌ها هنگام کار با داده‌های فارسی است. در این کتابخانه validator های مختلفی را برای اعتبارسنجی ورودی‌های فارسی قرار داده ایم تا دیگر لازم نباشد برای اعتبارسنجی ورودی خودتان دست به کد بشوید. به علاوه برای فرم‌های template-driven هم directive هایی برای اعتبارسنجی اضافه شده اند.

یعنی این کتابخانه تمامی ابزارهای پایه برای ساخت یک اپلیکیشن فارسی را برای شما فراهم می‌کند.

چطوری از ngx-persian استفاده کنیم؟

برای نصب این کتابخانه کافی است که دستور زیر را در دایرکتوری پروژه‌ی انگولارتان اجرا کنید:

npm install ngx-persian --save

برای اینکه ببینید دقیقاً چه چیزهایی درون این کتابخانه وجود دارد و چطوری می‌توان از آن‌ها استفاده کرد، کافی است به داکیومنت موجود در مخزن گیت‌هاب ngx-persian مراجعه کنید. آنجا همه‌چیز با جزئیات و با مثال توضیح داده شده است.

حالا که کلّیات را فهمیدید، اگر نیاز به اطّلاعات بیشتر داشتید، می‌توانید به داکیومنت کامل کد مراجعه کنید و همه چیز را دقیق و کامل ببینید. حتّی نحوه‌ی انجام کوچکترین کارها را. شما هم می‌توانید زندگی را برای دولوپرهای ایرانی راحت‌تر کنید ngx-persian اوّل راه است. با اینکه گام خوبی برای راحت‌تر کردن توسعه‌ی اپلیکیشن‌های ایرانی است، امّا نیاز به بهبود زیادی دارد. شما هم مطمئناً کدهایی دارید که به درد اپلیکیشن‌هایی که برای ایرانی‌ها یا دیگر فارسی‌زبان‌ها ساخته شده اند می‌خورد. با اضافه‌کردن آن‌ها به این کتابخانه می‌توانید به تعداد زیادی دولوپر کمک کنید. حتّی اگر اینطوری هم نیست، با بهبود بخشیدن داکیومنت‌ها یا اضافه‌کردن تست‌های بیشتر یا حتّی توسعه‌ی همان اپلیکیشن تست، می‌توانید به خیلی از توسعه‌دهنده‌ها کمک کنید.

در مورد اینکه کدهای اضافه‌شده باید چطوری باشند در آخر داکیومنت موجود در گیت‌هاب توضیح داده ام. با مشارکت در این پروژه هم به خودتان و هم به بقیه‌ی توسعه‌دهنده‌ها کمک بزرگی می‌کنید. اگر وارد صفحه‌ی پروژه شدید، با دادن star ⭐️ به آن می‌توانید به بیشتر دیده شدنش هم کمک کنید. پیشاپیش ممنون از حمایت و مشارکتتان. امیدوارم در تمامی زبان‌ها و پلتفرم‌ها توسعه‌دهنده‌های ایرانی شروع به منتشر کردن کدهایی که برای همه مفید است بکنند.

The form you have selected does not exist.

یا حرفه‌ای شو یا برنامه‌نویسی را رها کن.

چطور می‌شود در بازار کار خالی از نیروی سنیور ایران، بدون کمک دیگران و وقت تلف‌کردن خودت را تبدیل به یک نیروی باتجربه بکنی؟

پاسخ ساده است. باید حرفه‌ای بشوی. چیزی که من در این کتاب به تو یاد خواهم داد.

«نوشته‌های مرتبط»

6 پاسخ به “چرا به یک کتابخانه‌ی دیگر برای انگولار نیاز داشتیم؟”

  1. رامین گفت:

    سلام
    ممنون بابت زحماتی که کشیدید، اگر بتونید یه datepicker هم اضافه کنید عالی میشه

  2. محمد جواد گفت:

    سلام . کابخانه عالی و جامعی هستش
    ولی من هر چی گشتم نتونستم متدی رو پیدا کنم که بشه تایمزون رو هم ست کرد . هر چند این متد داخل شی تاریخ خود جاوا اسکریپت هم نیست
    اگر متدی وجود داشت که میشد فارغ از منطقه زمانی کاربر، بشه تاریخ و ساعت رو به وقت محلی ایران نمایش داد خیلی عالی میشد.

  3. امید گفت:

    سلام وقت بخیر
    من این کتابخانه ارزشمند رو نصب کرده م اما در استفاده از JDate با این خطا مواجه میشم. ممنون میشم راهنمایی بفرمایید که چطور باید حلش کنم.

    Error: node_modules/ngx-persian/lib/Pipes/jdate.pipe.d.ts:34:22 – error NG6002: Appears in the NgModule.imports of AppModule, but could not be resolved to an NgModule class.

    This likely means that the library (ngx-persian) which declares JdatePipe has not been processed correctly by ngcc, or is not compatible with Angular Ivy. Check if a newer version of the library is available, and update if so. Also consider checking with the library’s authors to see if the library is expected to be compatible with Ivy.

    34 export declare class JdatePipe implements PipeTransform {
    ~~~~~~~~~

  4. بهادر نظری فرد گفت:

    درود و آفرین.
    هرچند من تازه میخوام استفاده کنم ولی اینکه کتابخانه زنده است و پشتیبانی میشه خیلی با ارزشه.
    یک سئوال: jdate.min.js آیا با JDate شما دقیقا یکسان است (به معنای تبدیل آبجکتها به یکدیگر) یا تفاوت دارد؟

    • PerAdmin گفت:

      لطفاً لینک چیزی که تشابهش را می‌پرسید ارسال بفرمایید. متوجّه نمی‌شوم که jdate.min.js چه چیزی است.

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

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

«نوشته‌های ویژه»

«نوشته‌های محبوب»

«دیدگاه کاربران»