معماری پیازی توسط جفری پالرمو در سال 2008 ابداع شد. این معماری راه بهتری را برای ساخت برنامه‌های کاربردی جهت تست پذیری، نگهداری و قابلیت اطمینان بهتر بر روی زیرساخت‌هایی مانند پایگاه‌های داده و خدمات ارائه می‌دهد. هدف اصلی این معماری، پرداختن به چالش‌های پیش روی معماری 3 لایه و ارائه راه حلی برای مشکلات رایج مانند اتصال و جداسازی وابستگی‌ها است. دو نوع اتصال وجود دارند؛ اتصال محکم و اتصال ضعیف که در ادامه آنها را بررسی میکنیم.
اتصال محکم
هنگامی که یک کلاس، به یک وابستگی مشخصی وابسته است، گفته می‌شود که به شدت با آن کلاس همراه است. یک اتصال محکم جفت شده، به یک شیء دیگر وابسته است. این بدان معناست که تغییر یک شیء در یک برنامه‌ی با اتصال محکم جفت شده، اغلب نیاز به تغییر در تعدادی از اشیاء دیگر دارد. هنگامیکه یک برنامه کوچک است، دشوار نیست، اما در یک برنامه‌ی بزرگ، ایجاد تغییرات بسیار دشوار است.
اتصال ضعیف
یعنی دو شیء مستقل هستند و یک شیء می‌تواند بدون اینکه به آن وابسته باشد، از شیء دیگری استفاده کند. این یک هدف طراحی است که به دنبال کاهش وابستگی‌های متقابل بین اجزای یک سیستم، با هدف کاهش خطر این است که تغییرات در یک جزء، مستلزم تغییر در هر جزء دیگر باشد.
مزایای معماری پیازی
چندین مزیت برای معماری پیازی وجود دارند که در زیر ذکر شدهاند:
لایه‌های معماری پیاز
این معماری به شدت به اصل وارونگی وابستگی، متکی است. رابط کاربری از طریق واسط‌ها با منطق تجاری ارتباط برقرار می‌کند و دارای چهار لایه است. لایه‌ها به سمت مرکز هستند. بخش مرکزی، موجودیت‌های Domain است که نشان‌دهنده موضوعات تجاری و رفتاری است. این لایه‌ها می‌توانند متفاوت باشند اما لایه موجودیت‌های دامنه، همیشه بخشی از دامنه‌ی مرکزی است. لایه دیگر، رفتار بیشتر یک شیء را تعریف می‌کند. در ادامه به توضیح لایه‌های معماری پیاز توجه فرمایید:
Domain Entities Layer
این بخش مرکزی معماری است. تمام اشیاء دامنه‌ی برنامه را در خود نگه می‌دارد. اگر برنامه ای با چهارچوب موجودیت ORM توسعه داده شود، این لایه دارای کلاس‌های POCO (Code First) یا Edmx (Database First) با موجودیت‌ها است. این نهادهای دامنه هیچ وابستگی ندارند.
Repository Layer
این لایه برای ایجاد یک لایه Abstraction بین لایه نهادهای دامنه و لایه منطق تجاری یک برنامه، در نظر گرفته شده‌است. این یک الگوی دسترسی به داده‌است که باعث می‌شود یک رویکرد مرتبط‌تر برای دسترسی به داده‌ها وجود داشته باشد. ما یک مخزن عمومی را ایجاد میکنیم که منبع داده را برای داده‌ها جستجو می‌کند، داده‌ها را از منبع داده به یک نهاد تجاری نگاشت می‌کند و تغییرات موجودیت تجاری را به منبع داده ارائه می‌دهد.
Service Layer
این لایه دارای رابط‌هایی است که برای برقراری ارتباط بین لایه UI و لایه مخزن استفاده می‌شود و به همراه منطق تجاری برای یک موجودیت است. بنابراین به آن لایه منطق تجاری نیز می‌گویند.
UI Layer
خارجی‌ترین لایه است و می‌تواند برنامه‌ی وب، Web API یا پروژه واحد تست باشد. این لایه دارای یک پیاده سازی از جنس Dependency Inversion Principle است بطوری که برنامه، یک برنامه‌ی کاربردی جفت شده‌ی آزاد می‌سازد و از طریق واسط‌ها با لایه داخلی ارتباط برقرار می‌کند.
در مطالب بعدی با مبحث معماری پیازی، نکات تکمیلی و مهمتری از لایه پیاز را تشریح میکنیم و یک پروژه را با معماری پیاز، راه اندازی میکنیم.
<AuthorizeView>
<Authorized>
<a href="Identity/Account/Logout">Logout</a>
</Authorized>
<NotAuthorized>
<a href="Identity/Account/Register">Register</a>
<a href="Identity/Account/Login">Login</a>
</NotAuthorized>
</AuthorizeView> InvalidOperationException: Authorization requires a cascading parameter of type Task<AuthenticationState>. Consider using CascadingAuthenticationState to supply this. Microsoft.AspNetCore.Components.Authorization.AuthorizeViewCore.OnParametersSetAsync()
<CascadingAuthenticationState>
<Router AppAssembly="@typeof(Program).Assembly" PreferExactMatches="@true">
<Found Context="routeData">
<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
</Found>
<NotFound>
<LayoutView Layout="@typeof(MainLayout)">
<p>Sorry, there's nothing at this address.</p>
</LayoutView>
</NotFound>
</Router>
</CascadingAuthenticationState> 
@page
@using Microsoft.AspNetCore.Identity
@inject SignInManager<IdentityUser> SignInManager
@functions
{
public async Task<IActionResult> OnGet()
{
if (SignInManager.IsSignedIn(User))
{
<p>You have successfully logged out of the application.</p>
await SignInManager.SignOutAsync();
}
return Redirect("~/");
}
} <AuthorizeView>
<Authorized>
Hello, @context.User.Identity.Name
<a href="Identity/Account/Logout">Logout</a>
</Authorized> 
@attribute [Authorize]
<CascadingAuthenticationState>
<Router AppAssembly="@typeof(Program).Assembly" PreferExactMatches="@true">
<Found Context="routeData">
@*<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />*@
<AuthorizeRouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)">
<NotAuthorized>
<p>Sorry, you do not have access to this page</p>
</NotAuthorized>
</AuthorizeRouteView>
</Found>
<NotFound>
<LayoutView Layout="@typeof(MainLayout)">
<p>Sorry, there's nothing at this address.</p>
</LayoutView>
</NotFound>
</Router>
</CascadingAuthenticationState> 
npm install -g eslint
eslint --init
? How would you like to configure ESLint? Answer questions about your style ? Are you using ECMAScript 6 features? Yes ? Are you using ES6 modules? Yes ? Where will your code run? Browser, Node ? Do you use CommonJS? No ? Do you use JSX? No ? What style of indentation do you use? Spaces ? What quotes do you use for strings? Double ? What line endings do you use? Windows ? Do you require semicolons? Yes ? What format do you want your config file to be in? JSON Successfully created .eslintrc.json file in D:\ali\electron
eslint . یا eslint index.js
{
"name": "electron",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"start": "electron .",
"test":"eslint ."
},
"author": "",
"license": "ISC"
} npm test
D:\ali\electron\index.js 1:26 error Strings must use doublequote quotes 16:8 error Strings must use doublequote quotes 19:3 error Expected indentation of 4 space characters but found 2 indent 22:3 error Expected indentation of 4 space characters but found 2 indent ✖ 4 problems (4 errors, 0 warnings)
setText('test');
getText(); .text([text]);
export interface IProduct {
productId: number;
productName: string;
productCode: string;
releaseDate: string;
price: number;
description: string;
starRating: number;
imageUrl: string;
} import { Component } from 'angular2/core';
import { IProduct } from './product';
@Component({
selector: 'pm-products',
templateUrl: 'app/products/product-list.component.html'
})
export class ProductListComponent {
// as before ...
products: IProduct[] = [
// as before ...
];
// as before ...
} 
@Component({
//...
styles: ['thead {color: blue;}']
}) @Component({
//...
styleUrls: ['app/products/product-list.component.css']
}) thead {
color: #337AB7;
} @Component({
selector: 'pm-products',
templateUrl: 'app/products/product-list.component.html',
styleUrls: ['app/products/product-list.component.css']
})
export class ProductListComponent {
//... 
export class ProductListComponent implements OnInit { import { Component, OnInit } from 'angular2/core'; ngOnInit(): void {
console.log('In OnInit');
} 
import { PipeTransform, Pipe } from 'angular2/core';
import { IProduct } from './product';
@Pipe({
name: 'productFilter'
})
export class ProductFilterPipe implements PipeTransform {
transform(value: IProduct[], args: string[]): IProduct[] {
let filter: string = args[0] ? args[0].toLocaleLowerCase() : null;
return filter ? value.filter((product: IProduct) =>
product.productName.toLocaleLowerCase().indexOf(filter) != -1) : value;
}
} <tr *ngFor='#product of products | productFilter:listFilter'>
<input type='text' [(ngModel)]='listFilter' />
import { Component, OnInit } from 'angular2/core';
import { IProduct } from './product';
import { ProductFilterPipe } from './product-filter.pipe';
@Component({
selector: 'pm-products',
templateUrl: 'app/products/product-list.component.html',
styleUrls: ['app/products/product-list.component.css'],
pipes: [ProductFilterPipe]
})
export class ProductListComponent implements OnInit {
//... 
How can developers reduce stress
What Can Query Plan Tell?
چگونه 80 درصد از کد خود را حذف کردیم - بهبود سرعت توسعه و کاهش خطاها
