<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<title>newTitle ...</title>
<base href="/">
<meta name="description" content="Angular meta service">
<meta name="author" content="DNT">
<meta name="keywords" content="Angular, Meta Service">
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@my_site">
<meta name="twitter:title" content="Front-end Web Development">
<meta name="twitter:description" content="Learn frontend web development...">
<meta name="twitter:image" content="https://site/images/image.png">
<meta name="author" content="Other Author">
</head> import { Component, OnInit } from "@angular/core";
import { Meta, Title } from "@angular/platform-browser";
@Component({
selector: "app-seo-tests",
templateUrl: "./seo-tests.component.html",
styleUrls: ["./seo-tests.component.css"]
})
export class SeoTestsComponent implements OnInit {
constructor(private metaService: Meta, private titleService: Title) {
} // addTag & addTags
this.metaService.addTag({ name: "description", content: "How to optimize your Angular App for search engine and other crawlers." });
this.metaService.addTag({ name: "author", content: "DNT" });
this.metaService.addTag({ name: "keywords", content: "Angular, Meta Service" });
// Or
this.metaService.addTags([
{ name: "description", content: "How to optimize your Angular App for search engine and other crawlers." },
{ name: "author", content: "DNT" },
{ name: "keywords", content: "Angular, Meta Service" }
], false); // --> forceCreation = false
this.metaService.addTag({ name: "twitter:card", content: "summary_large_image" });
this.metaService.addTag({ name: "twitter:site", content: "@my_site" });
this.metaService.addTag({ name: "twitter:title", content: "Front-end Web Development" });
this.metaService.addTag({ name: "twitter:description", content: "Learn frontend web development..." });
this.metaService.addTag({ name: "twitter:image", content: "https://site/images/image.png" });
// Or
this.metaService.addTags([
{ name: "twitter:card", content: "summary_large_image" },
{ name: "twitter:site", content: "@my_site" },
], false); // --> forceCreation = false // getTag & getTags
const viewport = this.metaService.getTag("name=viewport");
if (viewport) {
console.log(viewport.content); // width=device-width, initial-scale=1
}
const author = this.metaService.getTag("name=author");
if (author) {
console.log(author.content); // DNT
}
this.metaService.addTag({ name: "author", content: "DNT" });
this.metaService.addTag({ name: "author", content: "Other Author" }, true);
const authors = this.metaService.getTags("name=author");
console.log(authors[0]); // <meta name="author" content="DNT">
console.log(authors[1]); // <meta name="author" content="Other Author"> // updateTag
this.metaService.addTag({ name: "twitter:card", content: "summary_large_image" });
this.metaService.updateTag({ name: "twitter:card", content: "summary" }, `name='twitter:card'`);
this.metaService.updateTag({ name: "description", content: "Angular meta service" }); // removeTag & removeTagElement
this.metaService.removeTag("charset");
// Or
const chartsetTag = this.metaService.getTag("charset");
if (chartsetTag) {
this.metaService.removeTagElement(chartsetTag);
} // Setting the browser page Title in an Angular app
const currentTitle = this.titleService.getTitle();
console.log(currentTitle);
this.titleService.setTitle("newTitle ..."); const routes: Routes = [
{
path: "seo", component: SeoTestsComponent,
data: {
title: "Page Title",
metaTags: {
description: "Page Description or some content here",
keywords: "some, keywords, here, separated, by, a comma"
}
}
}
]; import { Injectable } from "@angular/core";
import { Title, Meta } from "@angular/platform-browser";
import { Router, NavigationEnd, ActivatedRouteSnapshot } from "@angular/router";
@Injectable()
export class SeoService {
constructor(private titleService: Title, private metaService: Meta, private router: Router) { }
enableSeo() {
this.router.events
.filter(event => event instanceof NavigationEnd)
.distinctUntilChanged()
.subscribe(() => {
this.addMetaData(this.router.routerState.snapshot.root);
});
}
private addMetaData(root: ActivatedRouteSnapshot): void {
if (root.children && root.children.length) {
this.addMetaData(root.children[0]);
} else if (root.data) {
this.setTitle(root.data);
this.setMetaTags(root.data);
}
}
private setMetaTags(routeData: { [name: string]: any; }) {
const routeDataMetaTagsKey = "metaTags";
const metaTags = routeData[routeDataMetaTagsKey];
if (!metaTags) { return; }
for (const tag in metaTags) {
if (metaTags.hasOwnProperty(tag)) {
const newTag = { name: tag, content: metaTags[tag] };
console.log("new tag", newTag);
this.metaService.addTag(newTag);
}
}
}
private setTitle(routeData: { [name: string]: any; }) {
const routeDataTitleKey = "title";
const title = routeData[routeDataTitleKey];
if (title) {
console.log("new title", title);
this.titleService.setTitle(title);
}
}
} this.router.events
.filter(event => event instanceof NavigationEnd)
.distinctUntilChanged()
.subscribe(() => {
this.addMetaData(this.router.routerState.snapshot.root);
}); import { SeoService } from "./seo-service";
@NgModule({
providers: [
SeoService
]
})
export class CoreModule {} import { SeoService } from "./core/seo-service";
export class AppComponent {
constructor(private seoService: SeoService) {
this.seoService.enableSeo();
}
} Unhandled exceptions are a bit of a misnomer. In .NET, every exception is handled. By the time you access the specifics of an error in your Try-Catch block, the Framework has already analyzed the problem, built a structure to contain its details, examined the stack trace, and used reflection to pinpoint the location of the error, among other mundane tasks. In short, when errors occur, .NET serves them up to your code in a neatly packaged, highly examinable data block.
Whereas the aforementioned principles teach you how to be smart with your code, the following principles will teach you to be wisewith your code. Some of them are strange, and many of them are humorous, but they’re all equally practical and important. Take heed
A layman's guide to thinking like the self-aware smol brained
این رو به اشتراک گذاشتم چون هم فان هم آموزنده است, ابتدا سعی کردم عنوانش رو فارسی کنم ترجمه مناسبی به ذهنم نرسید. اگر با انگلیسی بودنش مشکلی ندارید, پیشنهاد میکنم بخونید.
A Brief History of JavaScript
When a VM is loaded, it contains
Source could be also accessed from GitHub -> https://github.com/fpetru/WebApiMongoDB.
Problem / solution format brings an easier understanding on how to build things, giving an immediate feedback. Starting from this idea, the blog post will present step by step how to build
a web application to store your ideas in an easy way, adding text notes, either from desktop or mobile, with few characteristics: run fast, save on the fly whatever you write, and be reasonably reliable and secure.
This blog post will implement just the backend, WebApi and the database access, in the most simple way. Next blog post will cover the front end, using Angular. Then, there will be an additional article on how to increase the performance and the security.
There are lot of confusion around ‘when to use what’ or even ‘why we have two different option for debugging’ . Let’s try to simplify it over here
