angular vs asp.net core (بخش سوم)

• آموزش فارسي انگولار (بخش دوم)

هر بخش از آموزش angular و aso.net core یک مفهوم اصلی را پوشش میدهد، اگر احساس میکنید یک بخش برای شما تکراری میباشد و به مطالب آن مسلط میباشید میتوانید آن بخش را نادیده گرفته و به بخش های بعدی مراجعه نمایید. بر عکس اگر از ابتدا تا انتهای این مسیر ما را همراهی کنید در آخر به مفاهیم سودمندی در زمینه ASP.NET Core و Angular دست خواهید یافت. انجام پروژه ای که در ادامه در این آموزش ارائه میشود نوعی سرمایه گذاری بر روی خودتان هست. بنابراین ما پیشنهاد می کنیم در تمام این دوره های آموزشی انگولار و asp.net core همراه ما در مجموعه ably باشید.

آموزش فارسي انگولار (بخش دوم)

• angular يا asp.net core (بخش سوم)

هر بخش از این آموزش یک مفهوم اصلی را پوشش میدهد، اگر احساس میکنید یک بخش برای شما تکراری میباشد و به مطالب آن مسلط میباشید میتوانید آن بخش را نادیده گرفته و به بخش های بعدی مراجعه نمایید. بر عکس اگر از ابتدا تا انتهای این مسیر ما را همراهی کنید در آخر به مفاهیم سودمندی در زمینه ASP.NET Core و Angular دست خواهید یافت. انجام پروژه ای که در ادامه در این آموزش ارائه میشود نوعی سرمایه گذاری بر روی خودتان هست.  بنابراین ما پیشنهاد می کنیم در تمام این دوره های آموزشی انگولار و asp.net core همراه ما در مجموعه ably باشید.

انتظارات مشتری 

یکی از موارد جالبی که توسط فریم ورک های توسعه نرم افزار مانند SCRUM مورد توصیه قرار گرفته است، اهمیت دادن به تعریف نقش ها میباشد، در این میان هیچ چیز مهم تر از صاحب محصول نمیباشد که در فریم ورک XP به عنوان مشتری نرم افزار(نماینده مشتری) از آن یاد میشود. اینها کسانی هستند که باعث بوجود آمدن انتظارات در تولید نرم افزار شده  و باعث میگردند تیم توسعه با توجه به خواسته آنها نسبت به تولید نرم افزار آتی اقدام نماید. آنها به ما مهمترین موارد در نرم افزار را یادآوری میکنند. خواسته های آنها مهمترین تاثیر را در روند تولید نرم افزار دارد. به طور خلاصه، آنها مسئولیت پروژه را برعهده دارند. به همین علت برای تحویل برنامه وب مطابق انتظارات آنها میبایست، از چشم انداز آینده آنها نسبت به محصول نهایی آگاهی لازم را داشته باشیم و همیشه خودمان را جای او قرار دهیم.
این قانون همیشه صدق میکند، حتی اگر مشتری، پدر، همسر یا بهترین دوستمان باشد: محصول چگونه کار میکند.
همه چیز بصورت واضح توضیح داده شد، حال تصمیم داریم به برخی از انتظارات صاحبان محصول نگاهی بیندازیم. ما میبایست مطمئن شویم انتخاب ASP.NET Core و Angular هر یک از این انتظارات را به نحو احسن برآورده میسازد.

1)انتشار سریع نرم افزار

صرف نظر از اینکه در حال فروش یک ظرف سالاد یا یک سرویس وب میباشید، مشتری همواره میخواهد بداند در حال خرید چه چیزی است. اگر از متدولوژی SCRUM استفاده میکنیم، مجبوریم در پایان هر دوره نسخه ای از نرم افزار را ارائه کنیم. این مورد درباره مدل آبشاری نیز صدق میکند. برای اطمینان کامل، بهترین کار برای سازماندهی موثر در توسعه نرم افزار اتخاد یک مدل تکراری (Iterative Phase) در توسعه آن است. ASP.NET Core و Angular به همراه قابلیت SoC که توسط الگوهای MVC و MVVM ارائه شده است، میتواند انتظارات مورد نظر را برآورده کند.

2)GUI مهم تر از Back-End

بدلیل اینکه بخش UI، برای مشتری قابل دیدن و سنجش میباشد، بعضی اوقات تقاضای کار بر روی بخش Front-End و UI را داریم. این بدین معنیست که مجبوریم کار بر روی بخش Back-End را به تعویق انداخته و سریعتر بر روی بخش Front-End  کار کنیم. توجه داشته باشید که این نوع رویکرد لزوما بد نیست، به هر حال توجه کنید ما تعهدی به انجام صد در صد این رویکرد نداریم. شایان ذکر است ASP.NET Core  به همراه Angular این شانس را به ما میدهد که به آسانی لایه View را از لایه Data جدا کنیم، لایه View را پیاده سازی کرده و نسبت به پیاده سازی لایه داده بعدا اقدام کنیم.
در مورد پیاده سازی لایه داده،  WEB API ها  در ASP.NET Core این قابلیت را به ما میدهد که بدون اتلاف وقت اسکلت برنامه وب را در قالب کنترلر ها ساخته و توسط Entity Framework 6 دسترسی به داده های مدل را به روش Code First مدیریت کنیم. به محض انجام آن، توسط آنگولار میتوان به طراحی لایه نمایش پرداخت و تا حد زیادی به نتایج مورد نظر رسید. در مرحله آخر نیز با پیاده سازی صحیح Web API  ها داده های واقعی را در لایه View نشان میدهیم.

2)اتمام سریع

هیچ یک از موارد  قبلی کار نخواهد کرد مگر آنکه موفق شویم همه چیز را در یک زمان معقول به پایان برسانیم. به همین دلیل تصمیم گرفتیم یک فریم ورک برای سمت سرور و یک فریم ورک برای سمت کلاینت انتخاب کنیم بطوری که این فریم ورک ها بتوانند به آسانی با یکدیگر کار کنند. علاوه بر ساختار محکم و باثبات ASP.NET Core و Angular، دقت آن در انجام کارها دلایل انتخاب آنها برای انجام کار میباشند.

3)سازگاری

همانطور که در بیانیه Agile آمده است:  قادر بودن به اعمال تغییرات در نرم افزار مهمتر از ادامه تولید فازهای بعدی نرم افزار است. در توسعه نرم افزار این کاملا صحیح است، میتوانیم ادعا کنیم هر پروژه نرم افزاری که قابل تغییر نباشد پروژه ای شکست خورده خواهد بود. دلیل محکم دیگر استفاده از قابلیت  SoC در دو فریم ورک یاد شده میباشد که به برنامه نویس قابلیت مدیریت و ایجاد تغییرات ساختاری در طول فازهای توسعه را میدهد.
در خطوط بالا اشاره ای به SCRUM کردیم که مشهورترین فریم ورک در توسعه نرم افزار تحت متدولوژی Agile  میباشد. برای کسانی که هنوز آشنایی با این فریم ورک ندارند میتوانند برای آگاهی بیشتر به لینک زیر مراجعه کنند:

کلیک کنید

به این نکته توجه داشته باشید که ما همه چیز را در اینجا بیان نمی کنیم. ما تلاش داریم به سوالات زیر پاسخ دهیم:
اگر تصمیم به ایجاد یک صفحه SPA داشته باشیم، آیا انتخاب ASP.NET Core و Angular تصمیم درستی است؟
مسلما پاسخ بلی میباشد، به ویژه زمانیکه با یکدیگر استفاده شوند.

نمونه پروژه SPA

آنچه اکنون به آن نیاز داریم، تصوری مناسب از یک سناریو که قرار است در آینده بعنوان یک محصول نرم افزاری تولید و ارائه شود میباشد. برای انجام آن، اولین قدم آن است که چند دقیقه خودمان به جای مشتری نقش بازی کنیم و ایده ای را ارائه کنیم. چشم انداز محصول آینده را با خودمان مرور میکنیم. این محصول قرار است چه کارهایی را انجام دهد؟ سپس قادر هستیم ایده خود را به چند آیتم تقسیم کنیم و آن را در اختیار برنامه نویسان خود قرار دهیم. اینها نیازمندیهای اصلی پروژه مان هستند. سرانجام ویژوال استودیو را برای پیاده سازی نهایی ASP.NET Core و Angular  پیکره بندی و آماده می کنیم.

چشم انداز

اگر بخواهیم خصوصیات کلیدی ASP.NET Core و Angular را به روش کاربردی نشان دهیم، نیاز داریم تا پروژه ای را بصورت موثر انجام دهیم. به همین خاطر نمیتوانیم بیشتر سایت ها مانند سایت های گالری، ویدئو، عکس و فیلم را مورد توجه قرار دهیم. ما به چیزی نیاز داریم که قابلیت های برنامه نویسی غیر همزمان و پردازش درخواست های موازی را بهتر نشان دهد. برای دست یافتن به این انتظارات بهتر است تا بر روی پروژه ای مثل CMS یا یک وب سایت Wiki کار کنیم. یا بهتر است بر روی یک سیستم کلاینت سرور که دارای قابلیت احراز هویت برا اساس توکن، دریافت و ارسال داده بصورت RESTful و قابلیت نشان دادن Notification میباشد کار کنیم. هدف ما در این کتاب ساخت برنامه ای واقعی و محکم با استفاده از فریم ورکهای یاد شده میباشد. هر بخش از این آموزش یک مفهوم اصلی را پوشش میدهد، اگر احساس میکنید یک بخش برای شما تکراری میباشد و به مطالب آن مسلط میباشید میتوانید آن بخش را نادیده گرفته و به بخش های بعدی مراجعه نمایید. بر عکس اگر از ابتدا تا انتهای این مسیر ما را همراهی کنید در آخر به مفاهیم سودمندی در زمینه ASP.NET Core و Angular دست خواهید یافت. انجام پروژه ای که در ادامه در این آموزش ارائه میشود نوعی سرمایه گذاری بر روی خودتان هست.
برای اجتناب از خستگی، تم جالبی را در مورد تست شخصیت در نظر گرفته ایم. آیا در مورد آن چیزی میدانید؟ آنها سوالاتی هستند که جنبه های شخصیتی و وضعیت روحی افراد را آشکار میکنند .آنها میتوانند ویژگی های شخصیتی را با کاراکترهای واقعی یا تخیلی مقایسه کرده و شباهت ها را پیدا کنند.

معرفی وب سایت TestMakerFree

امیدوارم، شما انجام تست های شخصیتی را دوست داشته باشید، چون قرار است در طول مطالعه این آموزش برنامه وبی طراحی کنیم تا کاربران از سراسر دنیا بتوانند به آن وصل شده وتست های خود را بسازند. برای انجام آن، ابزاری طراحی خواهیم کرد که کاربران بتوانند سوالات و جوابهای خود را اضافه نموده، عکس ها را آپلود کنند، متد امتیازدهی را انتخاب نموده، به هر جواب امتیازی اختصاص داده و نتایج و خروجی های مورد نظر را تعریف کنند. در آخرین مرحله کاربر یک URL دریافت خواهد نمود، که توسط آن میتوان تست را دریافت کرد و از طریق ایمیل، فروم ها و بلاگ ها، نرم افزارهای ارسال پیام و شبکه های اجتماعی و ... به اشتراک گذاشت. در نهایت برنامه وب کاملی خواهید داشت که توسط ASP.NET Core و Angular تهیه و تکمیل شده است.
TestMakerFree برگرفته از سایت www.testmakerfree.com میباشد. در هنگام نگارش این آموزش دامین هنوز فعال میباشد. اگر به آدرس ذکر شده بروید، نتیجه نهایی برنامه وب ای که قرار است طراحی کنیم را خواهید دید. 

نیازمندیها و ویژگیهای اصلی

اجازه دهید تصویری از چگونگی کارکرد برنامه داشته باشیم:

کاربران برنامه نیاز دارند در آن ثبت نام کنند. کاربران میبایست مجوز ایجاد تست را داشته باشند. سپس میبایست یک تست جدید ایجاد کنند. هر تست میبایست یک نام، توضیح و لیستی از سوالات و نتایج ممکن را داشته باشد. هر سوال یک فیلد توضیح، لیستی از جواب ها و یک عکس اختیاری دارد. هر جواب، یک فیلد توضیحات، یک عکس اختیاری و لیستی از امتیازات گرفته شده دارد. هر نتیجه یک فیلد توضیحی و یک فیلد برای نگهداری مقدار امتیاز کسب شده بر عهده دارد. در آینده بصورت گسترده در مورد امتیازات و مقادیر آنها بحث خواهیم کرد. هم اکنون در مورد بدیهیات صحبت کردیم، زمانی که کاربر تست را کامل میکند، مجموع امتیازات داده شده به جواب ها، با مقدار امتیاز داده شده به هر نتیجه برای تعیین نتیجه خروجی مطابقت داده میشود. اگر شما در مورد MBTI و FFM مطالبی شنیده باشید، با نحوه امتیازدهی و مقدار امتیازات آشنایی دارید. اگر دوست دارید اطلاعات بیشتری در مورد مدلهای تست داشته باشید توصیه میکنیم که به دولینک  زیر سر بزنید :

http://en.wikipedia.org/wiki/Myers-Briggs_Type_Indicator

http://en.wikipedia.org/wiki/Big_Five_personality_traits

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

مسیریابی:

برنامه میبایست به صورت صحیح به درخواست های کلاینت ها پاسخ دهد، یعنی مسیریابی صحیح کاربران  با توجه به آنچه انجام میدهند.

مدل داده:

برای ذخیره تست ها، سوال و جوابها از دیتابیس استفاده خواهیم نمود. از این رو به ابزاری مناسب برای دستیابی به داده ها نیاز داریم. بنابراین نیاز داریم تا معماری داده ها را توسط کلاسهای Repository پیاده سازی کنیم. این داده توسط درخواست های HTTP از سمت سرور دریافت شده و جهت نمایش در اختیار Angular قرار میگیرد.

کنترلر ها:

از منظر معماری MVC،  یکی از تفاوتهای اصلی بین برنامه های چند صفحه ای و تک صفحه ای، این است که در برنامه های چند صفحه ای وظیفه کنترلر نمایش View بود ولی در برنامه های تک صفحه ای ارسال داده ها به صورت Serialized صورت میگیرد اینکار توسط API Controller  ها انجام میشود.

کامپوننت های آنگولار:

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

احراز هویت:

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

ظاهر UI:

در مورد طراحی مناسب ظاهر UI بعد از بخش Server-Side وقت خواهیم گذاشت، بطوریکه ظاهر برنامه وب را بسیار شکیل، واکنش گرا و قابل استفاده برای گوشی های موبایل طراحی خواهیم نمود.
موارد ذکر شده بالا مهمترین چالش های ما در زمان توسعه برنامه هستند. همانطور که در بخشهای بالاتر گفتیم، مطمئنا نیاز داریم در مورد نحوه رسیدگی صحیح به هر یک از موارد ذکر شده در بالا درک درستی داشته باشیم. اجازه دهید بدون اتلاف وقت شروع کنیم.

آماده سازی فضای کاری

اولین کاری که مجبور به انجام آن هستیم آماده کردن سیستم کامپیوتری جهت شروع کار است، انجام آن کار سختی نیست چون به تعدادی از ابزارهای اساسی نیاز داریم. این ابزارها شامل ویژوال استودیو 2017، Node.JS ، یک وب سرور به نام IIS یا IIS Express و یک سیستم جهت کنترل ورژن ( مانند Git، Mercurialیا Team Foundation) میباشد.
در این سری از مقالات از ابزارهای مختلف برنامه نویسی بصورت گستره استفاده کرده ایم. ابزارهایی مانند TypeScript ، NuGet ، NPM، Gulp و فریم ورک .Net Core که همگی اینها در ویژوال استودیو قرار داده شده اند، در حالیکه دیگر ابزارها مانند Angular و کتابخانه های دیگر جاوااسکریپت از منابع اصلی خودشان در کنار ویژوال استودیو قرار میگیرند. همه این ابزارها در کنار یکدیگر بصورت 100 درصد سازگار هستند. در طول زمان همگی این ابزارها دستخوش تغییرات قرار خواهند گرفت. با گذشت زمان و انجام شدن بروزرسانی ها، تغییرات  (بروزرسانی ها) بر روی پروژه نهایی تاثیر خواهد گذاشت. برای توضیح بیشتر میتوان گفت بروزرسانی ابزارهای جانبی تاثیر زیادی نخواهد گذاشت ولی در بعضی بخش ها ممکن است به علت بروزرسانی ویژوال استودیو کد نوشته شده کار نکند. در این حالت افراد نظرات مختلفی در مورد این آموزش ارائه میکنند، ممکن است با خود بگویند نویسنده مقاله در اینجا به علت عجله زیاد کد را درست ننوشته و یا ممکن است بگویند خطاهای زیادی وجود دارد و خواندن را ادامه ندهند. البته همیشه این فرضیه ها درست نیست، بخصوص زمانیکه که نویسندگان برای نوشتن و کارشناسان برای ویرایش، تصحیح کدها و نظرات کارشناسی زمان صرف میکنند.

"همیشه رو به جلو حرکت کنید، به دنبال یادگرفتن باشید."
 

بخش های بعدی ما را در طول این سفر همراهی خواهند نمود. در طول آموزش انگولار5 و asp.net core مباحث مهمی مانند SEO، امنیت، مشکلات موجود در کارایی برنامه و نحوه نوشتن کدهای بهتر و توسعه برنامه را پوشش میدهیم.