{"id":425,"date":"2016-02-07T17:04:17","date_gmt":"2016-02-07T08:04:17","guid":{"rendered":"http:\/\/clockmaker.jp\/blog-en\/?p=425"},"modified":"2016-02-07T17:04:17","modified_gmt":"2016-02-07T08:04:17","slug":"clockmaker-labs-angular2","status":"publish","type":"post","link":"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/","title":{"rendered":"Brand new Portfolio, Build with Angular 2"},"content":{"rendered":"<p><img src=\"http:\/\/clockmaker.jp\/labs\/_labs\/images\/preview.jpg\" alt=\"ClockMaker Labs - Version 3 using Angular 2\" \/><\/p>\n<p>Hello, I&#8217;m Yasunobu Ikeda aka <a href=\"https:\/\/twitter.com\/clockmaker_en\" target=\"_blank\">ClockMaker<\/a>. My portfolio website is renewed.<\/p>\n<ul>\n<li><a href=\"http:\/\/clockmaker.jp\/labs\" target=\"_blank\">ClockMaker Labs<\/a><\/li>\n<\/ul>\n<p>The important changing point is the transition to HTML5 from Flash. This site is operated from 2008. Looking back on the past versions, I will introduce this time of renewal .<\/p>\n<p><!--more--><\/p>\n<h3 id=\"year-2008-version-1-0\">Year 2008 \/ Version 1.0<\/h3>\n<p><img src=\"http:\/\/clockmaker.jp\/blog\/wp-content\/uploads\/2008\/10\/081018_labs_launch.jpg\" alt=\"ClockMaker Labs - Version 1 using Flex Framework 3\" \/><\/p>\n<ul>\n<li><a href=\"http:\/\/clockmaker.jp\/labs\/ver1\" target=\"_blank\">Open Version 1<\/a><\/li>\n<\/ul>\n<p>It was made with Flex Framework 3. This design was based on Yahoo! Flex Skin.<\/p>\n<h3 id=\"year-2010-version-2-0\">Year 2010 \/ Version 2.0<\/h3>\n<p><img src=\"http:\/\/clockmaker.jp\/blog\/wp-content\/uploads\/2009\/12\/100101_labs.jpg\" alt=\"ClockMaker Labs - Version 2 using Progression 4\" \/><\/p>\n<ul>\n<li><a href=\"http:\/\/clockmaker.jp\/labs\/ver2\" target=\"_blank\">Open Version 2<\/a><\/li>\n<\/ul>\n<p>It was made by Flash and Pure ActionScript 3.0 with Progression and <a href=\"http:\/\/www.libspark.org\/wiki\/alumican\/JPPScrollbar\" target=\"_blank\">JPPScrollbar<\/a>.<\/p>\n<h3 id=\"year-2016-version-3-0\">Year 2016 \/ Version 3.0<\/h3>\n<p><img src=\"http:\/\/clockmaker.jp\/labs\/_labs\/images\/preview.jpg\" alt=\"ClockMaker Labs - Version 3 using Angular 2\" \/><\/p>\n<ul>\n<li><a href=\"http:\/\/clockmaker.jp\/labs\" target=\"_blank\">Open Version 3<\/a><\/li>\n<\/ul>\n<p>It is made by HTML5 and TypeScript with <a href=\"https:\/\/angular.io\/\" target=\"_blank\">Angular 2<\/a>. Angular 2 is best framework for creation of SPA for interaction developer.<br \/>\nYou will notice that the time required for the page transition is less than past versions.<\/p>\n<p>Enjoy!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Hello, I&#8217;m Yasunobu Ikeda aka ClockMaker. My portfolio website is renewed. ClockMaker Labs The important changing point is the transition to HTML5 from Flash. This site is operated from 2008. Looking back on the past versions, I will introduce this time of renewal .<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[10],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v16.8 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Brand new Portfolio, Build with Angular 2 - ClockMaker Demo\" \/>\n<meta property=\"og:description\" content=\"Hello, I&#8217;m Yasunobu Ikeda aka ClockMaker. My portfolio website is renewed. ClockMaker Labs The important changing point is the transition to HTML5 from Flash. This site is operated from 2008. Looking back on the past versions, I will introduce this time of renewal .\" \/>\n<meta property=\"og:url\" content=\"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/\" \/>\n<meta property=\"og:site_name\" content=\"ClockMaker Demo\" \/>\n<meta property=\"article:published_time\" content=\"2016-02-07T08:04:17+00:00\" \/>\n<meta property=\"og:image\" content=\"http:\/\/clockmaker.jp\/labs\/_labs\/images\/preview.jpg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Yasu\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebSite\",\"@id\":\"http:\/\/clockmaker.jp\/blog-en\/#website\",\"url\":\"http:\/\/clockmaker.jp\/blog-en\/\",\"name\":\"ClockMaker Demo\",\"description\":\"Interactive Design with Flash and HTML5\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"http:\/\/clockmaker.jp\/blog-en\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"ImageObject\",\"@id\":\"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/#primaryimage\",\"inLanguage\":\"en-US\",\"url\":\"http:\/\/clockmaker.jp\/labs\/_labs\/images\/preview.jpg\",\"contentUrl\":\"http:\/\/clockmaker.jp\/labs\/_labs\/images\/preview.jpg\"},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/#webpage\",\"url\":\"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/\",\"name\":\"Brand new Portfolio, Build with Angular 2 - ClockMaker Demo\",\"isPartOf\":{\"@id\":\"http:\/\/clockmaker.jp\/blog-en\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/#primaryimage\"},\"datePublished\":\"2016-02-07T08:04:17+00:00\",\"dateModified\":\"2016-02-07T08:04:17+00:00\",\"author\":{\"@id\":\"http:\/\/clockmaker.jp\/blog-en\/#\/schema\/person\/4812391988938498fcd1b4cbb7ac3291\"},\"breadcrumb\":{\"@id\":\"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"http:\/\/clockmaker.jp\/blog-en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Brand new Portfolio, Build with Angular 2\"}]},{\"@type\":\"Person\",\"@id\":\"http:\/\/clockmaker.jp\/blog-en\/#\/schema\/person\/4812391988938498fcd1b4cbb7ac3291\",\"name\":\"Yasu\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"http:\/\/clockmaker.jp\/blog-en\/#personlogo\",\"inLanguage\":\"en-US\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/96ec799c0a89d4ff7a6c2526dd04f121?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/96ec799c0a89d4ff7a6c2526dd04f121?s=96&d=mm&r=g\",\"caption\":\"Yasu\"},\"url\":\"https:\/\/clockmaker.jp\/blog-en\/author\/yasu\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/","og_locale":"en_US","og_type":"article","og_title":"Brand new Portfolio, Build with Angular 2 - ClockMaker Demo","og_description":"Hello, I&#8217;m Yasunobu Ikeda aka ClockMaker. My portfolio website is renewed. ClockMaker Labs The important changing point is the transition to HTML5 from Flash. This site is operated from 2008. Looking back on the past versions, I will introduce this time of renewal .","og_url":"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/","og_site_name":"ClockMaker Demo","article_published_time":"2016-02-07T08:04:17+00:00","og_image":[{"url":"http:\/\/clockmaker.jp\/labs\/_labs\/images\/preview.jpg"}],"twitter_card":"summary_large_image","twitter_misc":{"Written by":"Yasu","Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebSite","@id":"http:\/\/clockmaker.jp\/blog-en\/#website","url":"http:\/\/clockmaker.jp\/blog-en\/","name":"ClockMaker Demo","description":"Interactive Design with Flash and HTML5","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"http:\/\/clockmaker.jp\/blog-en\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"ImageObject","@id":"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/#primaryimage","inLanguage":"en-US","url":"http:\/\/clockmaker.jp\/labs\/_labs\/images\/preview.jpg","contentUrl":"http:\/\/clockmaker.jp\/labs\/_labs\/images\/preview.jpg"},{"@type":"WebPage","@id":"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/#webpage","url":"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/","name":"Brand new Portfolio, Build with Angular 2 - ClockMaker Demo","isPartOf":{"@id":"http:\/\/clockmaker.jp\/blog-en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/#primaryimage"},"datePublished":"2016-02-07T08:04:17+00:00","dateModified":"2016-02-07T08:04:17+00:00","author":{"@id":"http:\/\/clockmaker.jp\/blog-en\/#\/schema\/person\/4812391988938498fcd1b4cbb7ac3291"},"breadcrumb":{"@id":"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/clockmaker.jp\/blog-en\/2016\/02\/clockmaker-labs-angular2\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"http:\/\/clockmaker.jp\/blog-en\/"},{"@type":"ListItem","position":2,"name":"Brand new Portfolio, Build with Angular 2"}]},{"@type":"Person","@id":"http:\/\/clockmaker.jp\/blog-en\/#\/schema\/person\/4812391988938498fcd1b4cbb7ac3291","name":"Yasu","image":{"@type":"ImageObject","@id":"http:\/\/clockmaker.jp\/blog-en\/#personlogo","inLanguage":"en-US","url":"https:\/\/secure.gravatar.com\/avatar\/96ec799c0a89d4ff7a6c2526dd04f121?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/96ec799c0a89d4ff7a6c2526dd04f121?s=96&d=mm&r=g","caption":"Yasu"},"url":"https:\/\/clockmaker.jp\/blog-en\/author\/yasu\/"}]}},"_links":{"self":[{"href":"https:\/\/clockmaker.jp\/blog-en\/wp-json\/wp\/v2\/posts\/425"}],"collection":[{"href":"https:\/\/clockmaker.jp\/blog-en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/clockmaker.jp\/blog-en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/clockmaker.jp\/blog-en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/clockmaker.jp\/blog-en\/wp-json\/wp\/v2\/comments?post=425"}],"version-history":[{"count":1,"href":"https:\/\/clockmaker.jp\/blog-en\/wp-json\/wp\/v2\/posts\/425\/revisions"}],"predecessor-version":[{"id":426,"href":"https:\/\/clockmaker.jp\/blog-en\/wp-json\/wp\/v2\/posts\/425\/revisions\/426"}],"wp:attachment":[{"href":"https:\/\/clockmaker.jp\/blog-en\/wp-json\/wp\/v2\/media?parent=425"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/clockmaker.jp\/blog-en\/wp-json\/wp\/v2\/categories?post=425"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/clockmaker.jp\/blog-en\/wp-json\/wp\/v2\/tags?post=425"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}