از قبل در لینوکس وجود داشت در ورژن 17.06 برای ویندوز نیز موجود می‌شود.
Secrets are a first-class citizen in Docker. They're for storing sensitive application data, like API keys and connection strings. Secrets have been in Docker on Linux for a while, and with Docker version 17.06 they're coming to Windows.
Many developers I talk to are either using Docker actively or planning to adopt containers in their environment. Containers are an important trend in our industry and .NET is part of that. Microsoft and Docker have been working together so that you’ll have a great experience using Docker with .NET apps.
پایه و اساس DevOps ، تغییر است. به وسیله DevOps، کسانی که با آخرین ابزارهای توسعه کار میکنند، محتاطانه عمل نمی‌کنند. DevOps علاوه بر افراد وفرایند ها، به ابزارها هم اهمیت می‌دهد و روش‌های مختلفی برای گرد هم آوردن این سه مجموعه در کنار هم ایجاد می‌کند
ng g c core/bread-crumb
import { BreadCrumbComponent } from "./bread-crumb/bread-crumb.component";
@NgModule({
imports: [CommonModule, RouterModule],
exports: [
// components that are used in app.component.ts will be listed here.
BreadCrumbComponent
],
declarations: [
// components that are used in app.component.ts will be listed here.
BreadCrumbComponent
]
})
export class CoreModule {} export interface BreadCrumb {
label: string;
url: string;
}; import { Component, OnInit, ViewEncapsulation } from "@angular/core";
import { ActivatedRoute, NavigationEnd, Router } from "@angular/router";
import { BreadCrumb } from "./bread-crumb";
import { Observable } from "rxjs/Observable";
@Component({
selector: "app-bread-crumb",
templateUrl: "./bread-crumb.component.html",
styleUrls: ["./bread-crumb.component.css"],
encapsulation: ViewEncapsulation.None
})
export class BreadCrumbComponent implements OnInit {
breadcrumbs$: Observable<BreadCrumb[]>;
constructor(private activatedRoute: ActivatedRoute, private router: Router) { }
ngOnInit() {
this.breadcrumbs$ = this.router.events
.filter(event => event instanceof NavigationEnd)
.distinctUntilChanged()
.map(event => event ? this.buildBreadCrumbs(this.activatedRoute.root) : []);
}
buildBreadCrumbs(route: ActivatedRoute, url: string = "", breadcrumbs: Array<BreadCrumb> = []): Array<BreadCrumb> {
const routeDataBreadCrumbKey = "breadcrumb";
const routeConfig = route.routeConfig;
const path = routeConfig && routeConfig.path !== undefined ? routeConfig.path : "";
let label = path;
if (url === "") {
label = "Home";
} else if (routeConfig && routeConfig.data !== undefined) {
label = routeConfig.data[routeDataBreadCrumbKey];
}
const nextUrl = `${url}${path}/`;
const breadcrumb: BreadCrumb = {
label: label,
url: nextUrl
};
console.log("breadcrumb", { path: path, label: label, url: nextUrl, route: route });
const newBreadcrumbs = [...breadcrumbs, breadcrumb];
if (route.firstChild) {
return this.buildBreadCrumbs(route.firstChild, nextUrl, newBreadcrumbs);
}
return newBreadcrumbs;
}
} ngOnInit() {
this.breadcrumbs$ = this.router.events
.filter(event => event instanceof NavigationEnd)
.distinctUntilChanged()
.map(event => event ? this.buildBreadCrumbs(this.activatedRoute.root) : []);
} const routes: Routes = [
{
path: "breadCrumbTest",
data: { breadcrumb: "Parent1" },
children: [
{
path: "", component: Parent1Component
},
{
path: "Parent1Child1",
data: { breadcrumb: "Parent1-Child1" },
children: [
{
path: "", component: Parent1Child1Component
},
{
path: "Parent1Child1Child1", component: Parent1Child1Child1Component,
data: { breadcrumb: "Parent1-Child1 Child1" }
}
]
}
]
}
]; data: { breadcrumb: "Parent1-Child1 Child1" } buildBreadCrumbs(route: ActivatedRoute, url: string = "", breadcrumbs: Array<BreadCrumb> = []): Array<BreadCrumb> {
const routeDataBreadCrumbKey = "breadcrumb";
const routeConfig = route.routeConfig;
const path = routeConfig && routeConfig.path !== undefined ? routeConfig.path : "";
let label = path;
if (url === "") {
label = "Home";
} else if (routeConfig && routeConfig.data !== undefined) {
label = routeConfig.data[routeDataBreadCrumbKey];
} const nextUrl = `${url}${path}/`;
const breadcrumb: BreadCrumb = {
label: label,
url: nextUrl
}; const newBreadcrumbs = [...breadcrumbs, breadcrumb];
if (route.firstChild) {
return this.buildBreadCrumbs(route.firstChild, nextUrl, newBreadcrumbs);
}
return newBreadcrumbs; encapsulation: ViewEncapsulation.None
<ol class="breadcrumb">
<li *ngFor="let breadcrumb of breadcrumbs$ | async" class="breadcrumb-item">
<a [routerLink]="[breadcrumb.url]">{{ breadcrumb.label }}</a>
</li>
</ol> breadcrumbs$: Observable<BreadCrumb[]>;
<div class="container"> <app-bread-crumb></app-bread-crumb> <router-outlet></router-outlet> </div>
> npm install --save redux react-redux > npm install --save-dev @types/react-redux
> npm install --save bootstrap
import "bootstrap/dist/css/bootstrap.css";
import React, { Component } from "react";
class Counter extends Component {
render() {
return (
<section className="card mt-5">
<div className="card-body text-center">
<span className="badge m-2 badge-primary">0</span>
</div>
<div className="card-footer">
<div className="d-flex justify-content-center align-items-center">
<button className="btn btn-secondary btn-sm">+</button>
<button className="btn btn-secondary btn-sm m-2">-</button>
<button className="btn btn-danger btn-sm">Reset</button>
</div>
</div>
</section>
);
}
}
export default Counter; import "./App.css";
import React from "react";
import Counter from "./components/counter";
function App() {
return (
<main className="container">
<Counter />
</main>
);
}
export default App; 
export const Increment = "Increment";
{
type: "ADD",
payload: {
amount // = amount: amount
},
meta: {}
} import * as types from "../constants/ActionTypes";
export const incrementValue = () => ({ type: types.Increment }); import * as types from "../constants/ActionTypes";
const initialState = {
count: 0
};
export default function counterReducer(state = initialState, action) {
if (action.type === types.Increment) {
return {
count: state.count + 1
};
}
return state;
} import { combineReducers } from "redux";
import counterReducer from "./counter";
const rootReducer = combineReducers({
counterReducer
});
export default rootReducer; import { createStore } from "redux";
import reducer from "./reducers";
//...
const store = createStore(
reducer,
window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
);
//... import { Provider } from "react-redux";
import { createStore } from "redux";
import reducer from "./reducers";
// ...
const store = createStore(
reducer,
window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
);
ReactDOM.render(
<Provider store={store}>
<App />
</Provider>,
document.getElementById("root")
); import { connect } from "react-redux";
import { incrementValue } from "../actions";
import Counter from "../components/counter";
const mapStateToProps = state => {
return state;
};
const mapDispatchToProps = dispatch => {
return {
increment() {
dispatch(incrementValue());
}
};
};
export default connect(mapStateToProps, mapDispatchToProps)(Counter); const mapStateToProps = (state) => { return state }; export default connect(mapStateToProps, mapDispatchToProps)(Counter);
import "./App.css";
import React from "react";
import CounterContainer from "./containers/Counter";
function App() {
return (
<main className="container">
<CounterContainer />
</main>
);
}
export default App; import React, { Component } from "react";
class Counter extends Component {
render() {
console.log("props", this.props);
const {
counterReducer: { count },
increment
} = this.props;
return (
<section className="card mt-5">
<div className="card-body text-center">
<span className="badge m-2 badge-primary">{count}</span>
</div>
<div className="card-footer">
<div className="d-flex justify-content-center align-items-center">
<button className="btn btn-secondary btn-sm" onClick={increment}>
+
</button>
<button className="btn btn-secondary btn-sm m-2">-</button>
<button className="btn btn-danger btn-sm">Reset</button>
</div>
</div>
</section>
);
}
}
export default Counter; 
const {
counterReducer: { count },
increment
} = this.props; 
function App() {
const prop1 = 123
return (
<main className="container">
<CounterContainer prop1={prop1} />
</main>
);
} const mapStateToProps = (state, ownProps) => {
console.log("mapStateToProps", { state, ownProps });
return state;
}; export const Decrement = "Decrement";
export const decrementValue = () => ({ type: types.Decrement }); export default function counterReducer(state = initialState, action) {
// ...
if (action.type === types.Decrement) {
return {
count: state.count - 1
};
}
return state;
} import { decrementValue, incrementValue } from "../actions";
// ...
const mapDispatchToProps = dispatch => {
return {
// ...
decrement() {
dispatch(decrementValue());
}
};
}; const {
// ...
decrement
} = this.props; <button
className="btn btn-secondary btn-sm m-2"
onClick={decrement}
>
-
</button> const mapDispatchToProps = dispatch => {
return {
increment() {
dispatch(incrementValue());
},
decrement() {
dispatch(decrementValue());
}
};
}; import { bindActionCreators } from "redux";
// ...
const mapDispatchToProps = dispatch => {
return bindActionCreators(
{
incrementValue,
decrementValue
},
dispatch
);
}; 
const {
counterReducer: { count },
incrementValue,
decrementValue
} = this.props; const mapDispatchToProps = {
incrementValue,
decrementValue
}; const mapStateToProps = state => {
//return state;
return {
count: state.counterReducer.count
};
}; 
const {
//counterReducer: { count },
count,
incrementValue,
decrementValue
} = this.props; Bootstrap 4 در واقع یک اقدام بزرگ بود که پس از یک سال توسعه، بزرگی این اقدام در خط به خط کدها احساس می‌گردد. تصمیم گرفتیم تا نسخه‌ی اولیه‌ی آن را به اشتراک بگذاریم و انتقادات و پیشنهادات شما را بشنویم. برای بهبود و پیشرفت در این زمینه، بسیاری از اخبار مرتبط را در اختیار شما قرار می‌دهیم. امیدواریم که ما را در بهتر شدن یاری کنید.
h1 { /* 16 * 2.5 = 40px */
}