حساب‌فان (انگولار دوست نداشتنی)

تو پست‌های قبل بک‌اند نوشتیم، پروژه فرانت‌اند ایجاد کردیم، برای وب و اندروید بیلد گرفتیم، الآن میخوایم شروع کنیم با انگولار کد زدن امیدوارم مبانی Angular cli بلد باشید چون قرار نیست خیلی تو مسائل ریز بشم، اول اینکه با scss کار میکنم برام راحت‌تر از css هست، با دستور پایین پیش فرض پروژه scss میشه:

ng set defaults.styleExt=scss

به چندتا ماژول اضافی نیاز داریم برای ساخت اپ مورد نظرمون، پس با این دستورات نصب‌شون می‌کنیم:

npm install @angular/material @angular/cdk @angular/animations hammerjs @angular/flex-layout angular2-moment ng2-webstorage angular2-jwt @ngx-translate/core rxjs --save

حالا ماژول shared ایجاد می‌کنیم، ماژول‌هایی مثل ترجمه خودکار، لاگین کاربر، متریال دیزاین و... که برای تمام کامپونتت‌ها نیاز داریم اینجا اضافه می‌کنیم. (نمی‌خوام شلوغش کنم چون تعداد ماژول‌ها زیاد بود کد ایجا نمیذارم از گیت بخونید)

برای سرویس ترجمه‌ای که استفاده می‌کنیم در فولدر src/assets/i18n بعد ایجاد هر کامپوننت فایل ترجمه بسازید.

همچنین به روتر نیاز داریم، ماژول روتر خارج از شرد ایجاد می‌کنیم.

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

ماژول لاگین نوشتیم، واضحه چیکار میکنه، به همین خاطر براش سرویسی راه انداختیم تا تو همه اپ اطلاعات کاربر داشته باشیم.

منوی سمت راست اضافه کردیم که بعد لاگین نمایش داده میشه.

همچنین یه اندپوینت و میدلور به بک‌اند اضافه کردیم.

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

تو قسمت بعد بیلد اتوماتیک برای وب و اپ اندروید بهش اضافه میکنیم.

از این به بعد استراکچر کد آمادس فقط باید یه وب سرور ران کنیم و تک تک فیچرها اضافه کنیم، خلاصه می‌تونیم شروع کنیم به کار اصلی‌مون :)

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