JavaScript大規模開発を語りに行ってきた「KOF2015」参加レポート - Cybozu Inside Out

<!DOCTYPE html> <html lang="ja" data-admin-domain="//blog.hatena.ne.jp" data-admin-origin="https://blog.hatena.ne.jp" data-author="cybozuinsideout" data-avail-langs="ja en" data-blog="cybozuinsideout.hatenablog.com" data-blog-host="cybozuinsideout.hatenablog.com" data-blog-is-public="1" data-blog-name="Cybozu Inside Out | サイボウズエンジニアのブログ" data-blog-owner="cybozuinsideout" data-blog-show-ads="" data-blog-show-sleeping-ads="" data-blog-uri="https://blog.cybozu.io/" data-blog-uuid="8454420450104491317" data-blogs-uri-base="https://blog.cybozu.io" data-brand="devblog" data-data-layer="{"hatenablog":{"admin":{},"analytics":{"brand_property_id":"","measurement_id":"G-G1HPZ65GT3","non_sampling_property_id":"","property_id":"UA-7639138-2","separated_property_id":"UA-29716941-17"},"blog":{"blog_id":"8454420450104491317","content_seems_japanese":"true","disable_ads":"custom_domain","enable_ads":"false","enable_keyword_link":"false","entry_show_footer_related_entries":"true","force_pc_view":"true","is_public":"true","is_responsive_view":"false","is_sleeping":"false","lang":"ja","name":"Cybozu Inside Out | \u30b5\u30a4\u30dc\u30a6\u30ba\u30a8\u30f3\u30b8\u30cb\u30a2\u306e\u30d6\u30ed\u30b0","owner_name":"cybozuinsideout","uri":"https://blog.cybozu.io/"},"brand":"devblog","page_id":"entry","permalink_entry":{"author_name":"cybozuinsideout","categories":"\u30a4\u30d9\u30f3\u30c8\tJavaScript","character_count":7090,"date":"2015-11-16","entry_id":"6653458415127614723","first_category":"\u30a4\u30d9\u30f3\u30c8","hour":"10","title":"JavaScript\u5927\u898f\u6a21\u958b\u767a\u3092\u8a9e\u308a\u306b\u884c\u3063\u3066\u304d\u305f\u300cKOF2015\u300d\u53c2\u52a0\u30ec\u30dd\u30fc\u30c8","uri":"https://blog.cybozu.io/entry/2015/11/16/102714"},"pro":"pro","router_type":"blogs"}}" data-device="pc" data-dont-recommend-pro="false" data-global-domain="https://hatena.blog" data-globalheader-color="b" data-globalheader-type="pc" data-has-touch-view="1" data-help-url="https://help.hatenablog.com" data-hide-header="1" data-no-suggest-touch-view="1" data-page="entry" data-parts-domain="https://hatenablog-parts.com" data-plus-available="1" data-pro="true" data-router-type="blogs" data-sentry-dsn="https://03a33e4781a24cf2885099fed222b56d@sentry.io/1195218" data-sentry-environment="production" data-sentry-sample-rate="0.1" data-static-domain="https://cdn.blog.st-hatena.com" data-version="1ca111bc9f0112690b12e1842a1ce8" data-initial-state="{}" > <head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#"> <meta name="robots" content="max-image-preview:large" /> <meta charset="utf-8"/> <meta http-equiv="X-UA-Compatible" content="IE=7; IE=9; IE=10; IE=11" /> <title>JavaScript大規模開発を語りに行ってきた「KOF2015」参加レポート - Cybozu Inside Out | サイボウズエンジニアのブログ</title> <link rel="canonical" href="https://blog.cybozu.io/entry/2015/11/16/102714"/> <meta itemprop="name" content="JavaScript大規模開発を語りに行ってきた「KOF2015」参加レポート - Cybozu Inside Out | サイボウズエンジニアのブログ"/> <meta itemprop="image" content="https://cdn.image.st-hatena.com/image/scale/0ae67e2bfa1f4463d2f70d83eb689f47e6547357/backend=imagemagick;version=1;width=1300/http%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fc%2Fcybozuinsideout%2F20151112%2F20151112181231.jpg"/> <meta property="og:title" content="JavaScript大規模開発を語りに行ってきた「KOF2015」参加レポート - Cybozu Inside Out | サイボウズエンジニアのブログ"/> <meta property="og:type" content="article"/> <meta property="og:url" content="https://blog.cybozu.io/entry/2015/11/16/102714"/> <meta property="og:image" content="https://cdn.image.st-hatena.com/image/scale/0ae67e2bfa1f4463d2f70d83eb689f47e6547357/backend=imagemagick;version=1;width=1300/http%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fc%2Fcybozuinsideout%2F20151112%2F20151112181231.jpg"/> <meta property="og:image:alt" content="JavaScript大規模開発を語りに行ってきた「KOF2015」参加レポート - Cybozu Inside Out | サイボウズエンジニアのブログ"/> <meta property="og:description" content="11月6日～7日に大阪で開催された「関西オープンフォーラム（KOF）2015」にブース出展しました。今回もいろんなもの、ソフトウェア、ハードウエア、ロボット、OS、データベース等が展示されていました。" /> <meta property="og:site_name" content="Cybozu Inside Out | サイボウズエンジニアのブログ"/> <meta property="article:published_time" content="2015-11-16T01:27:14Z" /> <meta property="article:tag" content="イベント" /> <meta property="article:tag" content="JavaScript" /> <meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:image" content="https://cdn.image.st-hatena.com/image/scale/0ae67e2bfa1f4463d2f70d83eb689f47e6547357/backend=imagemagick;version=1;width=1300/http%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fc%2Fcybozuinsideout%2F20151112%2F20151112181231.jpg" /> <meta name="twitter:title" content="JavaScript大規模開発を語りに行ってきた「KOF2015」参加レポート - Cybozu Inside Out | サイボウズエンジニアのブログ" /> <meta name="twitter:description" content="11月6日～7日に大阪で開催された「関西オープンフォーラム（KOF）2015」にブース出展しました。今回もいろんなもの、ソフトウェア、ハードウエア、ロボット、OS、データベース等が展示されていました。" /> <meta name="twitter:app:name:iphone" content="はてなブログアプリ" /> <meta name="twitter:app:id:iphone" content="583299321" /> <meta name="twitter:app:url:iphone" content="hatenablog:///open?uri=https%3A%2F%2Fblog.cybozu.io%2Fentry%2F2015%2F11%2F16%2F102714" /> <meta name="description" content="11月6日～7日に大阪で開催された「関西オープンフォーラム（KOF）2015」にブース出展しました。今回もいろんなもの、ソフトウェア、ハードウエア、ロボット、OS、データベース等が展示されていました。" /> <meta name="google-site-verification" content="ASaf__VPzdTMlKgDwgunV812oy5RWjGZe8QaQQq8c9w" /> <script id="embed-gtm-data-layer-loader" data-data-layer-page-specific="{"hatenablog":{"blogs_permalink":{"entry_afc_issued":"false","has_related_entries_with_elasticsearch":"true","blog_afc_issued":"false","is_author_pro":"true","is_blog_sleeping":"false"}}}" > (function() { function loadDataLayer(elem, attrName) { if (!elem) { return {}; } var json = elem.getAttribute(attrName); if (!json) { return {}; } return JSON.parse(json); } var globalVariables = loadDataLayer( document.documentElement, 'data-data-layer' ); var pageSpecificVariables = loadDataLayer( document.getElementById('embed-gtm-data-layer-loader'), 'data-data-layer-page-specific' ); var variables = [globalVariables, pageSpecificVariables]; if (!window.dataLayer) { window.dataLayer = []; } for (var i = 0; i < variables.length; i++) { window.dataLayer.push(variables[i]); } })(); </script>  <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-P4CXTW');</script>  <link rel="shortcut icon" href="https://blog.cybozu.io/icon/favicon"> <link rel="apple-touch-icon" href="https://blog.cybozu.io/icon/touch"> <link rel="icon" sizes="192x192" href="https://blog.cybozu.io/icon/link"> <link rel="alternate" type="application/atom+xml" title="Atom" href="https://blog.cybozu.io/feed"/> <link rel="alternate" type="application/rss+xml" title="RSS2.0" href="https://blog.cybozu.io/rss"/> <link rel="alternate" type="application/json+oembed" href="https://hatena.blog/oembed?url=https%3A%2F%2Fblog.cybozu.io%2Fentry%2F2015%2F11%2F16%2F102714&format=json" title="oEmbed Profile of JavaScript大規模開発を語りに行ってきた「KOF2015」参加レポート"/> <link rel="alternate" type="text/xml+oembed" href="https://hatena.blog/oembed?url=https%3A%2F%2Fblog.cybozu.io%2Fentry%2F2015%2F11%2F16%2F102714&format=xml" title="oEmbed Profile of JavaScript大規模開発を語りに行ってきた「KOF2015」参加レポート"/> <link rel="author" href="http://www.hatena.ne.jp/cybozuinsideout/"> <link rel="preload" href="https://cdn-ak.f.st-hatena.com/images/fotolife/c/cybozuinsideout/20180828/20180828132441.png" as="image"/> <link rel="stylesheet" type="text/css" href="https://cdn.blog.st-hatena.com/css/blog.css?version=1ca111bc9f0112690b12e1842a1ce8"/> <link rel="stylesheet" type="text/css" href="https://usercss.blog.st-hatena.com/blog_style/8454420450104491317/adba36f47099ed22482788b31d7c65e29c60df16"/> <script> </script> <style> div#google_afc_user, div.google-afc-user-container, div.google_afc_image, div.google_afc_blocklink { display: block !important; } </style> <script type="application/ld+json">{"@context":"http://schema.org","@type":"Article","dateModified":"2015-11-16T17:30:24+09:00","datePublished":"2015-11-16T10:27:14+09:00","headline":"JavaScript大規模開発を語りに行ってきた「KOF2015」参加レポート","image":["http://cdn-ak.f.st-hatena.com/images/fotolife/c/cybozuinsideout/20151112/20151112181231.jpg"]}</script> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <script> (function($) { $(function() { $("div.hatena-module-links a").click(function() { sendCybozuLinkClickEvent('side_click', $(this).attr("href")); }); $("div.entry-content a").click(function() { sendCybozuLinkClickEvent('main_click', $(this).attr("href")); }); }); })(jQuery); function sendCybozuLinkClickEvent(action, label) { ga('create', 'UA-7639138-2', 'auto', {'name': 'HatenaBlogUserTracker'}); ga('HatenaBlogUserTracker.send', 'event', { eventCategory: 'LinkClick', eventAction: action, eventLabel: label, transport: 'beacon' }); } </script> </head> <body class="page-entry header-image-only enable-bottom-editarea category-イベント category-JavaScript globalheader-off globalheader-ng-enabled"> <div id="globalheader-container" data-brand="hatenablog" style="display: none" > <iframe id="globalheader" height="37" frameborder="0" allowTransparency="true"></iframe> </div> <div id="container"> <div id="container-inner"> <header id="blog-title" data-brand="hatenablog"> <div id="blog-title-inner" style="background-image: url('https://cdn-ak.f.st-hatena.com/images/fotolife/c/cybozuinsideout/20180828/20180828132441.png'); background-position: center 0px;"> <div id="blog-title-content"> <h1 id="title"><a href="https://blog.cybozu.io/">Cybozu Inside Out | サイボウズエンジニアのブログ</a></h1> </div> </div> </header> <div id="content" class="hfeed" > <div id="content-inner"> <div id="wrapper"> <div id="main"> <div id="main-inner">   <article class="entry hentry test-hentry js-entry-article date-first autopagerize_page_element chars-200 words-100 mode-markdown entry-odd" id="entry-6653458415127614723" data-keyword-campaign="" data-uuid="6653458415127614723" data-publication-type="entry"> <div class="entry-inner"> <header class="entry-header"> <div class="date entry-date first"> <a href="https://blog.cybozu.io/archive/2015/11/16" rel="nofollow"> <time datetime="2015-11-16T01:27:14Z" title="2015-11-16T01:27:14Z"> <span class="date-year">2015</span><span class="hyphen">-</span><span class="date-month">11</span><span class="hyphen">-</span><span class="date-day">16</span> </time> </a> </div> <h1 class="entry-title"> <a href="https://blog.cybozu.io/entry/2015/11/16/102714" class="entry-title-link bookmark">JavaScript大規模開発を語りに行ってきた「KOF2015」参加レポート</a> </h1> <div class="entry-categories categories"> <a href="https://blog.cybozu.io/archive/category/%E3%82%A4%E3%83%99%E3%83%B3%E3%83%88" class="entry-category-link category-イベント">イベント</a> <a href="https://blog.cybozu.io/archive/category/JavaScript" class="entry-category-link category-JavaScript">JavaScript</a> </div> </header> <div class="entry-content hatenablog-entry"> <p>どうも、大阪開発部のケノドンです。</p> <p>11月6日～7日に大阪で開催された「関西オープンフォーラム（KOF）2015」にブース出展しました。今回も、ソフトウェア、ハードウエア、ロボット、OS、データベース等、様々なものが展示されていました。</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="http://cdn-ak.f.st-hatena.com/images/fotolife/c/cybozuinsideout/20151112/20151112181231.jpg" alt="f:id:cybozuinsideout:20151112181231j:plain:w250" title="f:id:cybozuinsideout:20151112181231j:plain:w250" class="hatena-fotolife" style="width:250px" itemprop="image"></span><span itemscope itemtype="http://schema.org/Photograph"><img src="http://cdn-ak.f.st-hatena.com/images/fotolife/c/cybozuinsideout/20151112/20151112181237.jpg" alt="f:id:cybozuinsideout:20151112181237j:plain:w250" title="f:id:cybozuinsideout:20151112181237j:plain:w250" class="hatena-fotolife" style="width:250px" itemprop="image"></span></p> <p>私達のブースは、大きく3つのテーマに分かれていました。</p> <ol> <li>大阪オフィス移転</li> <li>大規模フロントエンド開発について</li> <li>悟空ボウズマンを助ける体験</li> </ol> <h1>大阪オフィス移転</h1> <p>11月2日から梅田阪急ビルオフィスタワーに移転しました。<br/> 近くに居らっしゃったら是非お越しくださいませ！</p> <p><iframe src="//hatenablog-parts.com/embed?url=http%3A%2F%2Fcybozu.co.jp%2Fosaka%2F" title="サイボウズ大阪梅田オフィスOPEN！│" class="embed-card embed-webcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 155px; max-width: 500px; margin: 10px 0px;"></iframe><cite class="hatena-citation"><a href="http://cybozu.co.jp/osaka/">cybozu.co.jp</a></cite></p> <h1>大規模フロントエンド開発について</h1> <p>大規模Webアプリケーション「<a href="https://kintone.cybozu.com/jp/">kintone</a>」のフロントエンド開発で利用しているツールや言語について語りました。</p> <p><iframe src="https://www.slideshare.net/slideshow/embed_code/key/GlGpKve4Fw3OvF" width="427" height="356" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" style="border:1px solid #CCC; border-width:1px; margin-bottom:5px; max-width: 100%;" allowfullscreen> </iframe> <div style="margin-bottom:5px"> <strong> <a href="https://www.slideshare.net/YasuharuSakai/kintone-54940243" title="kintoneの大規模フロントエンド開発とツール" target="_blank">kintoneの大規模フロントエンド開発とツール</a> </strong> from <strong><a href="http://www.slideshare.net/YasuharuSakai" target="_blank">Yasuharu Sakai</a></strong> </div></p> <h2>JavaScriptによる開発</h2> <p>JavaScriptの開発に当って、次のような課題が考えられます。</p> <ul> <li>スクリプト言語のため、不具合やコードの異常が、コードを実行するまでわからない</li> <li>動的型付けなので、エンジニアがコードから型を読み取らなければならない</li> <li>書き方の自由度が高くて、既存のコードの調査や修正、影響範囲の調査などで、コードを読む時のコストが上がる</li> <li><a href="https://ja.wikipedia.org/wiki/Don%27t_repeat_yourself">DRY</a> が守られない</li> <li>ブラウザが読み込んで実行する事で読み込むコード量が増えるとダウンロードに時間がかかってしまう</li> </ul> <p>現在の kintone の JavaScript は30万行を超えており、保守にかかるコストが開発リソースを圧迫してもおかしくない程の規模になっています。</p> <h3>Google Closure Compiler</h3> <h4>コードの確認</h4> <p>JSDoc で引数や関数の返り値の型の定義をする事によって、Closure Compiler はコードに不整合があることを検知してくれます。</p> <pre class="code lang-javascript" data-lang="javascript" data-unlink><span class="synComment">/**</span> <span class="synComment"> * @param {boolean} isBoolean isBooleanの引数が boolean である事を Compiler に教えておく</span> <span class="synComment"> */</span> <span class="synIdentifier">function</span> logBoolean(isBoolean) <span class="synIdentifier">{</span> <span class="synStatement">if</span> (isBoolean) <span class="synIdentifier">{</span> console.log(<span class="synConstant">'It is true.'</span>); <span class="synIdentifier">}</span> <span class="synStatement">else</span> <span class="synIdentifier">{</span> console.log(<span class="synConstant">'It is false.'</span>); <span class="synIdentifier">}</span> <span class="synIdentifier">}</span>; logBoolean(<span class="synConstant">false</span>); <span class="synComment">// It is false.</span> logBoolean(<span class="synConstant">'false'</span>); <span class="synComment">// 'false' は boolean ではないため、COMPILE ERROR！</span> </pre> <p>同じように、変数に与えられる値、関数の使い方などを確認します。そのためはちゃんとJSDocを書かなければなりません。他にシンタックスエラー、関数に渡す引数の数、定義されていないプロパティなど、いろいろみてくれます。<br/> このような Closure Compiler による事前解析によって、単純な不具合を防ぐ事が想像できると思います。</p> <h4>コードの圧縮</h4> <p>先ほどの例をもう一度使います。</p> <pre class="code lang-javascript" data-lang="javascript" data-unlink><span class="synComment">/**</span> <span class="synComment"> * @param {boolean} isBoolean</span> <span class="synComment"> */</span> <span class="synIdentifier">function</span> logBoolean(isBoolean) <span class="synIdentifier">{</span> <span class="synStatement">if</span> (isBoolean) <span class="synIdentifier">{</span> console.log(<span class="synConstant">'It is true.'</span>); <span class="synIdentifier">}</span> <span class="synStatement">else</span> <span class="synIdentifier">{</span> console.log(<span class="synConstant">'It is false.'</span>); <span class="synIdentifier">}</span> <span class="synIdentifier">}</span>; logBoolean(<span class="synConstant">false</span>); logBoolean(<span class="synConstant">true</span>); </pre> <p>このコードは250byteぐらいあります。Closure Compiler が最適化をしてくれたら下記のようになります。</p> <pre class="code lang-javascript" data-lang="javascript" data-unlink><span class="synIdentifier">function</span> a(b)<span class="synIdentifier">{</span>b?console.log(<span class="synConstant">'It is true.'</span>):console.log(<span class="synConstant">'It is false.'</span>)<span class="synIdentifier">}</span>a(!1);a(!0); </pre> <p>なんと、100byte以下になりました。<br/> 圧縮する事で、ブラウザ上の読み込みが速くなって、ユーザにより良いサービスを提供ができます。</p> <h3>Google Closure Library</h3> <p>Closure Tools の一つであり、包括的な JavaScript ライブラリです。</p> <ul> <li>ライブラリでできることはライブラリに任せる</li> <li>DOM管理が快適</li> <li>Closure Compiler と相性が良い</li> </ul> <p>ライブラリを使いこなすことで効率的かつ統一的なコードがかけます。</p> <p>例えば、少し修正した<a href="#%E6%82%9F%E7%A9%BA%E3%83%9C%E3%82%A6%E3%82%BA%E3%83%9E%E3%83%B3%E3%82%92%E5%8A%A9%E3%81%91%E3%82%8B%E4%BD%93%E9%A8%93">体験アプリ</a>のクラス kintone.component.Button をご覧ください。</p> <pre class="code lang-javascript" data-lang="javascript" data-unlink> <span class="synComment">/**</span> <span class="synComment"> * ボタンのコンストラクタ</span> <span class="synComment"> *</span> <span class="synComment"> * @param {goog.dom.DomHelper=} opt_domHelper</span> <span class="synComment"> * @constructor</span> <span class="synComment"> * @extends {goog.ui.Component} Closure Library のクラスを継承している</span> <span class="synComment"> */</span> kintone.component.Button = <span class="synIdentifier">function</span>(anyBoolean, opt_domHelper) <span class="synIdentifier">{</span> <span class="synComment">// 親クラスのコンストラクタを呼び出す。</span> kintone.component.Button.base(<span class="synIdentifier">this</span>, <span class="synConstant">'constructor'</span>, opt_domHelper); <span class="synIdentifier">}</span>; goog.inherits(kintone.component.Button, goog.ui.Component); <span class="synComment">/**</span> <span class="synComment"> * 当クラスの DOM が生成するに呼ばれる関数</span> <span class="synComment"> * </span> <span class="synComment"> * 親クラスの goog.ui.Component に定義されているので override アノテーションを設定</span> <span class="synComment"> * @override</span> <span class="synComment"> */</span> kintone.component.Button.prototype.createDom = <span class="synIdentifier">function</span>() <span class="synIdentifier">{</span> <span class="synComment">// 次の Closure Template に定義されている kintone.template.soy.buttonDiv のテンプレートから DOM を生成する</span> <span class="synIdentifier">var</span> el = goog.soy.renderAsElement(kintone.template.soy.buttonDiv, <span class="synStatement">null</span>, <span class="synStatement">null</span>, <span class="synIdentifier">this</span>.getDomHelper()); <span class="synComment">// 当インスタンスのエレメントを設定する。生成した DOM と JavaScript オブジェクトの連携ができた。</span> <span class="synIdentifier">this</span>.setElementInternal(el); <span class="synIdentifier">}</span>; <span class="synComment">/**</span> <span class="synComment"> * document に DOM が入れられた時に呼ばれる関数</span> <span class="synComment"> * </span> <span class="synComment"> * ボタンにクリックされる事をListenする</span> <span class="synComment"> *</span> <span class="synComment"> * @override</span> <span class="synComment"> */</span> kintone.component.Button.prototype.enterDocument = <span class="synIdentifier">function</span>() <span class="synIdentifier">{</span> kintone.component.Button.base(<span class="synIdentifier">this</span>, <span class="synConstant">'enterDocument'</span>); <span class="synComment">// インスタンスの DOM の第一子エレメントを取得する。</span> <span class="synIdentifier">var</span> callButton = goog.dom.getFirstElementChild(<span class="synIdentifier">this</span>.getContentElement()); <span class="synComment">// クリックされた時に this.callBozuman を呼び出すように設定する。</span> <span class="synIdentifier">this</span>.getHandler().listen(callButton, goog.events.EventType.CLICK, <span class="synIdentifier">this</span>.callBozman); <span class="synIdentifier">}</span>; <span class="synComment">/**</span> <span class="synComment"> * 悟空ボウズマンの画像インスタンスを作成して表示する</span> <span class="synComment"> */</span> kintone.component.Button.prototype.callBozuman = <span class="synIdentifier">function</span>() <span class="synIdentifier">{</span> <span class="synComment">// 悟空ボウズマンインスタンスを作成する</span> <span class="synIdentifier">var</span> goku = <span class="synStatement">new</span> kintone.component.Goku(); <span class="synComment">// 悟空ボウズマンを document に入れる</span> goku.render(); <span class="synComment">// 当ボタン自体はdocumentから破壊する</span> <span class="synIdentifier">this</span>.disposeInternal(); <span class="synIdentifier">}</span>; </pre> <p>上記の様に、簡単に DOM の生成、管理ができます。</p> <h3>Google Closure Template</h3> <p>動的なUI生成システムです。</p> <ul> <li>HTMLやUIパーツを再利用可能な塊として扱える</li> <li>Java と JavaScript から利用できる</li> <li>パーツ自体はHTMLを拡張したような形で、書きやすく読みやすい</li> </ul> <p>再利用によって、同じような異なるコードを防ぐことができます。</p> <p>上記に呼び出された kintone.template.soy.buttonDiv テンプレートの中身をみてみましょう。</p> <pre class="code" data-lang="" data-unlink>{namespace kintone.template.soy} /** * 悟空ボウズマンを呼び出すボタン */ {template .buttonDiv} <div class="content-wrapper"> <a href="#" class="button">ボウズマンを助ける</a> </div> {/template}</pre> <p>HTMLをパーツとして命名でき、パラメータも設定可能で、共通化しやすいのでとても便利です。</p> <h3>Google Closure Linter</h3> <p>JavaScript のファイルをチェックしてくれます。</p> <ul> <li>セミコロンはある？</li> <li>規約と異なる書き方されてない？</li> <li>JsDoc のアノテーションが正しく書けてる？</li> </ul> <p>人による細かいミスを事前に防ぐことができます。</p> <h3>まとめ</h3> <ul> <li>静的型付＋圧縮＋最適化したいから Closure Compiler</li> <li>Closure Compiler と一緒に利用するため Closure Library</li> <li>Closure Library と相性の良い Closure Template で DOM生成</li> <li>コード規約を仕組みで縛るために Closure Linter</li> </ul> <h2>CSSの管理について</h2> <h3>CSSでよく現れる問題</h3> <ul> <li>マジックナンバー：意味のわからないpx指定などが増える</li> <li>いろんなブラウザで同じようなスタイルにするために、大量の記述が必要なことがある</li> <li>再利用ができなく、冗長したスタイルが増える</li> </ul> <p>という事で、大規模にしてメンテナンスコストが爆発する！対策として、2つのツールを紹介します。</p> <h3>Sass</h3> <ul> <li>変数や計算が利用できる　⇒　値に意味をもたせられる</li> <li>ネスト構造で直感的なスタイル指定　⇒　整理しやすい</li> <li>コンポネント化が可能　⇒　再利用ができる</li> </ul> <h3>autoprefixer</h3> <ul> <li>一つのスタイルからすべてのブラウザに必要なスタイルを生成してくれる</li> </ul> <p>実装が楽になり、メンテナンスコストが減るのも、人が書くことによるミスを防げる事がメリットとなります。</p> <h3>サンプル</h3> <pre class="code lang-css" data-lang="css" data-unlink>$great-color: #0a3c59; // 変数を定義 %common-border <span class="synIdentifier">{</span> // 再利用のためのスタイル定義 <span class="synType">border</span>: <span class="synConstant">1px</span> <span class="synType">solid</span> $great-<span class="synType">color</span>; // 変数を利用 <span class="synIdentifier">}</span> <span class="synIdentifier">.common-button</span> <span class="synIdentifier">{</span> @extend %common-<span class="synType">border</span>; // %common-<span class="synType">border</span> を呼び出す <span class="synIdentifier">}</span> <span class="synIdentifier">.big-button</span> <span class="synIdentifier">{</span> @extend %common-<span class="synType">border</span>; // %common-<span class="synType">border</span> を呼び出す <span class="synType">border</span>-radius: <span class="synConstant">6px</span>; &:hover { // ネスティングを利用 <span class="synType">color</span>: $great-<span class="synType">color</span>; // 変数を利用 <span class="synIdentifier">}</span> <span class="synError">}</span> </pre> <h1>悟空ボウズマンを助ける体験</h1> <p>Google Closure Compiler が具体的にどういう風に役立つかを感じてもらうために、体験アプリを作りました。<br/> <a href="https://github.com/oldergod/GokubozumanKOF2015">githubに公開している</a>ので是非ご覧ください。</p> <p><span itemscope itemtype="http://schema.org/Photograph"><img src="http://cdn-ak.f.st-hatena.com/images/fotolife/c/cybozuinsideout/20151110/20151110163412.jpg" alt="f:id:cybozuinsideout:20151110163412j:plain:w400" title="f:id:cybozuinsideout:20151110163412j:plain:w400" class="hatena-fotolife" style="width:400px" itemprop="image"></span></p> <h2>内容</h2> <p>コードに問題を含んだアプリを用意しました。Closure Compiler を使って、エラーの検知をし、対応していくような体験になります。</p> <p>全部で5個、エラーを一個ずつ直してみましょう。</p> <h3>1. パースエラー</h3> <pre class="code" data-lang="" data-unlink>app/javascript/goku.js:133: ERROR - Parse error. ',' expected var el = goog.soy.renderAsElement(kintone.template.soy.gokuMessage, null, null, this.getDomHelper(); ^</pre> <h4>原因</h4> <p><code>goog.soy.renderAsElement</code> の締め括弧が足りないというエラーになります。</p> <h4>解決</h4> <p><code>)</code>を足す。</p> <h3>2. 定義されていないプロパティ</h3> <pre class="code" data-lang="" data-unlink> this.getHandler().listen(callButton, goog.events.EventType.CLICK, this.callBozman); ^ </pre> <h4>原因</h4> <p>すぐ下に定義されているプロパティがあります。<code>kintone.component.Button.prototype.callBozuman</code> は確かにありますが、良くみたら綴りに差が出ています。<code>u</code> が不足しています。</p> <h4>解決</h4> <p><code>this.callBozman</code> に <code>u</code> を足す。</p> <h3>3. 引数の数エラー</h3> <pre class="code" data-lang="" data-unlink>app/javascript/goku.js:112: ERROR - Function goog.ui.Component.prototype.getContentElement: called with 1 argument(s). Function requires at least 0 argument(s) and no more than 0 argument(s). gokuMessage.render(this.getContentElement(true)); ^</pre> <h4>原因</h4> <p>エラーの内容は <code>this.getContentElement</code> に引数を一つ渡しているけれど、この関数は引数が必要ないということが書いてあります。</p> <h4>解決</h4> <p>引数として渡している <code>true</code> を消す。</p> <h3>4. 引数型エラー</h3> <pre class="code" data-lang="" data-unlink>app/javascript/setup.js:15: ERROR - actual parameter 1 of kintone.component.Button does not match formal parameter found : string required: boolean var button = new kintone.component.Button(kintone.setup.anyBoolean()); ^</pre> <h4>原因</h4> <p>エラーの内容を見ると、 <code>kintone.component.Button</code> は <code>boolean</code> の引数を求めていますが、<code>string</code> が渡されています。Compiler がなぜそう判断したかというと<br/> * <code>kintone.component.Button</code> の Doc に <code>@param {boolean} anyBoolean 意味のないboolean</code> がある事で、Compiler は <code>boolean</code> を渡す必要性がわかる * <code>kintone.setup.anyBoolean</code> の中身は <code>return true;</code> と書いてあるにも関わらず、 Doc が <code>@return {string}</code> となっているので、Compiler は <code>kintone.setup.anyBoolean</code> が <code>string</code> を返すと判断するよって、<code>kintone.setup.anyBoolean</code> の名前とその内容から、Doc に問題があるとわかります。</p> <h4>解決</h4> <p><code>kintone.setup.anyBoolean</code> の Doc に返り値の型を <code>boolean</code> に書き換える。</p> <h3>5. 返り値型エラー</h3> <pre class="code" data-lang="" data-unlink>app/javascript/setup.js:27: ERROR - inconsistent return type found : boolean required: string return true; ^</pre> <h4>原因</h4> <p><code>kintone.setup.anyBoolean</code> は Doc に <code>@return {string}</code> が書いてあるのに <code>return true;</code> をしている事で、問題があると Compiler が判断しました。実は一つ上のエラーを修正で、このエラーも直されました。</p> <h4>解決</h4> <p><code>kintone.setup.anyBoolean</code> の Doc に返り値の型を <code>boolean</code> に書き換える。</p> <h2>まとめ</h2> <p>スクリプト言語である JavaScript でも Google Closure Tools を利用することで、事前にいろいろのような問題の検知ができる事がわかりました。kintone のように、規模が大きくなるととても大切な仕組みとなってきます。</p> <h1>最後に</h1> <p>二日間だけでしたがいろんな人と出会えてとてもよかったと思います。また、ブースに来てくださった皆様、アドバイスや応援のメッセージをくださった皆様にもありがとうございます！<br/> 来年のKOFに向かって皆様に楽しんで頂けるネタを考えて行きたいと思います！</p> </div> <footer class="entry-footer"> <div class="entry-tags-wrapper"> <div class="entry-tags"> </div> </div> <p class="entry-footer-section track-inview-by-gtm" data-gtm-track-json="{"area": "finish_reading"}"> <span class="author vcard"><span class="fn" data-load-nickname="1" data-user-name="cybozuinsideout" >cybozuinsideout</span></span> <span class="entry-footer-time"><a href="https://blog.cybozu.io/entry/2015/11/16/102714"><time data-relative datetime="2015-11-16T01:27:14Z" title="2015-11-16T01:27:14Z" class="updated">2015-11-16 10:27</time></a></span> </p> <div class="social-buttons"> </div> <div class="customized-footer"> <div class="entry-footer-modules" id="entry-footer-secondary-modules"> <div class="hatena-module hatena-module-related-entries" >  <div class="hatena-module-title"> 関連記事 </div> <div class="hatena-module-body"> <ul class="related-entries hatena-urllist urllist-with-thumbnails"> <li class="urllist-item related-entries-item"> <div class="urllist-item-inner related-entries-item-inner"> <a class="urllist-image-link related-entries-image-link" href="https://blog.cybozu.io/entry/2023/08/29/101907"> <img alt="React 化した共通ヘッダーを kintone の全ページに適用しました！" src="https://cdn.image.st-hatena.com/image/square/e542030df778fb5356b7a40358ca79eb255f0a2a/backend=imagemagick;height=100;version=1;width=100/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fy%2Fyellow-sabotech%2F20230818%2F20230818101440.jpg" class="urllist-image related-entries-image" title="React 化した共通ヘッダーを kintone の全ページに適用しました！" width="100" height="100" loading="lazy"> </a> <div class="urllist-date-link related-entries-date-link"> <a href="https://blog.cybozu.io/archive/2023/08/29" rel="nofollow"> <time datetime="2023-08-29T01:19:07Z" title="2023年8月29日"> 2023-08-29 </time> </a> </div> <a href="https://blog.cybozu.io/entry/2023/08/29/101907" class="urllist-title-link related-entries-title-link urllist-title related-entries-title">React 化した共通ヘッダーを kintone の全ページに適用しました！</a> <div class="urllist-entry-body related-entries-entry-body">こんにちは！kintone フロントエンドリアーキテクチャプロジェ…</div> </div> </li> <li class="urllist-item related-entries-item"> <div class="urllist-item-inner related-entries-item-inner"> <div class="urllist-date-link related-entries-date-link"> <a href="https://blog.cybozu.io/archive/2021/09/13" rel="nofollow"> <time datetime="2021-09-12T23:00:00Z" title="2021年9月13日"> 2021-09-13 </time> </a> </div> <a href="https://blog.cybozu.io/entry/2021/09/13/080000" class="urllist-title-link related-entries-title-link urllist-title related-entries-title">フロントエンド刷新のために DevTools を作って開発を捗らせる</a> <div class="urllist-entry-body related-entries-entry-body">こんにちは、フロントエンドエキスパートチームの麦島(@mugi_un…</div> </div> </li> <li class="urllist-item related-entries-item"> <div class="urllist-item-inner related-entries-item-inner"> <div class="urllist-date-link related-entries-date-link"> <a href="https://blog.cybozu.io/archive/2021/07/20" rel="nofollow"> <time datetime="2021-07-20T08:00:00Z" title="2021年7月20日"> 2021-07-20 </time> </a> </div> <a href="https://blog.cybozu.io/entry/2021/07/20/170000" class="urllist-title-link related-entries-title-link urllist-title related-entries-title">kintoneのフロントエンド刷新に向けた取り組み</a> <div class="urllist-entry-body related-entries-entry-body">こんにちは。kintone開発チーム Webエンジニアの村田です。本…</div> </div> </li> <li class="urllist-item related-entries-item"> <div class="urllist-item-inner related-entries-item-inner"> <div class="urllist-date-link related-entries-date-link"> <a href="https://blog.cybozu.io/archive/2021/01/18" rel="nofollow"> <time datetime="2021-01-18T02:00:00Z" title="2021年1月18日"> 2021-01-18 </time> </a> </div> <a href="https://blog.cybozu.io/entry/2021/01/18/110000" class="urllist-title-link related-entries-title-link urllist-title related-entries-title">大規模 Closure Tools プロジェクトに Prettier を導入するまでの道のり</a> <div class="urllist-entry-body related-entries-entry-body">こんにちは、フロントエンドエキスパートチームの鈴木(@__sosuk…</div> </div> </li> <li class="urllist-item related-entries-item"> <div class="urllist-item-inner related-entries-item-inner"> <a class="urllist-image-link related-entries-image-link" href="https://blog.cybozu.io/entry/about-clutz"> <img alt="Closure LibraryからTypeScriptの型定義を生成する" src="https://cdn.image.st-hatena.com/image/square/d6699a70cd4521c331bd4fbc12e95b3911d27659/backend=imagemagick;height=100;version=1;width=100/https%3A%2F%2Fcdn.user.blog.st-hatena.com%2Fdefault_entry_og_image%2F110495017%2F1514249404572921" class="urllist-image related-entries-image" title="Closure LibraryからTypeScriptの型定義を生成する" width="100" height="100" loading="lazy"> </a> <div class="urllist-date-link related-entries-date-link"> <a href="https://blog.cybozu.io/archive/2020/05/01" rel="nofollow"> <time datetime="2020-05-01T00:00:00Z" title="2020年5月1日"> 2020-05-01 </time> </a> </div> <a href="https://blog.cybozu.io/entry/about-clutz" class="urllist-title-link related-entries-title-link urllist-title related-entries-title">Closure LibraryからTypeScriptの型定義を生成する</a> <div class="urllist-entry-body related-entries-entry-body">こんにちは、フロントエンドチームエキスパートチームの穴井(@p…</div> </div> </li> </ul> </div> </div> </div> <div class="entry-footer-html"><script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script> !function(t){t(function(){var n=function(n){var e=t(".entry-inner .entry-content:first"),r="<p><h3>あわせて読みたい</h3><ul>";t(n).each(function(){var n=t(this);r=r+'<li><a onclick="sendCybozuLinkClickEvent(\'awasete_click\', this.href);" href="'+n.find("link").text()+'">'+n.find("title").text()+"</a></li>"}),r+="</ul></p>",e.append(r)},e="",r=t(".categories a");if(r.length){var a=Math.floor(Math.random()*r.length);e=t(r[a]).attr("href").match(/\/category\/.*/)}var i=function(t,n){var e,r=[];for(e=0;t>=e;e++)r.push(e);return r.sort(function(){return Math.random()-.5}),r.slice(0,n)},o="https://"+location.hostname+"/rss"+e;t.get(o,function(e){var r=t(e).find("item"),a=[],o=5,f=t(".entry-header .entry-title a").text();if(r=t.grep(r,function(n,e){var r=t(n);return r.find("title").text()==f?!1:!0}),r.length>o){var h,u=i(r.length-1,o).sort(function(t,n){return parseInt(t)>parseInt(n)?1:-1});for(h=0;h<u.length;h++)a.push(t(r[u[h]]))}else a=r;n(a)})})}(jQuery); </script> <div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/ja_JP/sdk.js#xfbml=1&version=v2.3"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> <a href="http://b.hatena.ne.jp/entry/https://blog.cybozu.io/entry/2015/11/16/102714" class="hatena-bookmark-button" data-hatena-bookmark-title="JavaScript大規模開発を語りに行ってきた「KOF2015」参加レポート - Cybozu Inside Out | サイボウズエンジニアのブログ" data-hatena-bookmark-layout="standard-balloon" data-hatena-bookmark-lang="ja" title="このエントリーをはてなブックマークに追加"><img src="https://b.st-hatena.com/images/entry-button/button-only@2x.png" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a><script type="text/javascript" src="https://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script> <a href="https://twitter.com/share" class="twitter-share-button tweets" data-url="https://blog.cybozu.io/entry/2015/11/16/102714">Tweet</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script> <div class="fb-like" data-href="https://blog.cybozu.io/entry/2015/11/16/102714" data-layout="button_count" data-action="like" data-show-faces="true" data-share="false"></div></div> </div> </footer> </div> </article>   <div class="pager pager-permalink permalink"> <span class="pager-prev"> <a href="https://blog.cybozu.io/entry/2015/11/18/080000" rel="prev"> <span class="pager-arrow">« </span> サイボウズでエンジニアとして働く事の魅… </a> </span> <span class="pager-next"> <a href="https://blog.cybozu.io/entry/2015/11/13/080000" rel="next"> 竹添さんを呼んでマイクロサービス社内勉… <span class="pager-arrow"> »</span> </a> </span> </div> </div> </div> <aside id="box1"> <div id="box1-inner"> </div> </aside> </div> <aside id="box2"> <div id="box2-inner"> <div class="hatena-module hatena-module-profile"> <div class="hatena-module-title"> Profile </div> <div class="hatena-module-body"> <a href="https://blog.cybozu.io/about" class="profile-icon-link"> <img src="https://cdn.profile-image.st-hatena.com/users/cybozuinsideout/profile.png?1671431787" alt="id:cybozuinsideout" class="profile-icon" /> </a> <span class="id"> <a href="https://blog.cybozu.io/about" class="hatena-id-link"><span data-load-nickname="1" data-user-name="cybozuinsideout">id:cybozuinsideout</span></a> <a href="https://blog.hatena.ne.jp/guide/corporation" title="はてなブログ for DevBlog"><i class="badge-type-devblog">はてなブログ for DevBlog</i></a> </span> <div class="profile-activities"> 最終更新: <time datetime="2025-02-26T02:20:00Z" data-relative data-epoch="1740536400000" class="updated">2025-02-26 11:20</time> </div> <div class="hatena-follow-button-box btn-subscribe js-hatena-follow-button-box" > <a href="#" class="hatena-follow-button js-hatena-follow-button"> <span class="subscribing"> <span class="foreground">読者です</span> <span class="background">読者をやめる</span> </span> <span class="unsubscribing" data-track-name="profile-widget-subscribe-button" data-track-once> <span class="foreground">読者になる</span> <span class="background">読者になる</span> </span> </a> <div class="subscription-count-box js-subscription-count-box"> <i></i> <u></u> <span class="subscription-count js-subscription-count"> </span> </div> </div> <div class="profile-about"> <a href="https://blog.cybozu.io/about">このブログについて</a> </div> </div> </div> <div class="hatena-module hatena-module-html"> <div class="hatena-module-title">リンク</div> <div class="hatena-module-body"> <ul class="hatena-urllist"> <li> <div style="display:flex;"><a href="https://tech.cybozu.io/" target="_blank" ref="noopener"><img class="linklist-img" src="https://tech.cybozu.io/favicon-32x32.png" width="24" height="24" />Cybozu Tech - ポータルサイト</a> </div> </li> <li> <div style="display:flex;"> <a href="https://blog.kintone.io/" target="_blank" ref="noopener"><img src="https://blog.kintone.io/icon/favicon" width="24" height="24" class="linklist-img" />Kintone Engineering Blog</a> </div> </li> <li> <div style="display:flex;"> <a href="https://tech.cybozu.vn/" target="_blank" ref="noopener"><img src="https://tech.cybozu.vn/favicon-32x32.png" width="24" height="24" class="linklist-img">Cybozu Vietnam Tech Sharing</a> </div> </li> <li> <div style="display:flex;"> <a href="https://twitter.com/cybozuinsideout" target="_blank" ref="noopener"><img src="https://abs.twimg.com/favicons/twitter.3.ico"width="24" height="24" class="linklist-img" />X (旧Twitter) - CybozuInsideOut</a> </div> </li> <li> <div style="display:flex;"> <a href="https://cybozu.connpass.com/" target="_blank" ref="noopener"><img src="https://connpass.com/static/img/favicon.ico"width="24" height="24" class="linklist-img" />connpass - Cybozu Inside Out</a> </div> </li> <li> <div style="display:flex;"> <a href="https://speakerdeck.com/cybozuinsideout/" target="_blank" ref="noopener"><img src="https://d1eu30co0ohy4w.cloudfront.net/assets/favicon-bdd5839d46040a50edf189174e6f7aacc8abb3aaecd56a4711cf00d820883f47.png" width="24" height="24" class="linklist-img">Speaker Deck - cybozuinsideout</a> </div> </li> <li> <div style="display:flex;"> <a href="https://www.youtube.com/c/cybozuinsideout" target="_blank" ref="noopener"><img src="https://www.youtube.com/s/desktop/25bf5aae/img/favicon_32x32.png" width="24" height="24" class="linklist-img" /> YouTube - cybozuinsideout</a> </div> </li> <li> <div style="display:flex;"> <a href="https://cybozu.github.io/summer-blog-fes-2024/" target="_blank" ref="noopener"><img src="https://cybozu.github.io/summer-blog-fes-2024/favicon.png"width="24" height="24" class="linklist-img" />CYBOZU SUMMER BLOG FES '24</a> </div> </li> <li> <div style="display:flex;"> <a href="https://blog.cybozu.io/advent_calendar_2022"><img src="https://cdn-ak.f.st-hatena.com/images/fotolife/c/cybozuinsideout/20230529/20230529185416.png" width="24" height="24" class="linklist-img" /> Cybozu Advent Calendar 2022</a> </div> </li> </ul> </div> </div> <div class="hatena-module hatena-module-html"> <div class="hatena-module-title">X (旧Twitter)</div> <div class="hatena-module-body"> <a class="twitter-timeline" data-width="410" data-height="400" href="https://twitter.com/cybozuinsideout?ref_src=twsrc%5Etfw">Tweets by cybozuinsideout</a> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> </div> </div> <div class="hatena-module hatena-module-recent-entries "> <div class="hatena-module-title"> <a href="https://blog.cybozu.io/archive"> 最新記事 </a> </div> <div class="hatena-module-body"> <ul class="recent-entries hatena-urllist urllist-with-thumbnails"> <li class="urllist-item recent-entries-item"> <div class="urllist-item-inner recent-entries-item-inner"> <a class="urllist-image-link recent-entries-image-link" href="https://blog.cybozu.io/entry/2025/02/26/112000"> <img alt="25新卒エンジニア5人の内定者アルバイト体験記" src="https://cdn.image.st-hatena.com/image/square/00fa050e84154d539982a4af8425c1f0aae23a2f/backend=imagemagick;height=140;version=1;width=250/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fm%2Fmehm8128%2F20250218%2F20250218181757.png" class="urllist-image recent-entries-image" title="25新卒エンジニア5人の内定者アルバイト体験記" width="250" height="140" loading="lazy"> </a> <div class="urllist-date-link recent-entries-date-link"> <a href="https://blog.cybozu.io/archive/2025/02/26" rel="nofollow"> <time datetime="2025-02-26T02:20:00Z" title="2025年2月26日"> 2025-02-26 </time> </a> </div> <a href="https://blog.cybozu.io/entry/2025/02/26/112000" class="urllist-title-link recent-entries-title-link urllist-title recent-entries-title">25新卒エンジニア5人の内定者アルバイト体験記</a> <div class="urllist-entry-body recent-entries-entry-body">こんにちは、サイボウズ 25卒エンジニアチームです。今回、サイボウズの25卒エンジニアの中で内定者アル…</div> </div> </li> <li class="urllist-item recent-entries-item"> <div class="urllist-item-inner recent-entries-item-inner"> <a class="urllist-image-link recent-entries-image-link" href="https://blog.cybozu.io/entry/2025/02/21/140000"> <img alt="コドモンとサイボウズで、XPとスクラムのアプローチの違いを語るイベントを開催しました！" src="https://cdn.image.st-hatena.com/image/square/551f319e5fb358f451e0a09a9d4092b95683ba34/backend=imagemagick;height=140;version=1;width=250/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fy%2Fyellow-sabotech%2F20250217%2F20250217214752.png" class="urllist-image recent-entries-image" title="コドモンとサイボウズで、XPとスクラムのアプローチの違いを語るイベントを開催しました！" width="250" height="140" loading="lazy"> </a> <div class="urllist-date-link recent-entries-date-link"> <a href="https://blog.cybozu.io/archive/2025/02/21" rel="nofollow"> <time datetime="2025-02-21T05:00:00Z" title="2025年2月21日"> 2025-02-21 </time> </a> </div> <a href="https://blog.cybozu.io/entry/2025/02/21/140000" class="urllist-title-link recent-entries-title-link urllist-title recent-entries-title">コドモンとサイボウズで、XPとスクラムのアプローチ…</a> <div class="urllist-entry-body recent-entries-entry-body">こんにちは。kintone開発のAndroidエンジニア、トニオ（@tonionagauzzi）です。本日は、株式会社コドモン…</div> </div> </li> <li class="urllist-item recent-entries-item"> <div class="urllist-item-inner recent-entries-item-inner"> <a class="urllist-image-link recent-entries-image-link" href="https://blog.cybozu.io/entry/2025/02/21/115859"> <img alt="SwiftUI View Coding Guidelinesを公開しました" src="https://cdn.image.st-hatena.com/image/square/c0967904b1db5bf8ef9cd8ffa5be51b321903fed/backend=imagemagick;height=140;version=1;width=250/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fy%2Fyellow-sabotech%2F20250221%2F20250221113925.png" class="urllist-image recent-entries-image" title="SwiftUI View Coding Guidelinesを公開しました" width="250" height="140" loading="lazy"> </a> <div class="urllist-date-link recent-entries-date-link"> <a href="https://blog.cybozu.io/archive/2025/02/21" rel="nofollow"> <time datetime="2025-02-21T02:58:59Z" title="2025年2月21日"> 2025-02-21 </time> </a> </div> <a href="https://blog.cybozu.io/entry/2025/02/21/115859" class="urllist-title-link recent-entries-title-link urllist-title recent-entries-title">SwiftUI View Coding Guide…</a> <div class="urllist-entry-body recent-entries-entry-body">こんにちは、iOS Developerの@el_metal_です。 SwiftUIのView実装のためのガイドラインを作成・公開したの…</div> </div> </li> </ul> </div> </div> <div class="hatena-module hatena-module-search-box"> <div class="hatena-module-title"> 検索 </div> <div class="hatena-module-body"> <form class="search-form" role="search" action="https://blog.cybozu.io/search" method="get"> <input type="text" name="q" class="search-module-input" value="" placeholder="記事を検索" required> <input type="submit" value="検索" class="search-module-button" /> </form> </div> </div> <div class="hatena-module hatena-module-category"> <div class="hatena-module-title"> カテゴリー </div> <div class="hatena-module-body"> <ul class="hatena-urllist"> <li> <a href="https://blog.cybozu.io/archive/category/AI" class="category-AI"> AI (4) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Android" class="category-Android"> Android (31) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Arduino" class="category-Arduino"> Arduino (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Argo%20CD" class="category-Argo-CD"> Argo CD (8) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/AWS" class="category-AWS"> AWS (14) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/C%2FC%2B%2B" class="category-C/C++"> C/C++ (24) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Ceph" class="category-Ceph"> Ceph (4) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/CI%2FCD" class="category-CI/CD"> CI/CD (9) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Design%20Systems" class="category-Design-Systems"> Design Systems (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/DevOps" class="category-DevOps"> DevOps (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/DOGO" class="category-DOGO"> DOGO (4) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/DX" class="category-DX"> DX (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Elasticsearch" class="category-Elasticsearch"> Elasticsearch (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/EngineeringProductivity" class="category-EngineeringProductivity"> EngineeringProductivity (12) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Flutter" class="category-Flutter"> Flutter (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Garoon" class="category-Garoon"> Garoon (22) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Gemini" class="category-Gemini"> Gemini (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/GitHubActions" class="category-GitHubActions"> GitHubActions (4) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Go" class="category-Go"> Go (18) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Google%20I%2FO" class="category-Google-I/O"> Google I/O (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/iOS" class="category-iOS"> iOS (28) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Java" class="category-Java"> Java (23) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/JavaScript" class="category-JavaScript"> JavaScript (26) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/kintone" class="category-kintone"> kintone (57) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Kotlin" class="category-Kotlin"> Kotlin (8) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/KotlinFest" class="category-KotlinFest"> KotlinFest (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Kubernetes" class="category-Kubernetes"> Kubernetes (41) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Linux" class="category-Linux"> Linux (25) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Maneki" class="category-Maneki"> Maneki (5) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Meetup" class="category-Meetup"> Meetup (15) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/MySQL" class="category-MySQL"> MySQL (15) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Neco" class="category-Neco"> Neco (62) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Network" class="category-Network"> Network (6) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Next.js" class="category-Next.js"> Next.js (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Node.js" class="category-Node.js"> Node.js (3) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/npm" class="category-npm"> npm (4) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/OSC" class="category-OSC"> OSC (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/OST" class="category-OST"> OST (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/PHP" class="category-PHP"> PHP (14) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/PM" class="category-PM"> PM (3) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Python" class="category-Python"> Python (3) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/QA" class="category-QA"> QA (68) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/R" class="category-R"> R (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/React" class="category-React"> React (12) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Rook" class="category-Rook"> Rook (5) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Rust" class="category-Rust"> Rust (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Selenium" class="category-Selenium"> Selenium (9) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/SRE" class="category-SRE"> SRE (11) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Storage" class="category-Storage"> Storage (11) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Swift" class="category-Swift"> Swift (12) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/SwiftUI" class="category-SwiftUI"> SwiftUI (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/TDD" class="category-TDD"> TDD (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/TE" class="category-TE"> TE (6) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/TLS" class="category-TLS"> TLS (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/TypeScript" class="category-TypeScript"> TypeScript (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Ubuntu" class="category-Ubuntu"> Ubuntu (5) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/UX%2FUI" class="category-UX/UI"> UX/UI (17) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/UX%E3%83%A9%E3%82%A4%E3%82%BF%E3%83%BC" class="category-UXライター"> UXライター (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Windows" class="category-Windows"> Windows (5) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/WWDC" class="category-WWDC"> WWDC (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/Yakumo" class="category-Yakumo"> Yakumo (18) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%81%8A%E7%9F%A5%E3%82%89%E3%81%9B" class="category-お知らせ"> お知らせ (32) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%81%B5%E3%82%8A%E3%81%8B%E3%81%88%E3%82%8A" class="category-ふりかえり"> ふりかえり (6) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%8F%E3%81%8C%E3%81%BE%E3%81%BE%E3%82%AB%E3%83%BC%E3%83%89" class="category-わがままカード"> わがままカード (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%A2%E3%82%AF%E3%82%BB%E3%82%B7%E3%83%93%E3%83%AA%E3%83%86%E3%82%A3" class="category-アクセシビリティ"> アクセシビリティ (12) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%A2%E3%82%B8%E3%83%A3%E3%82%A4%E3%83%AB" class="category-アジャイル"> アジャイル (27) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%A2%E3%83%89%E3%83%99%E3%83%B3%E3%83%88%E3%82%AB%E3%83%AC%E3%83%B3%E3%83%80%E3%83%BC" class="category-アドベントカレンダー"> アドベントカレンダー (22) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%A4%E3%83%99%E3%83%B3%E3%83%88" class="category-イベント"> イベント (121) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%A4%E3%83%B3%E3%82%BF%E3%83%BC%E3%83%B3" class="category-インターン"> インターン (63) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%A4%E3%83%B3%E3%83%95%E3%83%A9" class="category-インフラ"> インフラ (47) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%AA%E3%83%BC%E3%83%97%E3%83%B3%E3%82%BD%E3%83%BC%E3%82%B9" class="category-オープンソース"> オープンソース (29) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%B5%E3%82%A4%E3%83%9C%E3%82%A6%E3%82%BAOffice" class="category-サイボウズOffice"> サイボウズOffice (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%B5%E3%82%A4%E3%83%9C%E3%82%A6%E3%82%BA%E3%83%BB%E3%83%A9%E3%83%9C" class="category-サイボウズ・ラボ"> サイボウズ・ラボ (18) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%B9%E3%82%AF%E3%83%A9%E3%83%A0" class="category-スクラム"> スクラム (26) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%B9%E3%82%AF%E3%83%A9%E3%83%A0%E3%83%9E%E3%82%B9%E3%82%BF%E3%83%BC" class="category-スクラムマスター"> スクラムマスター (4) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%BB%E3%82%AD%E3%83%A5%E3%83%AA%E3%83%86%E3%82%A3" class="category-セキュリティ"> セキュリティ (58) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%82%BD%E3%83%95%E3%83%88%E3%82%A6%E3%82%A7%E3%82%A2%E3%83%86%E3%82%B9%E3%83%88" class="category-ソフトウェアテスト"> ソフトウェアテスト (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%81%E3%83%BC%E3%83%A0%E3%83%93%E3%83%AB%E3%83%87%E3%82%A3%E3%83%B3%E3%82%B0" class="category-チームビルディング"> チームビルディング (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%86%E3%82%AF%E3%83%8B%E3%82%AB%E3%83%AB%E3%83%A9%E3%82%A4%E3%83%86%E3%82%A3%E3%83%B3%E3%82%B0" class="category-テクニカルライティング"> テクニカルライティング (21) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%86%E3%82%B9%E3%83%88" class="category-テスト"> テスト (20) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%86%E3%82%B9%E3%83%88%E9%A7%86%E5%8B%95%E9%96%8B%E7%99%BA" class="category-テスト駆動開発"> テスト駆動開発 (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%86%E3%83%AC%E3%83%AF%E3%83%BC%E3%82%AF" class="category-テレワーク"> テレワーク (3) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%87%E3%82%B6%E3%82%A4%E3%83%8A%E3%83%BC%E3%82%A4%E3%83%B3%E3%82%BF%E3%83%BC%E3%83%B3" class="category-デザイナーインターン"> デザイナーインターン (4) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3" class="category-デザイン"> デザイン (15) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%87%E3%83%BC%E3%82%BF%E5%88%86%E6%9E%90" class="category-データ分析"> データ分析 (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88%E7%AE%A1%E7%90%86" class="category-ドキュメント管理"> ドキュメント管理 (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%8F%E3%83%83%E3%82%AB%E3%82%BD%E3%83%B3" class="category-ハッカソン"> ハッカソン (22) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%90%E3%82%B0%E3%83%90%E3%82%A6%E3%83%B3%E3%83%86%E3%82%A3" class="category-バグバウンティ"> バグバウンティ (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%91%E3%83%95%E3%82%A9%E3%83%BC%E3%83%9E%E3%83%B3%E3%82%B9%E3%83%81%E3%83%A5%E3%83%BC%E3%83%8B%E3%83%B3%E3%82%B0" class="category-パフォーマンスチューニング"> パフォーマンスチューニング (6) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%95%E3%83%AD%E3%83%AA%E3%82%A2" class="category-フロリア"> フロリア (35) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%95%E3%83%AD%E3%83%B3%E3%83%88%E3%82%A8%E3%83%B3%E3%83%89" class="category-フロントエンド"> フロントエンド (47) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%96%E3%83%A9%E3%82%A6%E3%82%B6" class="category-ブラウザ"> ブラウザ (5) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9E" class="category-プログラマ"> プログラマ (7) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0" class="category-プログラミング"> プログラミング (41) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0%E3%82%B3%E3%83%B3%E3%83%86%E3%82%B9%E3%83%88" class="category-プログラミングコンテスト"> プログラミングコンテスト (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%9E%E3%83%8D%E3%82%B8%E3%83%A1%E3%83%B3%E3%83%88" class="category-マネジメント"> マネジメント (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%A2%E3%83%90%E3%82%A4%E3%83%AB" class="category-モバイル"> モバイル (67) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%A2%E3%83%96%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9F%E3%83%B3%E3%82%B0" class="category-モブプログラミング"> モブプログラミング (7) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%A9%E3%83%9C%E3%83%A6%E3%83%BC%E3%82%B9" class="category-ラボユース"> ラボユース (20) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%AA%E3%83%95%E3%82%A1%E3%82%AF%E3%82%BF%E3%83%AA%E3%83%B3%E3%82%B0" class="category-リファクタリング"> リファクタリング (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%AA%E3%83%A2%E3%83%BC%E3%83%88%E3%83%AF%E3%83%BC%E3%82%AF" class="category-リモートワーク"> リモートワーク (4) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%AA%E3%83%AC%E3%83%BC%E3%83%96%E3%83%AD%E3%82%B0" class="category-リレーブログ"> リレーブログ (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%AC%E3%83%88%E3%83%AD%E3%82%B9%E3%83%9A%E3%82%AF%E3%83%86%E3%82%A3%E3%83%96" class="category-レトロスペクティブ"> レトロスペクティブ (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E3%83%AD%E3%83%BC%E3%82%AB%E3%83%A9%E3%82%A4%E3%82%BA" class="category-ローカライズ"> ローカライズ (10) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E5%83%8D%E3%81%8D%E6%96%B9" class="category-働き方"> 働き方 (7) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E5%86%85%E5%AE%9A%E8%80%85%E3%82%A2%E3%83%AB%E3%83%90%E3%82%A4%E3%83%88" class="category-内定者アルバイト"> 内定者アルバイト (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E5%8B%89%E5%BC%B7%E4%BC%9A" class="category-勉強会"> 勉強会 (64) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E5%8C%97%E6%B5%B7%E9%81%93" class="category-北海道"> 北海道 (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E5%8F%82%E5%8A%A0%E5%A0%B1%E5%91%8A" class="category-参加報告"> 参加報告 (13) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E5%90%88%E5%AE%BF" class="category-合宿"> 合宿 (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E5%93%81%E8%B3%AA" class="category-品質"> 品質 (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E5%BA%83%E5%B3%B6" class="category-広島"> 広島 (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E6%83%85%E3%82%B7%E3%82%B9" class="category-情シス"> 情シス (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E6%8A%80%E8%A1%93%E5%90%8C%E4%BA%BA%E8%AA%8C" class="category-技術同人誌"> 技術同人誌 (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E6%8C%AF%E3%82%8A%E8%BF%94%E3%82%8A" class="category-振り返り"> 振り返り (4) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E6%96%87%E5%8C%96" class="category-文化"> 文化 (45) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E6%A4%9C%E8%A8%BC" class="category-検証"> 検証 (8) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E6%A9%9F%E8%83%BD%E6%94%B9%E5%96%84" class="category-機能改善"> 機能改善 (3) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E6%B5%B7%E5%A4%96%E5%87%BA%E5%BC%B5" class="category-海外出張"> 海外出張 (7) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E7%94%9F%E6%88%90AI" class="category-生成AI"> 生成AI (2) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E7%94%9F%E7%94%A3%E6%80%A7%E5%90%91%E4%B8%8A%E3%83%81%E3%83%BC%E3%83%A0" class="category-生産性向上チーム"> 生産性向上チーム (12) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E7%99%BA%E8%A1%A8%E8%B3%87%E6%96%99" class="category-発表資料"> 発表資料 (22) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E7%A4%BE%E5%86%85%E3%82%A4%E3%83%99%E3%83%B3%E3%83%88" class="category-社内イベント"> 社内イベント (13) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E8%A8%BC%E6%98%8E%E6%9B%B8" class="category-証明書"> 証明書 (1) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E9%96%8B%E7%99%BA%E3%83%97%E3%83%AD%E3%82%BB%E3%82%B9" class="category-開発プロセス"> 開発プロセス (37) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E9%96%8B%E7%99%BA%E7%92%B0%E5%A2%83" class="category-開発環境"> 開発環境 (29) </a> </li> <li> <a href="https://blog.cybozu.io/archive/category/%E9%A1%A7%E5%AE%A2%E7%90%86%E8%A7%A3" class="category-顧客理解"> 顧客理解 (1) </a> </li> </ul> </div> </div> <div class="hatena-module hatena-module-archive" data-archive-type="default" data-archive-url="https://blog.cybozu.io/archive"> <div class="hatena-module-title"> <a href="https://blog.cybozu.io/archive">月別アーカイブ</a> </div> <div class="hatena-module-body"> <ul class="hatena-urllist"> <li class="archive-module-year archive-module-year-hidden" data-year="2025"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2025" class="archive-module-year-title archive-module-year-2025"> 2025 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2025/02" class="archive-module-month-title archive-module-month-2025-2"> 2025 / 2 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2025/01" class="archive-module-month-title archive-module-month-2025-1"> 2025 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2024"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2024" class="archive-module-year-title archive-module-year-2024"> 2024 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2024/12" class="archive-module-month-title archive-module-month-2024-12"> 2024 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2024/11" class="archive-module-month-title archive-module-month-2024-11"> 2024 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2024/10" class="archive-module-month-title archive-module-month-2024-10"> 2024 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2024/09" class="archive-module-month-title archive-module-month-2024-9"> 2024 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2024/08" class="archive-module-month-title archive-module-month-2024-8"> 2024 / 8 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2024/07" class="archive-module-month-title archive-module-month-2024-7"> 2024 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2024/06" class="archive-module-month-title archive-module-month-2024-6"> 2024 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2024/05" class="archive-module-month-title archive-module-month-2024-5"> 2024 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2024/04" class="archive-module-month-title archive-module-month-2024-4"> 2024 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2024/03" class="archive-module-month-title archive-module-month-2024-3"> 2024 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2024/02" class="archive-module-month-title archive-module-month-2024-2"> 2024 / 2 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2024/01" class="archive-module-month-title archive-module-month-2024-1"> 2024 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2023"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2023" class="archive-module-year-title archive-module-year-2023"> 2023 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2023/12" class="archive-module-month-title archive-module-month-2023-12"> 2023 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2023/11" class="archive-module-month-title archive-module-month-2023-11"> 2023 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2023/10" class="archive-module-month-title archive-module-month-2023-10"> 2023 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2023/09" class="archive-module-month-title archive-module-month-2023-9"> 2023 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2023/08" class="archive-module-month-title archive-module-month-2023-8"> 2023 / 8 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2023/07" class="archive-module-month-title archive-module-month-2023-7"> 2023 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2023/06" class="archive-module-month-title archive-module-month-2023-6"> 2023 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2023/05" class="archive-module-month-title archive-module-month-2023-5"> 2023 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2023/04" class="archive-module-month-title archive-module-month-2023-4"> 2023 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2023/03" class="archive-module-month-title archive-module-month-2023-3"> 2023 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2023/02" class="archive-module-month-title archive-module-month-2023-2"> 2023 / 2 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2023/01" class="archive-module-month-title archive-module-month-2023-1"> 2023 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2022"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2022" class="archive-module-year-title archive-module-year-2022"> 2022 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2022/12" class="archive-module-month-title archive-module-month-2022-12"> 2022 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2022/11" class="archive-module-month-title archive-module-month-2022-11"> 2022 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2022/10" class="archive-module-month-title archive-module-month-2022-10"> 2022 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2022/09" class="archive-module-month-title archive-module-month-2022-9"> 2022 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2022/08" class="archive-module-month-title archive-module-month-2022-8"> 2022 / 8 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2022/07" class="archive-module-month-title archive-module-month-2022-7"> 2022 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2022/06" class="archive-module-month-title archive-module-month-2022-6"> 2022 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2022/05" class="archive-module-month-title archive-module-month-2022-5"> 2022 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2022/04" class="archive-module-month-title archive-module-month-2022-4"> 2022 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2022/03" class="archive-module-month-title archive-module-month-2022-3"> 2022 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2022/02" class="archive-module-month-title archive-module-month-2022-2"> 2022 / 2 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2021"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2021" class="archive-module-year-title archive-module-year-2021"> 2021 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2021/12" class="archive-module-month-title archive-module-month-2021-12"> 2021 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2021/11" class="archive-module-month-title archive-module-month-2021-11"> 2021 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2021/10" class="archive-module-month-title archive-module-month-2021-10"> 2021 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2021/09" class="archive-module-month-title archive-module-month-2021-9"> 2021 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2021/08" class="archive-module-month-title archive-module-month-2021-8"> 2021 / 8 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2021/07" class="archive-module-month-title archive-module-month-2021-7"> 2021 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2021/06" class="archive-module-month-title archive-module-month-2021-6"> 2021 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2021/05" class="archive-module-month-title archive-module-month-2021-5"> 2021 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2021/04" class="archive-module-month-title archive-module-month-2021-4"> 2021 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2021/03" class="archive-module-month-title archive-module-month-2021-3"> 2021 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2021/02" class="archive-module-month-title archive-module-month-2021-2"> 2021 / 2 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2021/01" class="archive-module-month-title archive-module-month-2021-1"> 2021 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2020"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2020" class="archive-module-year-title archive-module-year-2020"> 2020 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2020/12" class="archive-module-month-title archive-module-month-2020-12"> 2020 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2020/11" class="archive-module-month-title archive-module-month-2020-11"> 2020 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2020/10" class="archive-module-month-title archive-module-month-2020-10"> 2020 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2020/09" class="archive-module-month-title archive-module-month-2020-9"> 2020 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2020/08" class="archive-module-month-title archive-module-month-2020-8"> 2020 / 8 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2020/07" class="archive-module-month-title archive-module-month-2020-7"> 2020 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2020/06" class="archive-module-month-title archive-module-month-2020-6"> 2020 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2020/05" class="archive-module-month-title archive-module-month-2020-5"> 2020 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2020/04" class="archive-module-month-title archive-module-month-2020-4"> 2020 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2020/03" class="archive-module-month-title archive-module-month-2020-3"> 2020 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2020/02" class="archive-module-month-title archive-module-month-2020-2"> 2020 / 2 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2020/01" class="archive-module-month-title archive-module-month-2020-1"> 2020 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2019"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2019" class="archive-module-year-title archive-module-year-2019"> 2019 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2019/12" class="archive-module-month-title archive-module-month-2019-12"> 2019 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2019/11" class="archive-module-month-title archive-module-month-2019-11"> 2019 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2019/10" class="archive-module-month-title archive-module-month-2019-10"> 2019 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2019/09" class="archive-module-month-title archive-module-month-2019-9"> 2019 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2019/08" class="archive-module-month-title archive-module-month-2019-8"> 2019 / 8 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2019/07" class="archive-module-month-title archive-module-month-2019-7"> 2019 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2019/06" class="archive-module-month-title archive-module-month-2019-6"> 2019 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2019/05" class="archive-module-month-title archive-module-month-2019-5"> 2019 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2019/04" class="archive-module-month-title archive-module-month-2019-4"> 2019 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2019/03" class="archive-module-month-title archive-module-month-2019-3"> 2019 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2019/02" class="archive-module-month-title archive-module-month-2019-2"> 2019 / 2 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2019/01" class="archive-module-month-title archive-module-month-2019-1"> 2019 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2018"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2018" class="archive-module-year-title archive-module-year-2018"> 2018 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2018/12" class="archive-module-month-title archive-module-month-2018-12"> 2018 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2018/11" class="archive-module-month-title archive-module-month-2018-11"> 2018 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2018/10" class="archive-module-month-title archive-module-month-2018-10"> 2018 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2018/09" class="archive-module-month-title archive-module-month-2018-9"> 2018 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2018/08" class="archive-module-month-title archive-module-month-2018-8"> 2018 / 8 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2018/07" class="archive-module-month-title archive-module-month-2018-7"> 2018 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2018/06" class="archive-module-month-title archive-module-month-2018-6"> 2018 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2018/05" class="archive-module-month-title archive-module-month-2018-5"> 2018 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2018/04" class="archive-module-month-title archive-module-month-2018-4"> 2018 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2018/03" class="archive-module-month-title archive-module-month-2018-3"> 2018 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2018/02" class="archive-module-month-title archive-module-month-2018-2"> 2018 / 2 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2018/01" class="archive-module-month-title archive-module-month-2018-1"> 2018 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2017"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2017" class="archive-module-year-title archive-module-year-2017"> 2017 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2017/12" class="archive-module-month-title archive-module-month-2017-12"> 2017 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2017/11" class="archive-module-month-title archive-module-month-2017-11"> 2017 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2017/10" class="archive-module-month-title archive-module-month-2017-10"> 2017 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2017/09" class="archive-module-month-title archive-module-month-2017-9"> 2017 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2017/08" class="archive-module-month-title archive-module-month-2017-8"> 2017 / 8 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2017/07" class="archive-module-month-title archive-module-month-2017-7"> 2017 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2017/06" class="archive-module-month-title archive-module-month-2017-6"> 2017 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2017/05" class="archive-module-month-title archive-module-month-2017-5"> 2017 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2017/04" class="archive-module-month-title archive-module-month-2017-4"> 2017 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2017/03" class="archive-module-month-title archive-module-month-2017-3"> 2017 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2017/02" class="archive-module-month-title archive-module-month-2017-2"> 2017 / 2 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2017/01" class="archive-module-month-title archive-module-month-2017-1"> 2017 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2016"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2016" class="archive-module-year-title archive-module-year-2016"> 2016 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2016/12" class="archive-module-month-title archive-module-month-2016-12"> 2016 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2016/11" class="archive-module-month-title archive-module-month-2016-11"> 2016 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2016/10" class="archive-module-month-title archive-module-month-2016-10"> 2016 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2016/09" class="archive-module-month-title archive-module-month-2016-9"> 2016 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2016/08" class="archive-module-month-title archive-module-month-2016-8"> 2016 / 8 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2016/07" class="archive-module-month-title archive-module-month-2016-7"> 2016 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2016/06" class="archive-module-month-title archive-module-month-2016-6"> 2016 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2016/05" class="archive-module-month-title archive-module-month-2016-5"> 2016 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2016/04" class="archive-module-month-title archive-module-month-2016-4"> 2016 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2016/03" class="archive-module-month-title archive-module-month-2016-3"> 2016 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2016/02" class="archive-module-month-title archive-module-month-2016-2"> 2016 / 2 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2016/01" class="archive-module-month-title archive-module-month-2016-1"> 2016 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2015"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2015" class="archive-module-year-title archive-module-year-2015"> 2015 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2015/12" class="archive-module-month-title archive-module-month-2015-12"> 2015 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2015/11" class="archive-module-month-title archive-module-month-2015-11"> 2015 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2015/10" class="archive-module-month-title archive-module-month-2015-10"> 2015 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2015/09" class="archive-module-month-title archive-module-month-2015-9"> 2015 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2015/07" class="archive-module-month-title archive-module-month-2015-7"> 2015 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2015/06" class="archive-module-month-title archive-module-month-2015-6"> 2015 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2015/05" class="archive-module-month-title archive-module-month-2015-5"> 2015 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2015/04" class="archive-module-month-title archive-module-month-2015-4"> 2015 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2015/03" class="archive-module-month-title archive-module-month-2015-3"> 2015 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2015/02" class="archive-module-month-title archive-module-month-2015-2"> 2015 / 2 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2015/01" class="archive-module-month-title archive-module-month-2015-1"> 2015 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2014"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2014" class="archive-module-year-title archive-module-year-2014"> 2014 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2014/12" class="archive-module-month-title archive-module-month-2014-12"> 2014 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2014/11" class="archive-module-month-title archive-module-month-2014-11"> 2014 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2014/10" class="archive-module-month-title archive-module-month-2014-10"> 2014 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2014/09" class="archive-module-month-title archive-module-month-2014-9"> 2014 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2014/08" class="archive-module-month-title archive-module-month-2014-8"> 2014 / 8 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2014/07" class="archive-module-month-title archive-module-month-2014-7"> 2014 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2014/06" class="archive-module-month-title archive-module-month-2014-6"> 2014 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2014/05" class="archive-module-month-title archive-module-month-2014-5"> 2014 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2014/04" class="archive-module-month-title archive-module-month-2014-4"> 2014 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2014/03" class="archive-module-month-title archive-module-month-2014-3"> 2014 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2014/02" class="archive-module-month-title archive-module-month-2014-2"> 2014 / 2 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2014/01" class="archive-module-month-title archive-module-month-2014-1"> 2014 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2013"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2013" class="archive-module-year-title archive-module-year-2013"> 2013 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2013/12" class="archive-module-month-title archive-module-month-2013-12"> 2013 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2013/11" class="archive-module-month-title archive-module-month-2013-11"> 2013 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2013/10" class="archive-module-month-title archive-module-month-2013-10"> 2013 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2013/09" class="archive-module-month-title archive-module-month-2013-9"> 2013 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2013/08" class="archive-module-month-title archive-module-month-2013-8"> 2013 / 8 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2013/07" class="archive-module-month-title archive-module-month-2013-7"> 2013 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2013/06" class="archive-module-month-title archive-module-month-2013-6"> 2013 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2013/05" class="archive-module-month-title archive-module-month-2013-5"> 2013 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2013/04" class="archive-module-month-title archive-module-month-2013-4"> 2013 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2013/03" class="archive-module-month-title archive-module-month-2013-3"> 2013 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2013/02" class="archive-module-month-title archive-module-month-2013-2"> 2013 / 2 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2013/01" class="archive-module-month-title archive-module-month-2013-1"> 2013 / 1 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2012"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2012" class="archive-module-year-title archive-module-year-2012"> 2012 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2012/12" class="archive-module-month-title archive-module-month-2012-12"> 2012 / 12 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2012/11" class="archive-module-month-title archive-module-month-2012-11"> 2012 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2012/10" class="archive-module-month-title archive-module-month-2012-10"> 2012 / 10 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2012/09" class="archive-module-month-title archive-module-month-2012-9"> 2012 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2012/06" class="archive-module-month-title archive-module-month-2012-6"> 2012 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2012/04" class="archive-module-month-title archive-module-month-2012-4"> 2012 / 4 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2011"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2011" class="archive-module-year-title archive-module-year-2011"> 2011 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2011/11" class="archive-module-month-title archive-module-month-2011-11"> 2011 / 11 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2011/07" class="archive-module-month-title archive-module-month-2011-7"> 2011 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2011/04" class="archive-module-month-title archive-module-month-2011-4"> 2011 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2011/03" class="archive-module-month-title archive-module-month-2011-3"> 2011 / 3 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2011/02" class="archive-module-month-title archive-module-month-2011-2"> 2011 / 2 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2010"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2010" class="archive-module-year-title archive-module-year-2010"> 2010 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2010/06" class="archive-module-month-title archive-module-month-2010-6"> 2010 / 6 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2010/05" class="archive-module-month-title archive-module-month-2010-5"> 2010 / 5 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2010/04" class="archive-module-month-title archive-module-month-2010-4"> 2010 / 4 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2010/02" class="archive-module-month-title archive-module-month-2010-2"> 2010 / 2 </a> </li> </ul> </li> <li class="archive-module-year archive-module-year-hidden" data-year="2009"> <div class="archive-module-button"> <span class="archive-module-hide-button">▼</span> <span class="archive-module-show-button">▶</span> </div> <a href="https://blog.cybozu.io/archive/2009" class="archive-module-year-title archive-module-year-2009"> 2009 </a> <ul class="archive-module-months"> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2009/09" class="archive-module-month-title archive-module-month-2009-9"> 2009 / 9 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2009/07" class="archive-module-month-title archive-module-month-2009-7"> 2009 / 7 </a> </li> <li class="archive-module-month"> <a href="https://blog.cybozu.io/archive/2009/05" class="archive-module-month-title archive-module-month-2009-5"> 2009 / 5 </a> </li> </ul> </li> </ul> </div> </div> </div> </aside> </div> </div> <div id="bottom-editarea"> <footer id="footer"> <div class="entry-footer-section"> <dl> <dd><a href="http://cybozu.co.jp/" target="_blank" rel="noreferrer">サイボウズ株式会社</a></dd> <dd><a href="http://labs.cybozu.co.jp/" target="_blank" rel="noreferrer">サイボウズ・ラボ株式会社</a></dd> <dd><a href="https://cybozu.co.jp/recruit/" target="_blank" rel="noreferrer">採用情報</a></dd> <dd><a href="http://blog.cybozu.io/entry/privacy">プライバシーポリシー</a></dd> </dl> </div> </footer> </div> </div> </div> <div class="quote-box"> <div class="tooltip-quote tooltip-quote-stock"> <i class="blogicon-quote" title="引用をストック"></i> </div> <div class="tooltip-quote tooltip-quote-tweet js-tooltip-quote-tweet"> <a class="js-tweet-quote" target="_blank" data-track-name="quote-tweet" data-track-once> <img src="https://cdn.blog.st-hatena.com/images/admin/quote/quote-x-icon.svg?version=1ca111bc9f0112690b12e1842a1ce8" title="引用して投稿する" > </a> </div> </div> <div class="quote-stock-panel" id="quote-stock-message-box" style="position: absolute; z-index: 3000"> <div class="message-box" id="quote-stock-succeeded-message" style="display: none"> <p>引用をストックしました</p> <button class="btn btn-primary" id="quote-stock-show-editor-button" data-track-name="curation-quote-edit-button">ストック一覧を見る</button> <button class="btn quote-stock-close-message-button">閉じる</button> </div> <div class="message-box" id="quote-login-required-message" style="display: none"> <p>引用するにはまずログインしてください</p> <button class="btn btn-primary" id="quote-login-button">ログイン</button> <button class="btn quote-stock-close-message-button">閉じる</button> </div> <div class="error-box" id="quote-stock-failed-message" style="display: none"> <p>引用をストックできませんでした。再度お試しください</p> <button class="btn quote-stock-close-message-button">閉じる</button> </div> <div class="error-box" id="unstockable-quote-message-box" style="display: none; position: absolute; z-index: 3000;"> <p>限定公開記事のため引用できません。</p> </div> </div> <script type="x-underscore-template" id="js-requote-button-template"> <div class="requote-button js-requote-button"> <button class="requote-button-btn tipsy-top" title="引用する"><i class="blogicon-quote"></i></button> </div> </script> <div id="hidden-subscribe-button" style="display: none;"> <div class="hatena-follow-button-box btn-subscribe js-hatena-follow-button-box" > <a href="#" class="hatena-follow-button js-hatena-follow-button"> <span class="subscribing"> <span class="foreground">読者です</span> <span class="background">読者をやめる</span> </span> <span class="unsubscribing" data-track-name="profile-widget-subscribe-button" data-track-once> <span class="foreground">読者になる</span> <span class="background">読者になる</span> </span> </a> <div class="subscription-count-box js-subscription-count-box"> <i></i> <u></u> <span class="subscription-count js-subscription-count"> </span> </div> </div> </div> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> <script src="https://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script> <script type="text/javascript" src="https://cdn.blog.st-hatena.com/js/external/jquery.min.js?v=1.12.4&version=1ca111bc9f0112690b12e1842a1ce8"></script> <script src="https://cdn.blog.st-hatena.com/js/texts-ja.js?version=1ca111bc9f0112690b12e1842a1ce8"></script> <script id="vendors-js" data-env="production" src="https://cdn.blog.st-hatena.com/js/vendors.js?version=1ca111bc9f0112690b12e1842a1ce8" crossorigin="anonymous"></script> <script id="hatenablog-js" data-env="production" src="https://cdn.blog.st-hatena.com/js/hatenablog.js?version=1ca111bc9f0112690b12e1842a1ce8" crossorigin="anonymous" data-page-id="entry"></script> <script>Hatena.Diary.GlobalHeader.init()</script> </body> </html>

CINXE.COM

JavaScript大規模開発を語りに行ってきた「KOF2015」参加レポート - Cybozu Inside Out | サイボウズエンジニアのブログ