آموزش Angular، Unit Testing و Figma
Angular, Unit Testing, and Figma
«هر توسعه‌دهنده وب به شدت به یک چارچوب وب متکی است
(گاهی اوقات اگر خدمات آنها نیازهای متفاوتی داشته باشد) و
شرکتهایبه چارچوب‌های زیادی متکی خواهند بود، اما هرکدام دارای مزایا و
هستندمعایب." جی بل، گرگ ماگولان، دیوید گویارو، آدرین دی پرتی، پاتریک هاسلی در مورد NestJS صحبت می کنند
ممکن است بخواهید مقاله "برنامه نویسان کامپیوتر مانند معتاد به مواد مخدر رفتار می کنند" خورخه گوئرا پیرس، دکترای منتشر شده در Geek Culture، در رابطه با بررسی های بد را در اینجا ببینید.
==
Angular یک فریمورک Google است: یک تولید کننده صفحه برنامه واحد (SPA) است.
با Angular، می‌توانید برنامه‌هایی بسازید که روی مرورگرها اجرا شوند (فرانت‌اند)، بدون نیاز به چارچوب‌ها/کتابخانه‌های باطنی مانند Express/Node.js/NestJS. با دستاوردهای فعلی انجمن Angular، اکنون می توانید اساساً هر کاری را در قسمت جلویی انجام دهید. اخیراً، Firebase، همچنین از Google، با Angular ادغام شده است: Firebase چندین ویژگی خوب را ارائه می دهد، به عنوان مثال، یادگیری ماشین و ورود به سیستم مبتنی بر Google.
برخی از نقاط قوت Angular:
1. سازندگان Angular برای آزمایش طراحی شده بودند (یعنی ایده‌آل برای برنامه‌های مبتنی بر آزمایش واحد؛ به عنوان مثال، توسعه مبتنی بر تست)، سازندگان Angular آزمایش‌های استاندارد ایجاد کردند و دائماً روش‌های جدیدی را برای آزمایش آسان برنامه‌ها با استفاده از کتابخانه‌های خود منتشر کردند. با Jasmine/Karma، می توانید اساساً انواع تست های واحد را انجام دهید؛
2. با سایر فناوری‌های Google نیز مطابقت دارد، مقاله‌های من را در مورد Medium ببینید "Firebase و Angular: برنامه frontend خود را به یک پایگاه داده noSQL متصل کنید" و "Meet project my "TensorFlow.js in Angular": کار بر روی برنامه‌های یادگیری ماشین مبتنی بر Angular" ;
مقاله من را در مورد Medium ببینید "آیا Angular واقعا بد است: چرا باید مخالفت کنم!".
این یک دوره چند جلدی است. در این جلد، یاد خواهید گرفت که چگونه یک داشبورد ساده بسازید، که در مجلدات بعدی ادامه خواهد داشت: ما قصد داریم نسخه کاربری که از سیستم خارج شده است را پوشش دهیم. برنامه کامل در حال حاضر تحت مجوز MIT در GitHub در دسترس است. در نتیجه، هرکسی که می‌خواهد Angular یاد بگیرد، می‌تواند این دوره را دنبال کند.
این جلد کاملاً عمومی است و می‌تواند توسط هر کسی که می‌خواهد Angular متمرکز بر تست واحد با Jasmine/Karma را دنبال کند.
می‌خواهیم صفحه‌ای را روی این حجم، با فوتر و سربرگ، با پس‌زمینه بسازیم. هدر یک منوی Angular Material دارد. ما از Figma برای ترسیم صفحه قبل از ساخت آن استفاده کردیم و کدهای CSS را از پروژه Figma قرض گرفتیم.
اگرچه برنامه‌ای که در اینجا ساختیم ساده است، چندین موضوع را پوشش می‌دهیم:
1. واحد تست اجزای Angular;
2. ایجاد کامپوننت های Angular;
3. استفاده از متریال زاویه ای؛
4. استفاده از Figma در کنار Angular، نه تنها به عنوان یک کمک بصری، بلکه به عنوان یک ارائه دهنده کد CSS؛
منابعی که در کنار دوره ارائه می شود:
· مخزن GitHub با همه کدها تقسیم بر ماژول؛
· GitBook با توضیحات اضافی؛
· خبرنامه گاه به گاه، به صندوق پست الکترونیکی شما تحویل داده می شود؛
· بخش Q، در داخل پلت فرم؛
· ارتقاء مداوم در دوره، بدون نیاز به خرید مجدد!
· و موارد دیگر، آن را بررسی کنید!
ببینید که برنامه کامل از قبل در دسترس است، از جمله قسمت عددی، و شما می توانید پس از اتمام دوره، فقط به مطالعه کدهای موجود در GitHub ادامه دهید. من یک کتابخانه NPM برای این برنامه به نام ngx-mat-miyagi-dolab منتشر کرده ام. فقط آن را امتحان کنید: npm i ngx-mat-miyagi-dolab
در این تلاش به من بپیوندید!
آیا مایلید در مورد الگوهای تفکر من بیشتر بدانید؟ اکنون کتاب الکترونیکی من در آمازون است! به دنبال سنجش‌های انتخابی من از برنامه‌نویسی متوسط در رایانه باشید: Angular، JavaScript، Machine Learning، TensorFlow.js و موارد دیگر! ”
مطالعات خوب! یادگیری سفری است که با میل به یادگیری شروع می شود!
درباره تجربه و تخصص گذشته من
من یک پست دکتری انجام داده ام که در آن یک پلتفرم در Angular از ابتدا، به تنهایی به عنوان برنامه نویس، در قسمت Angular توسعه داده ام. به «Galaxy and MEAN Stack برای ایجاد یک گردش کار کاربر پسند برای بهینه سازی منطقی شیمی درمانی سرطان، منتشر شده در Frontiers in Genetics» مراجعه کنید.
من پروژه ای به نام IdeaCoding Lab دارم و در Angular به Medium می نویسم.
با خیال راحت مرا در گوگل جستجو کنید!
بیا شروع کنیم! Let's get started!
-
تنظیمات و کلمات اولیه Initial settings and words
-
با StackBlitz آشنا شوید: اپلیکیشن Angular خود را به صورت آنلاین بسازید Meet StackBlitz: build your Angular app online
-
"آزمایشگاه Miyagi-Do: علم فقط برای دفاع از خود است!": برنامه ای که می خواهیم بسازیم "Miyagi-Do lab: science is for self-defense only!": the app we going to build
-
با "استراتژی ورود به سیستم 3 مرحله" آشنا شوید، همان استراتژی که YouTube استفاده می کند Meet "the 3 stages log in strategy", the same used by YouTube
-
نکات تکمیلی و دوره خوبی داشته باشید Additional remarks and have a nice course
-
لطفا به من اطلاع دهید Please, let me know you!
-
راهنمای کاربر: اطلاعاتی که ممکن است بدانید User's guide: some information you may to know
ماژول 1: ایجاد پروژه و اولین جزء ما Module 1: creating our project and first component
-
اظهارات اولیه Initial remarks
-
پروژه فیگما ما Our Figma project
-
ایجاد پروژه با استفاده از Angular CLI Creating the project using Angular CLI
-
ارائه پروژه استاندارد Angular Basic Presenting the Angular basic, standard project
-
Meet Unit Testing در Angular: تست های پایه Meet Unit Testing in Angular: basic tests
-
ایجاد اولین مؤلفه ما: مؤلفه layout Creating our first component: the layout component
ماژول 2: ایجاد اولین آزمون های واحد ما Module 2: creating our first unit tests
-
کلمات اولیه و آماده سازی Initial words and preparation
-
ایجاد جزء داشبورد ما Creating our dashboard component
-
ایجاد اولین مسیریابی ما Creating our first routing
-
تست مسیریابی ما Testing our routing
-
یک دوره آموزشی در مورد تست واحد زاویه ای A crash course on Angular Unit Testing
-
اجزای تمسخر آمیز: با کتابخانه ng-mocks آشنا شوید Mocking components: meet the library ng-mocks
-
تمسخر ماژول مسیریابی Mocking the Routing Module
ماژول 3: ساخت هدر و پاورقی با استفاده از تست Module 3: building our header and footer, using test
-
کلمات اولیه Initial words
-
جمع بندی سریع Quick recap
-
تمسخر اجزای کودک در انگولار Mocking child components in Angular
-
پیکربندی فوتر و هدر ما: استفاده از Figma برای تولید خودکار کد CSS ما Configuring our footer and header: using Figma to autogenerate our CSS code
-
سه نوع بررسی خطا: تست واحد به عنوان سطح تست خطای سوم The three types of error checking: unit testing as the third-error testing level
-
ویرایش و واحد تست مؤلفه فوتر Editing and Unit testing the footer component
-
ویرایش اجزای هدر، و برخی تنظیمات نهایی Editing the header components, and some final ajustments
ماژول 4: ساخت منو Module 4: build the menu
-
منو بسازید build the menu
بسته شدن Closing
-
تجربه شما Your experience
بخش پاداش: پیوست ها Bonus section: attachments
-
آیا Angular واقعا بد است؟ Does Angular really sucks?
-
یک دوره تصادف در Angular A crash course on Angular
-
آیا می توانم اپلیکیشن Angular کامل و کاربردی خود را به صورت رایگان بسازم؟ بله، تو میتونی! Can I build my full and functional Angular app for free? yes, you can!
بخش جایزه: برش های انتخاب شده از دوره bonus section: selected cuts from the course
-
تکنیک 3As برای تست واحد The 3As technique for unit testing
-
لعنتی امتحان چیست؟ #شلوار کوتاه What the hell is a test? #shorts
https://donyad.com/d/44f316
Jorge Guerra Pires
محقق مستقل، دکتری
IdeaCoding Lab
IdeaCodingLab: ایده های جدید را تغییر دهید
Theoretical and Mathematical biology
سازنده دوره آنلاین | آموزش الکترونیکی
نمایش نظرات