|
46
|
1 <!DOCTYPE html><html lang="ja-JP"><head><title>コンテナ技術を用いた教育情報システムの構築</title><meta property="og:title" content="コンテナ技術を用いた教育情報システムの構築"><meta charset="UTF-8"><meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0"><meta name="apple-mobile-web-app-capable" content="yes"><meta http-equiv="X-UA-Compatible" content="ie=edge"><meta property="og:type" content="website"><meta name="twitter:card" content="summary"><style>.bespoke-marp-note,.bespoke-marp-osc,.bespoke-progress-parent{display:none;transition:none}@media screen{body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:0;color:inherit;cursor:pointer;font-size:inherit;opacity:.8;outline:none;padding:0;transition:opacity .2s linear;-webkit-tap-highlight-color:transparent}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button:disabled,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button:disabled,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button:disabled{cursor:not-allowed;opacity:.15!important}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button:hover,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button:hover,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button:hover{opacity:1}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button:hover:active,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button:hover:active,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button:hover:active{opacity:.6}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button:hover:not(:disabled),body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button:hover:not(:disabled),body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button:hover:not(:disabled){transition:none}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=prev],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=prev],body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button.bespoke-marp-presenter-info-page-prev{background:transparent url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSI1IiBkPSJNNjggOTBMMjggNTBsNDAtNDAiLz48L3N2Zz4=") no-repeat 50%;background-size:contain;overflow:hidden;text-indent:100%;white-space:nowrap}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=next],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=next],body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button.bespoke-marp-presenter-info-page-next{background:transparent url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSI1IiBkPSJNMzIgOTBsNDAtNDAtNDAtNDAiLz48L3N2Zz4=") no-repeat 50%;background-size:contain;overflow:hidden;text-indent:100%;white-space:nowrap}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=fullscreen],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=fullscreen]{background:transparent url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48ZGVmcz48c3R5bGU+LmF7ZmlsbDpub25lO3N0cm9rZTojZmZmO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2Utd2lkdGg6NXB4fTwvc3R5bGU+PC9kZWZzPjxyZWN0IGNsYXNzPSJhIiB4PSIxMCIgeT0iMjAiIHdpZHRoPSI4MCIgaGVpZ2h0PSI2MCIgcng9IjUuNjciLz48cGF0aCBjbGFzcz0iYSIgZD0iTTQwIDcwSDIwVjUwbTIwIDBMMjAgNzBtNDAtNDBoMjB2MjBtLTIwIDBsMjAtMjAiLz48L3N2Zz4=") no-repeat 50%;background-size:contain;overflow:hidden;text-indent:100%;white-space:nowrap}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button.exit[data-bespoke-marp-osc=fullscreen],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button.exit[data-bespoke-marp-osc=fullscreen]{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48ZGVmcz48c3R5bGU+LmF7ZmlsbDpub25lO3N0cm9rZTojZmZmO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2Utd2lkdGg6NXB4fTwvc3R5bGU+PC9kZWZzPjxyZWN0IGNsYXNzPSJhIiB4PSIxMCIgeT0iMjAiIHdpZHRoPSI4MCIgaGVpZ2h0PSI2MCIgcng9IjUuNjciLz48cGF0aCBjbGFzcz0iYSIgZD0iTTIwIDUwaDIwdjIwbS0yMCAwbDIwLTIwbTQwIDBINjBWMzBtMjAgMEw2MCA1MCIvPjwvc3ZnPg==")}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=presenter],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=presenter]{background:transparent url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48ZGVmcz48c3R5bGU+LmF7ZmlsbDpub25lO3N0cm9rZTojZmZmO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS13aWR0aDo1cHh9PC9zdHlsZT48L2RlZnM+PHBhdGggY2xhc3M9ImEiIGQ9Ik0yMCA2MGgtNWE1IDUgMCAwMS01LTVWMjBhNSA1IDAgMDE1LTVoNjBhNSA1IDAgMDE1IDV2NU0zMCA4NWg2MCIvPjxyZWN0IHg9IjMwIiB5PSIzNSIgd2lkdGg9IjYwIiBoZWlnaHQ9IjQwIiByeD0iNSIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZmZmIi8+PHJlY3QgY2xhc3M9ImEiIHg9IjMwIiB5PSIzNSIgd2lkdGg9IjYwIiBoZWlnaHQ9IjQwIiByeD0iNSIvPjxwYXRoIGNsYXNzPSJhIiBkPSJNNDAgNTBoNDBNNDAgNjBoMzAiLz48L3N2Zz4=") no-repeat 50%;background-size:contain;overflow:hidden;text-indent:100%;white-space:nowrap}body,html{height:100%;margin:0}body{background:#000;overflow:hidden}svg.bespoke-marp-slide{content-visibility:hidden;z-index:-1;pointer-events:none;opacity:0}svg.bespoke-marp-slide.bespoke-marp-active{content-visibility:visible;z-index:0;pointer-events:auto;opacity:1}svg.bespoke-marp-slide.bespoke-marp-active.bespoke-marp-active-ready *{-webkit-animation-name:__bespoke_marp__!important;animation-name:__bespoke_marp__!important}@supports not (content-visibility:hidden){svg.bespoke-marp-slide[data-bespoke-marp-load=hideable]{display:none}svg.bespoke-marp-slide[data-bespoke-marp-load=hideable].bespoke-marp-active{display:block}}[data-bespoke-marp-fragment=inactive]{visibility:hidden}body[data-bespoke-view=""] .bespoke-marp-parent,body[data-bespoke-view=next] .bespoke-marp-parent{bottom:0;left:0;position:absolute;right:0;top:0}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc{background:rgba(0,0,0,.65);border-radius:7px;bottom:50px;color:#fff;display:block;font-family:Helvetica,Arial,sans-serif;font-size:16px;left:50%;line-height:0;opacity:1;padding:12px;position:absolute;touch-action:manipulation;transform:translateX(-50%);transition:opacity .2s linear;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap;z-index:1;will-change:transform}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>*,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>*{margin-left:6px}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>:first-child,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>:first-child{margin-left:0}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>span,body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>span{opacity:.8}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>span[data-bespoke-marp-osc=page],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>span[data-bespoke-marp-osc=page]{display:inline-block;min-width:140px;text-align:center}body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=fullscreen],body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=next],body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=presenter],body[data-bespoke-view=""] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=prev],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=fullscreen],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=next],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=presenter],body[data-bespoke-view=next] .bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=prev]{height:32px;line-height:32px;width:32px}body[data-bespoke-view=""] .bespoke-marp-parent.bespoke-marp-inactive,body[data-bespoke-view=next] .bespoke-marp-parent.bespoke-marp-inactive{cursor:none}body[data-bespoke-view=""] .bespoke-marp-parent.bespoke-marp-inactive>.bespoke-marp-osc,body[data-bespoke-view=next] .bespoke-marp-parent.bespoke-marp-inactive>.bespoke-marp-osc{opacity:0;pointer-events:none}body[data-bespoke-view=""] svg.bespoke-marp-slide,body[data-bespoke-view=next] svg.bespoke-marp-slide{height:100%;left:0;position:absolute;top:0;width:100%}body[data-bespoke-view=""] .bespoke-progress-parent{background:#222;display:flex;height:5px;width:100%}body[data-bespoke-view=""] .bespoke-progress-parent+.bespoke-marp-parent{top:5px}body[data-bespoke-view=""] .bespoke-progress-parent .bespoke-progress-bar{flex:0 0 0;background:#0288d1;transition:flex-basis .2s cubic-bezier(0,1,1,1)}body[data-bespoke-view=next]{background:transparent}body[data-bespoke-view=presenter]{background:#161616}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container{font-family:Helvetica,Arial,sans-serif;height:100%;left:0;position:absolute;top:0;width:100%;display:grid;grid-template-columns:2fr 1fr;grid-template-rows:minmax(140px,1fr) 2fr 3em;grid-template-areas:"current next" "current note" "info note"}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-parent{grid-area:current;position:relative;overflow:hidden}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-parent svg.bespoke-marp-slide{height:calc(100% - 40px);left:20px;position:absolute;pointer-events:none;top:20px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:calc(100% - 40px)}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-parent svg.bespoke-marp-slide.bespoke-marp-active{filter:drop-shadow(0 3px 10px rgba(0,0,0,.5))}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-next-container{background:#222;cursor:pointer;display:none;grid-area:next;overflow:hidden;position:relative}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-next-container.active{display:block}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-next-container iframe.bespoke-marp-presenter-next{background:transparent;border:0;display:block;filter:drop-shadow(0 3px 10px rgba(0,0,0,.5));height:calc(100% - 40px);left:20px;position:absolute;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;top:20px;width:calc(100% - 40px)}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container{background:#222;color:#eee;grid-area:note}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container .bespoke-marp-note{margin:20px;width:calc(100% - 40px);height:calc(100% - 40px);box-sizing:border-box;font-size:1.1em;overflow:auto;padding-right:3px;white-space:pre-wrap;word-wrap:break-word;scrollbar-width:thin;scrollbar-color:hsla(0,0%,93.3%,.5) transparent}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container .bespoke-marp-note::-webkit-scrollbar{width:6px}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container .bespoke-marp-note::-webkit-scrollbar-track{background:transparent}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container .bespoke-marp-note::-webkit-scrollbar-thumb{background:hsla(0,0%,93.3%,.5);border-radius:6px}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container .bespoke-marp-note:empty{pointer-events:none}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container .bespoke-marp-note.active{display:block}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container .bespoke-marp-note p:first-child{margin-top:0}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-note-container .bespoke-marp-note p:last-child{margin-bottom:0}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container{align-items:center;box-sizing:border-box;color:#eee;display:flex;flex-wrap:nowrap;grid-area:info;justify-content:center;padding:0 10px}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container .bespoke-marp-presenter-info-page,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container .bespoke-marp-presenter-info-time,body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container .bespoke-marp-presenter-info-timer{display:block;box-sizing:border-box;padding:0 10px;white-space:nowrap;width:100%}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container button{height:1.5em;line-height:1.5em;width:1.5em}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container .bespoke-marp-presenter-info-page{order:2;text-align:center}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container .bespoke-marp-presenter-info-page .bespoke-marp-presenter-info-page-text{display:inline-block;min-width:120px;text-align:center}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container .bespoke-marp-presenter-info-time{color:#999;order:1;text-align:left}body[data-bespoke-view=presenter] .bespoke-marp-presenter-container .bespoke-marp-presenter-info-container .bespoke-marp-presenter-info-timer{color:#999;order:3;text-align:right}}@media print{.bespoke-marp-presenter-info-container,.bespoke-marp-presenter-next-container,.bespoke-marp-presenter-note-container{display:none}}</style><style>div#p>svg>foreignObject>section{width:1280px;height:720px;box-sizing:border-box;overflow:hidden;position:relative;scroll-snap-align:center center}div#p>svg>foreignObject>section:after{bottom:0;content:attr(data-marpit-pagination);padding:inherit;pointer-events:none;position:absolute;right:0}div#p>svg>foreignObject>section:not([data-marpit-pagination]):after{display:none}/* Normalization */div#p>svg>foreignObject>section h1{font-size:2em;margin:0.67em 0}div#p>svg>foreignObject>section video::-webkit-media-controls{will-change:transform}@page{size:1280px 720px;margin:0}@media print{body,html{background-color:#fff;margin:0;page-break-inside:avoid;break-inside:avoid-page}div#p>svg>foreignObject>section{page-break-before:always;break-before:page}div#p>svg>foreignObject>section,div#p>svg>foreignObject>section *{-webkit-print-color-adjust:exact!important;animation-delay:0s!important;animation-duration:0s!important;color-adjust:exact!important;transition:none!important}div#p>svg[data-marpit-svg]{display:block;height:100vh;width:100vw}}div#p>svg>foreignObject>section svg[data-marp-fitting=svg]{display:block;height:auto;width:100%}@supports (-ms-ime-align:auto){div#p>svg>foreignObject>section svg[data-marp-fitting=svg]{position:static}}div#p>svg>foreignObject>section svg[data-marp-fitting=svg].__reflow__{content:""}@supports (-ms-ime-align:auto){div#p>svg>foreignObject>section svg[data-marp-fitting=svg].__reflow__{position:relative}}div#p>svg>foreignObject>section [data-marp-fitting-svg-content]{display:table;white-space:nowrap}div#p>svg>foreignObject>section [data-marp-fitting-svg-content-wrap]{white-space:pre}div#p>svg>foreignObject>section img[data-marp-twemoji]{background:transparent;height:1em;margin:0 .05em 0 .1em;vertical-align:-.1em;width:1em}
|
|
|
2 /*!
|
|
|
3 * Marp default theme.
|
|
|
4 *
|
|
|
5 * @theme default
|
|
|
6 * @author Yuki Hattori
|
|
|
7 *
|
|
|
8 * @auto-scaling true
|
|
|
9 * @size 4:3 960px 720px
|
|
|
10 */div#p>svg>foreignObject>section .octicon{display:inline-block;fill:currentColor;vertical-align:text-bottom}div#p>svg>foreignObject>section .anchor{float:left;line-height:1;margin-left:-20px;padding-right:4px}div#p>svg>foreignObject>section .anchor:focus{outline:none}div#p>svg>foreignObject>section h1 .octicon-link,div#p>svg>foreignObject>section h2 .octicon-link,div#p>svg>foreignObject>section h3 .octicon-link,div#p>svg>foreignObject>section h4 .octicon-link,div#p>svg>foreignObject>section h5 .octicon-link,div#p>svg>foreignObject>section h6 .octicon-link{color:#1b1f23;vertical-align:middle;visibility:hidden}div#p>svg>foreignObject>section h1:hover .anchor,div#p>svg>foreignObject>section h2:hover .anchor,div#p>svg>foreignObject>section h3:hover .anchor,div#p>svg>foreignObject>section h4:hover .anchor,div#p>svg>foreignObject>section h5:hover .anchor,div#p>svg>foreignObject>section h6:hover .anchor{text-decoration:none}div#p>svg>foreignObject>section h1:hover .anchor .octicon-link,div#p>svg>foreignObject>section h2:hover .anchor .octicon-link,div#p>svg>foreignObject>section h3:hover .anchor .octicon-link,div#p>svg>foreignObject>section h4:hover .anchor .octicon-link,div#p>svg>foreignObject>section h5:hover .anchor .octicon-link,div#p>svg>foreignObject>section h6:hover .anchor .octicon-link{visibility:visible}div#p>svg>foreignObject>section h1:hover .anchor .octicon-link:before,div#p>svg>foreignObject>section h2:hover .anchor .octicon-link:before,div#p>svg>foreignObject>section h3:hover .anchor .octicon-link:before,div#p>svg>foreignObject>section h4:hover .anchor .octicon-link:before,div#p>svg>foreignObject>section h5:hover .anchor .octicon-link:before,div#p>svg>foreignObject>section h6:hover .anchor .octicon-link:before{width:16px;height:16px;content:" ";display:inline-block;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' aria-hidden='true'%3E%3Cpath fill-rule='evenodd' d='M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z'/%3E%3C/svg%3E")}div#p>svg>foreignObject>section{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;color:#24292e;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji;font-size:16px;line-height:1.5;word-wrap:break-word}div#p>svg>foreignObject>section{--marpit-root-font-size:16px}div#p>svg>foreignObject>section details{display:block}div#p>svg>foreignObject>section summary{display:list-item}div#p>svg>foreignObject>section a{background-color:initial}div#p>svg>foreignObject>section a:active,div#p>svg>foreignObject>section a:hover{outline-width:0}div#p>svg>foreignObject>section strong{font-weight:inherit;font-weight:bolder}div#p>svg>foreignObject>section h1{margin:.67em 0}div#p>svg>foreignObject>section img{border-style:none}div#p>svg>foreignObject>section code,div#p>svg>foreignObject>section kbd,div#p>svg>foreignObject>section pre{font-family:monospace,monospace;font-size:1em}div#p>svg>foreignObject>section hr{box-sizing:initial;overflow:visible}div#p>svg>foreignObject>section input{font:inherit;margin:0;overflow:visible}div#p>svg>foreignObject>section [type=checkbox]{padding:0}div#p>svg>foreignObject>section *,div#p>svg>foreignObject>section [type=checkbox]{box-sizing:border-box}div#p>svg>foreignObject>section input{font-family:inherit;font-size:inherit;line-height:inherit}div#p>svg>foreignObject>section a{color:#0366d6;text-decoration:none}div#p>svg>foreignObject>section a:hover{text-decoration:underline}div#p>svg>foreignObject>section strong{font-weight:600}div#p>svg>foreignObject>section hr{height:0;margin:15px 0;overflow:hidden;background:transparent;border-bottom:1px solid #dfe2e5}div#p>svg>foreignObject>section hr:after,div#p>svg>foreignObject>section hr:before{display:table;content:""}div#p>svg>foreignObject>section hr:after{clear:both}div#p>svg>foreignObject>section table{border-spacing:0;border-collapse:collapse}div#p>svg>foreignObject>section td,div#p>svg>foreignObject>section th{padding:0}div#p>svg>foreignObject>section details summary{cursor:pointer}div#p>svg>foreignObject>section h1,div#p>svg>foreignObject>section h2,div#p>svg>foreignObject>section h3,div#p>svg>foreignObject>section h4,div#p>svg>foreignObject>section h5,div#p>svg>foreignObject>section h6{margin-top:0;margin-bottom:0}div#p>svg>foreignObject>section h1{font-size:32px}div#p>svg>foreignObject>section h1,div#p>svg>foreignObject>section h2{font-weight:600}div#p>svg>foreignObject>section h2{font-size:24px}div#p>svg>foreignObject>section h3{font-size:20px}div#p>svg>foreignObject>section h3,div#p>svg>foreignObject>section h4{font-weight:600}div#p>svg>foreignObject>section h4{font-size:16px}div#p>svg>foreignObject>section h5{font-size:14px}div#p>svg>foreignObject>section h5,div#p>svg>foreignObject>section h6{font-weight:600}div#p>svg>foreignObject>section h6{font-size:12px}div#p>svg>foreignObject>section p{margin-top:0;margin-bottom:10px}div#p>svg>foreignObject>section blockquote{margin:0}div#p>svg>foreignObject>section ol,div#p>svg>foreignObject>section ul{padding-left:0;margin-top:0;margin-bottom:0}div#p>svg>foreignObject>section ol ol,div#p>svg>foreignObject>section ul ol{list-style-type:lower-roman}div#p>svg>foreignObject>section ol ol ol,div#p>svg>foreignObject>section ol ul ol,div#p>svg>foreignObject>section ul ol ol,div#p>svg>foreignObject>section ul ul ol{list-style-type:lower-alpha}div#p>svg>foreignObject>section dd{margin-left:0}div#p>svg>foreignObject>section code,div#p>svg>foreignObject>section pre{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:12px}div#p>svg>foreignObject>section pre{margin-top:0;margin-bottom:0}div#p>svg>foreignObject>section input::-webkit-inner-spin-button,div#p>svg>foreignObject>section input::-webkit-outer-spin-button{margin:0;-webkit-appearance:none;appearance:none}div#p>svg>foreignObject>section :checked+.radio-label{position:relative;z-index:1;border-color:#0366d6}div#p>svg>foreignObject>section .border{border:1px solid #e1e4e8!important}div#p>svg>foreignObject>section .border-0{border:0!important}div#p>svg>foreignObject>section .border-bottom{border-bottom:1px solid #e1e4e8!important}div#p>svg>foreignObject>section .rounded-1{border-radius:3px!important}div#p>svg>foreignObject>section .bg-white{background-color:#fff!important}div#p>svg>foreignObject>section .bg-gray-light{background-color:#fafbfc!important}div#p>svg>foreignObject>section .text-gray-light{color:#6a737d!important}div#p>svg>foreignObject>section .pl-3,div#p>svg>foreignObject>section .px-3{padding-left:16px!important}div#p>svg>foreignObject>section .px-3{padding-right:16px!important}div#p>svg>foreignObject>section .f6{font-size:12px!important}div#p>svg>foreignObject>section div#p>svg>foreignObject>section section.f6{--marpit-root-font-size:12px!important}div#p>svg>foreignObject>section .lh-condensed{line-height:1.25!important}div#p>svg>foreignObject>section .text-bold{font-weight:600!important}div#p>svg>foreignObject>section .pl-c{color:#6a737d}div#p>svg>foreignObject>section .pl-c1,div#p>svg>foreignObject>section .pl-s .pl-v{color:#005cc5}div#p>svg>foreignObject>section .pl-e,div#p>svg>foreignObject>section .pl-en{color:#6f42c1}div#p>svg>foreignObject>section .pl-s .pl-s1,div#p>svg>foreignObject>section .pl-smi{color:#24292e}div#p>svg>foreignObject>section .pl-ent{color:#22863a}div#p>svg>foreignObject>section .pl-k{color:#d73a49}div#p>svg>foreignObject>section .pl-pds,div#p>svg>foreignObject>section .pl-s,div#p>svg>foreignObject>section .pl-s .pl-pse .pl-s1,div#p>svg>foreignObject>section .pl-sr,div#p>svg>foreignObject>section .pl-sr .pl-cce,div#p>svg>foreignObject>section .pl-sr .pl-sra,div#p>svg>foreignObject>section .pl-sr .pl-sre{color:#032f62}div#p>svg>foreignObject>section .pl-smw,div#p>svg>foreignObject>section .pl-v{color:#e36209}div#p>svg>foreignObject>section .pl-bu{color:#b31d28}div#p>svg>foreignObject>section .pl-ii{color:#fafbfc;background-color:#b31d28}div#p>svg>foreignObject>section .pl-c2{color:#fafbfc;background-color:#d73a49}div#p>svg>foreignObject>section .pl-c2:before{content:"^M"}div#p>svg>foreignObject>section .pl-sr .pl-cce{font-weight:700;color:#22863a}div#p>svg>foreignObject>section .pl-ml{color:#735c0f}div#p>svg>foreignObject>section .pl-mh,div#p>svg>foreignObject>section .pl-mh .pl-en,div#p>svg>foreignObject>section .pl-ms{font-weight:700;color:#005cc5}div#p>svg>foreignObject>section .pl-mi{font-style:italic;color:#24292e}div#p>svg>foreignObject>section .pl-mb{font-weight:700;color:#24292e}div#p>svg>foreignObject>section .pl-md{color:#b31d28;background-color:#ffeef0}div#p>svg>foreignObject>section .pl-mi1{color:#22863a;background-color:#f0fff4}div#p>svg>foreignObject>section .pl-mc{color:#e36209;background-color:#ffebda}div#p>svg>foreignObject>section .pl-mi2{color:#f6f8fa;background-color:#005cc5}div#p>svg>foreignObject>section .pl-mdr{font-weight:700;color:#6f42c1}div#p>svg>foreignObject>section .pl-ba{color:#586069}div#p>svg>foreignObject>section .pl-sg{color:#959da5}div#p>svg>foreignObject>section .pl-corl{text-decoration:underline;color:#032f62}div#p>svg>foreignObject>section .mb-0{margin-bottom:0!important}div#p>svg>foreignObject>section .my-2{margin-bottom:8px!important;margin-top:8px!important}div#p>svg>foreignObject>section .pl-0{padding-left:0!important}div#p>svg>foreignObject>section .py-0{padding-top:0!important;padding-bottom:0!important}div#p>svg>foreignObject>section .pl-1{padding-left:4px!important}div#p>svg>foreignObject>section .pl-2{padding-left:8px!important}div#p>svg>foreignObject>section .py-2{padding-top:8px!important;padding-bottom:8px!important}div#p>svg>foreignObject>section .pl-3{padding-left:16px!important}div#p>svg>foreignObject>section .pl-4{padding-left:24px!important}div#p>svg>foreignObject>section .pl-5{padding-left:32px!important}div#p>svg>foreignObject>section .pl-6{padding-left:40px!important}div#p>svg>foreignObject>section .pl-7{padding-left:48px!important}div#p>svg>foreignObject>section .pl-8{padding-left:64px!important}div#p>svg>foreignObject>section .pl-9{padding-left:80px!important}div#p>svg>foreignObject>section .pl-10{padding-left:96px!important}div#p>svg>foreignObject>section .pl-11{padding-left:112px!important}div#p>svg>foreignObject>section .pl-12{padding-left:128px!important}div#p>svg>foreignObject>section hr{border-bottom-color:#eee}div#p>svg>foreignObject>section kbd{display:inline-block;padding:3px 5px;font:11px SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;line-height:10px;color:#444d56;vertical-align:middle;background-color:#fafbfc;border:1px solid #d1d5da;border-radius:3px;box-shadow:inset 0 -1px 0 #d1d5da}div#p>svg>foreignObject>section:after,div#p>svg>foreignObject>section:before{display:table
|
|
|
11 /* content:""; */}div#p>svg>foreignObject>section:after{clear:both}div#p>svg>foreignObject>section>:first-child{margin-top:0!important}div#p>svg>foreignObject>section>:last-child{margin-bottom:0!important}div#p>svg>foreignObject>section a:not([href]){color:inherit;text-decoration:none}div#p>svg>foreignObject>section blockquote,div#p>svg>foreignObject>section details,div#p>svg>foreignObject>section dl,div#p>svg>foreignObject>section ol,div#p>svg>foreignObject>section p,div#p>svg>foreignObject>section pre,div#p>svg>foreignObject>section table,div#p>svg>foreignObject>section ul{margin-top:0;margin-bottom:16px}div#p>svg>foreignObject>section hr{height:.25em;padding:0;margin:24px 0;background-color:#e1e4e8;border:0}div#p>svg>foreignObject>section blockquote{padding:0 1em;color:#6a737d;border-left:.25em solid #dfe2e5}div#p>svg>foreignObject>section blockquote>:first-child{margin-top:0}div#p>svg>foreignObject>section blockquote>:last-child{margin-bottom:0}div#p>svg>foreignObject>section h1,div#p>svg>foreignObject>section h2,div#p>svg>foreignObject>section h3,div#p>svg>foreignObject>section h4,div#p>svg>foreignObject>section h5,div#p>svg>foreignObject>section h6{margin-top:24px;margin-bottom:16px;font-weight:600;line-height:1.25}div#p>svg>foreignObject>section h1{font-size:2em}div#p>svg>foreignObject>section h1,div#p>svg>foreignObject>section h2{padding-bottom:.3em;border-bottom:1px solid #eaecef}div#p>svg>foreignObject>section h2{font-size:1.5em}div#p>svg>foreignObject>section h3{font-size:1.25em}div#p>svg>foreignObject>section h4{font-size:1em}div#p>svg>foreignObject>section h5{font-size:.875em}div#p>svg>foreignObject>section h6{font-size:.85em;color:#6a737d}div#p>svg>foreignObject>section ol,div#p>svg>foreignObject>section ul{padding-left:2em}div#p>svg>foreignObject>section ol ol,div#p>svg>foreignObject>section ol ul,div#p>svg>foreignObject>section ul ol,div#p>svg>foreignObject>section ul ul{margin-top:0;margin-bottom:0}div#p>svg>foreignObject>section li{word-wrap:break-all}div#p>svg>foreignObject>section li>p{margin-top:16px}div#p>svg>foreignObject>section li+li{margin-top:.25em}div#p>svg>foreignObject>section dl{padding:0}div#p>svg>foreignObject>section dl dt{padding:0;margin-top:16px;font-size:1em;font-style:italic;font-weight:600}div#p>svg>foreignObject>section dl dd{padding:0 16px;margin-bottom:16px}div#p>svg>foreignObject>section table{display:block;width:100%;overflow:auto}div#p>svg>foreignObject>section table th{font-weight:600}div#p>svg>foreignObject>section table td,div#p>svg>foreignObject>section table th{padding:6px 13px;border:1px solid #dfe2e5}div#p>svg>foreignObject>section table tr{background-color:#fff;border-top:1px solid #c6cbd1}div#p>svg>foreignObject>section table tr:nth-child(2n){background-color:#f6f8fa}div#p>svg>foreignObject>section img{max-width:100%;box-sizing:initial;background-color:#fff}div#p>svg>foreignObject>section img[align=right]{padding-left:20px}div#p>svg>foreignObject>section img[align=left]{padding-right:20px}div#p>svg>foreignObject>section code{padding:.2em .4em;margin:0;font-size:85%;background-color:rgba(27,31,35,.05);border-radius:3px}div#p>svg>foreignObject>section pre{word-wrap:normal}div#p>svg>foreignObject>section pre>code{padding:0;margin:0;font-size:100%;word-break:normal;white-space:pre;background:transparent;border:0}div#p>svg>foreignObject>section .highlight{margin-bottom:16px}div#p>svg>foreignObject>section .highlight pre{margin-bottom:0;word-break:normal}div#p>svg>foreignObject>section pre{padding:16px;overflow:auto;font-size:85%;line-height:1.45;background-color:#f6f8fa;border-radius:3px}div#p>svg>foreignObject>section pre code{display:inline;max-width:auto;padding:0;margin:0;overflow:visible;line-height:inherit;word-wrap:normal;background-color:initial;border:0}div#p>svg>foreignObject>section .commit-tease-sha{display:inline-block;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:90%;color:#444d56}div#p>svg>foreignObject>section div#p>svg>foreignObject>section section.commit-tease-sha{--marpit-root-font-size:90%}div#p>svg>foreignObject>section .full-commit .btn-outline:not(:disabled):hover{color:#005cc5;border-color:#005cc5}div#p>svg>foreignObject>section .blob-wrapper{overflow-x:auto;overflow-y:hidden}div#p>svg>foreignObject>section .blob-wrapper-embedded{max-height:240px;overflow-y:auto}div#p>svg>foreignObject>section .blob-num{width:1%;min-width:50px;padding-right:10px;padding-left:10px;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:12px;line-height:20px;color:rgba(27,31,35,.3);text-align:right;white-space:nowrap;vertical-align:top;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}div#p>svg>foreignObject>section div#p>svg>foreignObject>section section.blob-num{--marpit-root-font-size:12px}div#p>svg>foreignObject>section .blob-num:hover{color:rgba(27,31,35,.6)}div#p>svg>foreignObject>section .blob-num:before{content:attr(data-line-number)}div#p>svg>foreignObject>section .blob-code{position:relative;padding-right:10px;padding-left:10px;line-height:20px;vertical-align:top}div#p>svg>foreignObject>section .blob-code-inner{overflow:visible;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:12px;color:#24292e;word-wrap:normal;white-space:pre}div#p>svg>foreignObject>section div#p>svg>foreignObject>section section.blob-code-inner{--marpit-root-font-size:12px}div#p>svg>foreignObject>section .pl-token.active,div#p>svg>foreignObject>section .pl-token:hover{cursor:pointer;background:#ffea7f}div#p>svg>foreignObject>section .tab-size[data-tab-size="1"]{-moz-tab-size:1;-o-tab-size:1;tab-size:1}div#p>svg>foreignObject>section .tab-size[data-tab-size="2"]{-moz-tab-size:2;-o-tab-size:2;tab-size:2}div#p>svg>foreignObject>section .tab-size[data-tab-size="3"]{-moz-tab-size:3;-o-tab-size:3;tab-size:3}div#p>svg>foreignObject>section .tab-size[data-tab-size="4"]{-moz-tab-size:4;-o-tab-size:4;tab-size:4}div#p>svg>foreignObject>section .tab-size[data-tab-size="5"]{-moz-tab-size:5;-o-tab-size:5;tab-size:5}div#p>svg>foreignObject>section .tab-size[data-tab-size="6"]{-moz-tab-size:6;-o-tab-size:6;tab-size:6}div#p>svg>foreignObject>section .tab-size[data-tab-size="7"]{-moz-tab-size:7;-o-tab-size:7;tab-size:7}div#p>svg>foreignObject>section .tab-size[data-tab-size="8"]{-moz-tab-size:8;-o-tab-size:8;tab-size:8}div#p>svg>foreignObject>section .tab-size[data-tab-size="9"]{-moz-tab-size:9;-o-tab-size:9;tab-size:9}div#p>svg>foreignObject>section .tab-size[data-tab-size="10"]{-moz-tab-size:10;-o-tab-size:10;tab-size:10}div#p>svg>foreignObject>section .tab-size[data-tab-size="11"]{-moz-tab-size:11;-o-tab-size:11;tab-size:11}div#p>svg>foreignObject>section .tab-size[data-tab-size="12"]{-moz-tab-size:12;-o-tab-size:12;tab-size:12}div#p>svg>foreignObject>section .task-list-item{list-style-type:none}div#p>svg>foreignObject>section .task-list-item+.task-list-item{margin-top:3px}div#p>svg>foreignObject>section .task-list-item input{margin:0 .2em .25em -1.6em;vertical-align:middle}div#p>svg>foreignObject>section .hljs{display:block;background:#fff;padding:.5em;color:#333;overflow-x:auto}div#p>svg>foreignObject>section .hljs-comment,div#p>svg>foreignObject>section .hljs-meta{color:#969896}div#p>svg>foreignObject>section .hljs-emphasis,div#p>svg>foreignObject>section .hljs-quote,div#p>svg>foreignObject>section .hljs-strong,div#p>svg>foreignObject>section .hljs-template-variable,div#p>svg>foreignObject>section .hljs-variable{color:#df5000}div#p>svg>foreignObject>section .hljs-keyword,div#p>svg>foreignObject>section .hljs-selector-tag,div#p>svg>foreignObject>section .hljs-type{color:#d73a49}div#p>svg>foreignObject>section .hljs-attribute,div#p>svg>foreignObject>section .hljs-bullet,div#p>svg>foreignObject>section .hljs-literal,div#p>svg>foreignObject>section .hljs-symbol{color:#0086b3}div#p>svg>foreignObject>section .hljs-name,div#p>svg>foreignObject>section .hljs-section{color:#63a35c}div#p>svg>foreignObject>section .hljs-tag{color:#333}div#p>svg>foreignObject>section .hljs-attr,div#p>svg>foreignObject>section .hljs-selector-attr,div#p>svg>foreignObject>section .hljs-selector-class,div#p>svg>foreignObject>section .hljs-selector-id,div#p>svg>foreignObject>section .hljs-selector-pseudo,div#p>svg>foreignObject>section .hljs-title{color:#6f42c1}div#p>svg>foreignObject>section .hljs-addition{color:#55a532;background-color:#eaffea}div#p>svg>foreignObject>section .hljs-deletion{color:#bd2c00;background-color:#ffecec}div#p>svg>foreignObject>section .hljs-link{text-decoration:underline}div#p>svg>foreignObject>section .hljs-number{color:#005cc5}div#p>svg>foreignObject>section .hljs-string{color:#032f62}div#p>svg>foreignObject>section svg[data-marp-fitting=svg]{max-height:563px}div#p>svg>foreignObject>section h1{color:#246;font-size:1.6em}div#p>svg>foreignObject>section h1,div#p>svg>foreignObject>section h2{border-bottom:none}div#p>svg>foreignObject>section h2{font-size:1.3em}div#p>svg>foreignObject>section h3{font-size:1.1em}div#p>svg>foreignObject>section h4{font-size:1.05em}div#p>svg>foreignObject>section h5{font-size:1em}div#p>svg>foreignObject>section h6{font-size:.9em}div#p>svg>foreignObject>section h1 strong,div#p>svg>foreignObject>section h2 strong,div#p>svg>foreignObject>section h3 strong,div#p>svg>foreignObject>section h4 strong,div#p>svg>foreignObject>section h5 strong,div#p>svg>foreignObject>section h6 strong{font-weight:inherit;color:#48c}div#p>svg>foreignObject>section hr{height:0;padding-top:.25em}div#p>svg>foreignObject>section pre{border:1px solid #999;line-height:1.15;overflow:visible}div#p>svg>foreignObject>section pre code svg[data-marp-fitting=svg]{max-height:529px}div#p>svg>foreignObject>section footer,div#p>svg>foreignObject>section header{margin:0;position:absolute;left:30px;color:hsla(0,0%,40%,.75);font-size:18px}div#p>svg>foreignObject>section header{top:21px}div#p>svg>foreignObject>section footer{bottom:21px}div#p>svg>foreignObject>section{align-items:stretch;background:#fff;display:flex;flex-direction:column;flex-wrap:nowrap;font-size:29px;height:720px;justify-content:center;padding:78.5px;width:1280px}div#p>svg>foreignObject>section{--marpit-root-font-size:29px}div#p>svg>foreignObject>section>:last-child,div#p>svg>foreignObject>section[data-footer]>:nth-last-child(2){margin-bottom:0}div#p>svg>foreignObject>section>:first-child,div#p>svg>foreignObject>section>header:first-child+*{margin-top:0}div#p>svg>foreignObject>section:after{position:absolute;padding:0;right:30px;bottom:21px;font-size:24px;color:#777}div#p>svg>foreignObject>section:after{--marpit-root-font-size:24px}div#p>svg>foreignObject>section.invert{background-color:#222;color:#e6eaf0}div#p>svg>foreignObject>section.invert:after{color:#999}div#p>svg>foreignObject>section.invert img{background-color:transparent}div#p>svg>foreignObject>section.invert a{color:#50b3ff}div#p>svg>foreignObject>section.invert h1{color:#a3c5e7}div#p>svg>foreignObject>section.invert h2,div#p>svg>foreignObject>section.invert h3,div#p>svg>foreignObject>section.invert h4,div#p>svg>foreignObject>section.invert h5{color:#ebeff5}div#p>svg>foreignObject>section.invert blockquote,div#p>svg>foreignObject>section.invert h6{border-color:#3d3f43;color:#939699}div#p>svg>foreignObject>section.invert h1 strong,div#p>svg>foreignObject>section.invert h2 strong,div#p>svg>foreignObject>section.invert h3 strong,div#p>svg>foreignObject>section.invert h4 strong,div#p>svg>foreignObject>section.invert h5 strong,div#p>svg>foreignObject>section.invert h6 strong{color:#7bf}div#p>svg>foreignObject>section.invert hr{background-color:#3d3f43}div#p>svg>foreignObject>section.invert footer,div#p>svg>foreignObject>section.invert header{color:hsla(0,0%,60%,.75)}div#p>svg>foreignObject>section.invert code,div#p>svg>foreignObject>section.invert kbd{background-color:#111}div#p>svg>foreignObject>section.invert kbd{border-color:#666;box-shadow:inset 0 -1px 0 #555;color:#e6eaf0}div#p>svg>foreignObject>section.invert table tr{background-color:#12181d;border-color:#60657b}div#p>svg>foreignObject>section.invert table tr:nth-child(2n){background-color:#1b2024}div#p>svg>foreignObject>section.invert table td,div#p>svg>foreignObject>section.invert table th{border-color:#5b5e61}div#p>svg>foreignObject>section.invert pre{background-color:#0a0e12;border-color:#777}div#p>svg>foreignObject>section.invert pre code{background-color:transparent}div#p>svg>foreignObject>section[data-color] h1,div#p>svg>foreignObject>section[data-color] h2,div#p>svg>foreignObject>section[data-color] h3,div#p>svg>foreignObject>section[data-color] h4,div#p>svg>foreignObject>section[data-color] h5,div#p>svg>foreignObject>section[data-color] h6{color:currentColor}div#p>svg>foreignObject>section{background-color:#FFFFFF;font-size:28px;color:#4b4b4b;font-family:"Arial","Hiragino Maru Gothic ProN"}div#p>svg>foreignObject>section{--marpit-root-font-size:28px}div#p>svg>foreignObject>section.title{font-size:40px;padding:40px}div#p>svg>foreignObject>section.title{--marpit-root-font-size:40px}div#p>svg>foreignObject>section.title h1{text-align:center}div#p>svg>foreignObject>section.slide h1{position:absolute;left:50px;top:35px}div#p>svg>foreignObject>section[data-marpit-advanced-background=background]{display:block!important;padding:0!important}div#p>svg>foreignObject>section[data-marpit-advanced-background=background]:after,div#p>svg>foreignObject>section[data-marpit-advanced-background=background]:before,div#p>svg>foreignObject>section[data-marpit-advanced-background=content]:after,div#p>svg>foreignObject>section[data-marpit-advanced-background=content]:before{display:none!important}div#p>svg>foreignObject>section[data-marpit-advanced-background=background]>div[data-marpit-advanced-background-container]{all:initial;display:flex;flex-direction:row;height:100%;overflow:hidden;width:100%}div#p>svg>foreignObject>section[data-marpit-advanced-background=background]>div[data-marpit-advanced-background-container][data-marpit-advanced-background-direction=vertical]{flex-direction:column}div#p>svg>foreignObject>section[data-marpit-advanced-background=background][data-marpit-advanced-background-split]>div[data-marpit-advanced-background-container]{width:var(--marpit-advanced-background-split,50%)}div#p>svg>foreignObject>section[data-marpit-advanced-background=background][data-marpit-advanced-background-split=right]>div[data-marpit-advanced-background-container]{margin-left:calc(100% - var(--marpit-advanced-background-split, 50%))}div#p>svg>foreignObject>section[data-marpit-advanced-background=background]>div[data-marpit-advanced-background-container]>figure{all:initial;background-position:center;background-repeat:no-repeat;background-size:cover;flex:auto;margin:0}div#p>svg>foreignObject>section[data-marpit-advanced-background=content],div#p>svg>foreignObject>section[data-marpit-advanced-background=pseudo]{background:transparent!important}div#p>svg>foreignObject>section[data-marpit-advanced-background=pseudo],div#p>svg[data-marpit-svg]>foreignObject[data-marpit-advanced-background=pseudo]{pointer-events:none!important}div#p>svg>foreignObject>section[data-marpit-advanced-background-split]{width:100%;height:100%}</style></head><body><div class="bespoke-marp-osc"><button data-bespoke-marp-osc="prev" tabindex="-1" title="Previous slide">Previous slide</button><span data-bespoke-marp-osc="page"></span><button data-bespoke-marp-osc="next" tabindex="-1" title="Next slide">Next slide</button><button data-bespoke-marp-osc="fullscreen" tabindex="-1" title="Toggle fullscreen (f)">Toggle fullscreen</button><button data-bespoke-marp-osc="presenter" tabindex="-1" title="Open presenter view (p)">Open presenter view</button></div><div id="p"><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="1" data-paginate="true" data-class="title" data-theme="default" data-style="section {
|
|
|
12 background-color: #FFFFFF;
|
|
|
13 font-size: 28px;
|
|
|
14 color: #4b4b4b;
|
|
|
15 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
16 }
|
|
|
17
|
|
|
18 section.title {
|
|
|
19 font-size: 40px;
|
|
|
20 padding: 40px;
|
|
|
21 }
|
|
|
22 section.title h1 {
|
|
|
23 text-align: center;
|
|
|
24 }
|
|
|
25
|
|
|
26 section.slide h1 {
|
|
|
27 position: absolute;
|
|
|
28 left: 50px; top: 35px;
|
|
|
29 }
|
|
48
|
30 " class="title" data-marpit-pagination="1" data-marpit-pagination-total="32" style="--paginate:true;--class:title;--theme:default;
|
|
46
|
31 ;">
|
|
|
32 <h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> コンテナ技術を用いた教育情報システムの構築</span></foreignObject></svg></h1>
|
|
|
33 <ul>
|
|
|
34 <li>宮平 賢
|
|
|
35 <ul>
|
|
|
36 <li>琉球大学工学部工学科知能情報コース</li>
|
|
|
37 </ul>
|
|
|
38 </li>
|
|
|
39 <li>河野 真治
|
|
|
40 <ul>
|
|
|
41 <li>琉球大学工学部</li>
|
|
|
42 </ul>
|
|
|
43 </li>
|
|
|
44 </ul>
|
|
|
45 </section>
|
|
|
46 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="2" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
47 background-color: #FFFFFF;
|
|
|
48 font-size: 28px;
|
|
|
49 color: #4b4b4b;
|
|
|
50 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
51 }
|
|
|
52
|
|
|
53 section.title {
|
|
|
54 font-size: 40px;
|
|
|
55 padding: 40px;
|
|
|
56 }
|
|
|
57 section.title h1 {
|
|
|
58 text-align: center;
|
|
|
59 }
|
|
|
60
|
|
|
61 section.slide h1 {
|
|
|
62 position: absolute;
|
|
|
63 left: 50px; top: 35px;
|
|
|
64 }
|
|
48
|
65 " class="slide" data-marpit-pagination="2" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
66 ;">
|
|
|
67 <h1>研究目的</h1>
|
|
|
68 <ul>
|
|
|
69 <li>情報通信技術の普及に伴い学ぶことが増えている</li>
|
|
|
70 <li>その学習環境として、Virtual MachineやContainerがある
|
|
|
71 <ul>
|
|
49
|
72 <li>実行には高性能なPCが必要な場合がある</li>
|
|
|
73 <li>クラウドサービスもあるが、無料だと制限がある</li>
|
|
46
|
74 </ul>
|
|
|
75 </li>
|
|
49
|
76 <li>学生の学習環境として、コストを支払う必要のない環境を提供したい</li>
|
|
|
77 <li>今年度はシステム更新があり、新しくSSDとGPUが搭載される
|
|
|
78 <ul>
|
|
|
79 <li>リソースを最大限利用できる教育情報システムが必要となる</li>
|
|
46
|
80 </ul>
|
|
|
81 </li>
|
|
|
82 </ul>
|
|
|
83 </section>
|
|
47
|
84 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="3" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
46
|
85 background-color: #FFFFFF;
|
|
|
86 font-size: 28px;
|
|
|
87 color: #4b4b4b;
|
|
|
88 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
89 }
|
|
|
90
|
|
|
91 section.title {
|
|
|
92 font-size: 40px;
|
|
|
93 padding: 40px;
|
|
|
94 }
|
|
|
95 section.title h1 {
|
|
|
96 text-align: center;
|
|
|
97 }
|
|
|
98
|
|
|
99 section.slide h1 {
|
|
|
100 position: absolute;
|
|
|
101 left: 50px; top: 35px;
|
|
|
102 }
|
|
48
|
103 " class="slide" data-marpit-pagination="3" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
104 ;">
|
|
47
|
105 <h1>これまでの学生向け学習環境</h1>
|
|
|
106 <ul>
|
|
|
107 <li>
|
|
|
108 <p>VM貸出サービス</p>
|
|
|
109 <ul>
|
|
|
110 <li>Akatsuki
|
|
|
111 <ul>
|
|
|
112 <li>申請を行い、Webコントロールパネルから作成</li>
|
|
|
113 </ul>
|
|
|
114 </li>
|
|
|
115 <li>ie-virsh
|
|
|
116 <ul>
|
|
|
117 <li>手元のPCで作成したVMイメージのデプロイ</li>
|
|
|
118 </ul>
|
|
|
119 </li>
|
|
|
120 </ul>
|
|
|
121 </li>
|
|
|
122 <li>
|
|
|
123 <p>VM貸出サービスのデフォルトスペック</p>
|
|
|
124 <ul>
|
|
|
125 <li>CPU 1コア</li>
|
|
|
126 <li>メモリ 1GB</li>
|
|
|
127 <li>ディスク容量 10GB</li>
|
|
|
128 </ul>
|
|
|
129 </li>
|
|
|
130 </ul>
|
|
46
|
131 </section>
|
|
|
132 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="4" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
133 background-color: #FFFFFF;
|
|
|
134 font-size: 28px;
|
|
|
135 color: #4b4b4b;
|
|
|
136 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
137 }
|
|
|
138
|
|
|
139 section.title {
|
|
|
140 font-size: 40px;
|
|
|
141 padding: 40px;
|
|
|
142 }
|
|
|
143 section.title h1 {
|
|
|
144 text-align: center;
|
|
|
145 }
|
|
|
146
|
|
|
147 section.slide h1 {
|
|
|
148 position: absolute;
|
|
|
149 left: 50px; top: 35px;
|
|
|
150 }
|
|
48
|
151 " class="slide" data-marpit-pagination="4" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
152 ;">
|
|
47
|
153 <h1>これまでの学習環境の問題点</h1>
|
|
|
154 <ul>
|
|
|
155 <li>VM貸出サービスの一部学生は申請の方法が分からなかったり、貸出サービスがあることが周知されていなかったため、旧システムのリソースが余っていた</li>
|
|
|
156 </ul>
|
|
|
157 <br />
|
|
46
|
158 <ul>
|
|
47
|
159 <li>VMのスペックの変更にはシステム管理チームへの申請が必要であり、利用者と管理者とのやり取りなどの手間があった</li>
|
|
|
160 </ul>
|
|
|
161 <br />
|
|
|
162 <ul>
|
|
|
163 <li>旧システムにはGPUが搭載されていないため、貸出サービスではなく研究室ごとの機器、クラウドサービスが多く利用された</li>
|
|
46
|
164 </ul>
|
|
|
165 </section>
|
|
|
166 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="5" data-paginate="true" data-class="title" data-theme="default" data-style="section {
|
|
|
167 background-color: #FFFFFF;
|
|
|
168 font-size: 28px;
|
|
|
169 color: #4b4b4b;
|
|
|
170 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
171 }
|
|
|
172
|
|
|
173 section.title {
|
|
|
174 font-size: 40px;
|
|
|
175 padding: 40px;
|
|
|
176 }
|
|
|
177 section.title h1 {
|
|
|
178 text-align: center;
|
|
|
179 }
|
|
|
180
|
|
|
181 section.slide h1 {
|
|
|
182 position: absolute;
|
|
|
183 left: 50px; top: 35px;
|
|
|
184 }
|
|
48
|
185 " class="title" data-marpit-pagination="5" data-marpit-pagination-total="32" style="--paginate:true;--class:title;--theme:default;
|
|
46
|
186 ;">
|
|
|
187 <h1>教育情報システムの構築</h1>
|
|
|
188 </section>
|
|
|
189 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="6" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
190 background-color: #FFFFFF;
|
|
|
191 font-size: 28px;
|
|
|
192 color: #4b4b4b;
|
|
|
193 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
194 }
|
|
|
195
|
|
|
196 section.title {
|
|
|
197 font-size: 40px;
|
|
|
198 padding: 40px;
|
|
|
199 }
|
|
|
200 section.title h1 {
|
|
|
201 text-align: center;
|
|
|
202 }
|
|
|
203
|
|
|
204 section.slide h1 {
|
|
|
205 position: absolute;
|
|
|
206 left: 50px; top: 35px;
|
|
|
207 }
|
|
48
|
208 " class="slide" data-marpit-pagination="6" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
209 ;">
|
|
49
|
210 <h1>教育情報システムの要件</h1>
|
|
46
|
211 <ul>
|
|
49
|
212 <li>マルチユーザに対応
|
|
|
213 <ul>
|
|
|
214 <li>本コースの学生、教員に対応する必要がある</li>
|
|
46
|
215 </ul>
|
|
49
|
216 </li>
|
|
|
217 <li>学生がサーバのリソースを利用できる環境</li>
|
|
|
218 <li>手間が少なく利用できる環境</li>
|
|
|
219 <li>信頼性の高いファイルシステム</li>
|
|
|
220 </ul>
|
|
46
|
221 </section>
|
|
|
222 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="7" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
223 background-color: #FFFFFF;
|
|
|
224 font-size: 28px;
|
|
|
225 color: #4b4b4b;
|
|
|
226 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
227 }
|
|
|
228
|
|
|
229 section.title {
|
|
|
230 font-size: 40px;
|
|
|
231 padding: 40px;
|
|
|
232 }
|
|
|
233 section.title h1 {
|
|
|
234 text-align: center;
|
|
|
235 }
|
|
|
236
|
|
|
237 section.slide h1 {
|
|
|
238 position: absolute;
|
|
|
239 left: 50px; top: 35px;
|
|
|
240 }
|
|
48
|
241 " class="slide" data-marpit-pagination="7" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
242 ;">
|
|
47
|
243 <h1>VM貸出サービスの移行</h1>
|
|
|
244 <ul>
|
|
|
245 <li>VM貸出サービスを継続するため、KVMを導入する</li>
|
|
|
246 <li>VMからGPUの利用にはPCIパススルーの設定が必要となる</li>
|
|
|
247 <li>しかし、VM1つに対し、1つのGPUが必要になる
|
|
46
|
248 <ul>
|
|
47
|
249 <li>希望する学生全員に割り当てができない</li>
|
|
|
250 </ul>
|
|
|
251 </li>
|
|
|
252 </ul>
|
|
|
253 <br />
|
|
46
|
254 <ul>
|
|
47
|
255 <li>そこで、コンテナ環境を導入する
|
|
|
256 <ul>
|
|
|
257 <li>1つのGPUを複数のコンテナから利用できる</li>
|
|
46
|
258 </ul>
|
|
|
259 </li>
|
|
|
260 </ul>
|
|
|
261 </section>
|
|
|
262 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="8" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
263 background-color: #FFFFFF;
|
|
|
264 font-size: 28px;
|
|
|
265 color: #4b4b4b;
|
|
|
266 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
267 }
|
|
|
268
|
|
|
269 section.title {
|
|
|
270 font-size: 40px;
|
|
|
271 padding: 40px;
|
|
|
272 }
|
|
|
273 section.title h1 {
|
|
|
274 text-align: center;
|
|
|
275 }
|
|
|
276
|
|
|
277 section.slide h1 {
|
|
|
278 position: absolute;
|
|
|
279 left: 50px; top: 35px;
|
|
|
280 }
|
|
48
|
281 " class="slide" data-marpit-pagination="8" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
282 ;">
|
|
47
|
283 <h1>コンテナ環境の導入</h1>
|
|
46
|
284 <ul>
|
|
49
|
285 <li>マルチユーザで利用できるPodman、Singularityを導入する</li>
|
|
47
|
286 <li>Podman
|
|
46
|
287 <ul>
|
|
47
|
288 <li>rootlessで利用できる</li>
|
|
|
289 <li>nvidia-dockerの設定を行えばGPUを利用できる</li>
|
|
46
|
290 </ul>
|
|
|
291 </li>
|
|
47
|
292 <li>Singularity
|
|
46
|
293 <ul>
|
|
47
|
294 <li>rootlessで利用できる</li>
|
|
|
295 <li>GPUの利用が容易
|
|
|
296 <ul>
|
|
|
297 <li>GPUドライバーのインストールのみ</li>
|
|
46
|
298 </ul>
|
|
|
299 </li>
|
|
47
|
300 </ul>
|
|
|
301 </li>
|
|
46
|
302 </ul>
|
|
|
303 </section>
|
|
|
304 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="9" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
305 background-color: #FFFFFF;
|
|
|
306 font-size: 28px;
|
|
|
307 color: #4b4b4b;
|
|
|
308 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
309 }
|
|
|
310
|
|
|
311 section.title {
|
|
|
312 font-size: 40px;
|
|
|
313 padding: 40px;
|
|
|
314 }
|
|
|
315 section.title h1 {
|
|
|
316 text-align: center;
|
|
|
317 }
|
|
|
318
|
|
|
319 section.slide h1 {
|
|
|
320 position: absolute;
|
|
|
321 left: 50px; top: 35px;
|
|
|
322 }
|
|
48
|
323 " class="slide" data-marpit-pagination="9" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
47
|
324 ;">
|
|
|
325 <h1>コンテナエンジンの補い</h1>
|
|
|
326 <ul>
|
|
|
327 <li>
|
|
|
328 <p>Podman</p>
|
|
|
329 <ul>
|
|
49
|
330 <li>イメージの作成やコンテナの作成が遅い</li>
|
|
47
|
331 <li>rootlessでは実行できない機能がある
|
|
|
332 <ul>
|
|
|
333 <li>IPアドレスの割り当て</li>
|
|
|
334 </ul>
|
|
|
335 </li>
|
|
|
336 </ul>
|
|
|
337 </li>
|
|
|
338 <li>
|
|
|
339 <p>Singularity</p>
|
|
|
340 <ul>
|
|
|
341 <li>イメージの作成に時間がかかる
|
|
|
342 <ul>
|
|
|
343 <li>ビルド中にエラーが発生すると、一から再開する必要がある</li>
|
|
|
344 </ul>
|
|
|
345 </li>
|
|
|
346 </ul>
|
|
|
347 </li>
|
|
|
348 <li>
|
|
|
349 <p>そこでPodmanのwrapperであるie-podmanを作成した</p>
|
|
|
350 </li>
|
|
|
351 </ul>
|
|
|
352 </section>
|
|
|
353 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="10" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
354 background-color: #FFFFFF;
|
|
|
355 font-size: 28px;
|
|
|
356 color: #4b4b4b;
|
|
|
357 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
358 }
|
|
|
359
|
|
|
360 section.title {
|
|
|
361 font-size: 40px;
|
|
|
362 padding: 40px;
|
|
|
363 }
|
|
|
364 section.title h1 {
|
|
|
365 text-align: center;
|
|
|
366 }
|
|
|
367
|
|
|
368 section.slide h1 {
|
|
|
369 position: absolute;
|
|
|
370 left: 50px; top: 35px;
|
|
|
371 }
|
|
48
|
372 " class="slide" data-marpit-pagination="10" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
47
|
373 ;">
|
|
|
374 <h1>ie-podmanの作成</h1>
|
|
|
375 <ul>
|
|
|
376 <li>ユーザのUID、GIDを取得し管理を行う
|
|
|
377 <ul>
|
|
|
378 <li>他のユーザのリソースを操作できない</li>
|
|
|
379 </ul>
|
|
|
380 </li>
|
|
|
381 <li>SSD上にイメージ等を保存し、高速を図る</li>
|
|
|
382 </ul>
|
|
|
383 </section>
|
|
|
384 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="11" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
385 background-color: #FFFFFF;
|
|
|
386 font-size: 28px;
|
|
|
387 color: #4b4b4b;
|
|
|
388 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
389 }
|
|
|
390
|
|
|
391 section.title {
|
|
|
392 font-size: 40px;
|
|
|
393 padding: 40px;
|
|
|
394 }
|
|
|
395 section.title h1 {
|
|
|
396 text-align: center;
|
|
|
397 }
|
|
|
398
|
|
|
399 section.slide h1 {
|
|
|
400 position: absolute;
|
|
|
401 left: 50px; top: 35px;
|
|
|
402 }
|
|
48
|
403 " class="slide" data-marpit-pagination="11" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
404 ;">
|
|
|
405 <h1>ie-podmanの機能 1/2</h1>
|
|
47
|
406 <ul>
|
|
|
407 <li>Podmanのすべての機能をwrappするのではなく、一部機能のみを提供する</li>
|
|
|
408 </ul>
|
|
46
|
409 <table>
|
|
|
410 <thead>
|
|
|
411 <tr>
|
|
|
412 <th>コマンド</th>
|
|
|
413 <th>機能</th>
|
|
|
414 </tr>
|
|
|
415 </thead>
|
|
|
416 <tbody>
|
|
|
417 <tr>
|
|
|
418 <td>build</td>
|
|
|
419 <td>Containerfileの指示に従いイメージを作成する</td>
|
|
|
420 </tr>
|
|
|
421 <tr>
|
|
|
422 <td>cp</td>
|
|
|
423 <td>コンテナにファイルを送信する</td>
|
|
|
424 </tr>
|
|
|
425 <tr>
|
|
|
426 <td>exec</td>
|
|
|
427 <td>起動中のコンテナでプロセスを実行する</td>
|
|
|
428 </tr>
|
|
|
429 <tr>
|
|
|
430 <td>images</td>
|
|
|
431 <td>コンテナイメージの一覧を表示する</td>
|
|
|
432 </tr>
|
|
|
433 <tr>
|
|
|
434 <td>info</td>
|
|
|
435 <td>コンテナの情報を表示する</td>
|
|
|
436 </tr>
|
|
|
437 <tr>
|
|
|
438 <td>logs</td>
|
|
|
439 <td>コンテナのlogを表示する</td>
|
|
|
440 </tr>
|
|
|
441 <tr>
|
|
|
442 <td>ps</td>
|
|
|
443 <td>起動中のコンテナの一覧を表示する</td>
|
|
|
444 </tr>
|
|
|
445 </tbody>
|
|
|
446 </table>
|
|
|
447 </section>
|
|
47
|
448 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="12" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
46
|
449 background-color: #FFFFFF;
|
|
|
450 font-size: 28px;
|
|
|
451 color: #4b4b4b;
|
|
|
452 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
453 }
|
|
|
454
|
|
|
455 section.title {
|
|
|
456 font-size: 40px;
|
|
|
457 padding: 40px;
|
|
|
458 }
|
|
|
459 section.title h1 {
|
|
|
460 text-align: center;
|
|
|
461 }
|
|
|
462
|
|
|
463 section.slide h1 {
|
|
|
464 position: absolute;
|
|
|
465 left: 50px; top: 35px;
|
|
|
466 }
|
|
48
|
467 " class="slide" data-marpit-pagination="12" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
468 ;">
|
|
|
469 <h1>ie-podmanの機能 2/2</h1>
|
|
47
|
470 <ul>
|
|
|
471 <li>registryやsifなど独自機能を提供する</li>
|
|
|
472 </ul>
|
|
46
|
473 <table>
|
|
|
474 <thead>
|
|
|
475 <tr>
|
|
|
476 <th>コマンド</th>
|
|
|
477 <th>機能</th>
|
|
|
478 </tr>
|
|
|
479 </thead>
|
|
|
480 <tbody>
|
|
|
481 <tr>
|
|
|
482 <td>registry</td>
|
|
|
483 <td>学科のレジストリの操作を行う</td>
|
|
|
484 </tr>
|
|
|
485 <tr>
|
|
|
486 <td>rm</td>
|
|
|
487 <td>コンテナを削除する</td>
|
|
|
488 </tr>
|
|
|
489 <tr>
|
|
|
490 <td>run</td>
|
|
|
491 <td>コンテナを作成する</td>
|
|
|
492 </tr>
|
|
|
493 <tr>
|
|
|
494 <td>sif</td>
|
|
|
495 <td>イメージをsifファイルに変換する</td>
|
|
|
496 </tr>
|
|
|
497 <tr>
|
|
|
498 <td>start</td>
|
|
|
499 <td>コンテナを起動する</td>
|
|
|
500 </tr>
|
|
|
501 <tr>
|
|
|
502 <td>stop</td>
|
|
|
503 <td>コンテナを停止する</td>
|
|
|
504 </tr>
|
|
|
505 </tbody>
|
|
|
506 </table>
|
|
|
507 </section>
|
|
47
|
508 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="13" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
46
|
509 background-color: #FFFFFF;
|
|
|
510 font-size: 28px;
|
|
|
511 color: #4b4b4b;
|
|
|
512 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
513 }
|
|
|
514
|
|
|
515 section.title {
|
|
|
516 font-size: 40px;
|
|
|
517 padding: 40px;
|
|
|
518 }
|
|
|
519 section.title h1 {
|
|
|
520 text-align: center;
|
|
|
521 }
|
|
|
522
|
|
|
523 section.slide h1 {
|
|
|
524 position: absolute;
|
|
|
525 left: 50px; top: 35px;
|
|
|
526 }
|
|
48
|
527 " class="slide" data-marpit-pagination="13" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
528 ;">
|
|
47
|
529 <h1>ジョブスケジューラの導入</h1>
|
|
46
|
530 <ul>
|
|
47
|
531 <li>多くのリソースを必要とするプログラムは管理が必要である</li>
|
|
|
532 <li>4台のサーバのリソースを利用できるようにする必要がある</li>
|
|
|
533 <li>そこで、ジョブスケジューラのSlurmを採用する
|
|
|
534 <ul>
|
|
|
535 <li>フォールトトレラントで拡張性が高い</li>
|
|
|
536 </ul>
|
|
|
537 </li>
|
|
46
|
538 </ul>
|
|
|
539 </section>
|
|
47
|
540 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="14" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
46
|
541 background-color: #FFFFFF;
|
|
|
542 font-size: 28px;
|
|
|
543 color: #4b4b4b;
|
|
|
544 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
545 }
|
|
|
546
|
|
|
547 section.title {
|
|
|
548 font-size: 40px;
|
|
|
549 padding: 40px;
|
|
|
550 }
|
|
|
551 section.title h1 {
|
|
|
552 text-align: center;
|
|
|
553 }
|
|
|
554
|
|
|
555 section.slide h1 {
|
|
|
556 position: absolute;
|
|
|
557 left: 50px; top: 35px;
|
|
|
558 }
|
|
48
|
559 " class="slide" data-marpit-pagination="14" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
560 ;">
|
|
|
561 <h1>ジョブスケジューラの構築</h1>
|
|
47
|
562 <p>利用方針 <strong>「計算リソースの利用効率を上げる」</strong></p>
|
|
46
|
563 <ul>
|
|
|
564 <li>Jobの優先順位
|
|
|
565 <ul>
|
|
|
566 <li>要求するリソースの少ないJobの優先度を高くする</li>
|
|
|
567 <li>実行時間が短いJobの優先度を高くする</li>
|
|
|
568 <li>これまでのJobの実行履歴で優先度は変化しない</li>
|
|
|
569 </ul>
|
|
|
570 </li>
|
|
|
571 </ul>
|
|
|
572 <p>これでは多くのリソースを要求するJobが実行されない可能性がある。</p>
|
|
|
573 <ul>
|
|
|
574 <li>Jobの実行時間
|
|
|
575 <ul>
|
|
|
576 <li>Jobの実行時間の記載がない場合は<strong>1日で強制終了</strong>させる</li>
|
|
|
577 <li>管理者からJobの優先度を上げる</li>
|
|
|
578 </ul>
|
|
|
579 </li>
|
|
|
580 </ul>
|
|
|
581 <p>また、Jobのスケジュールにはバックフィルを採用する。</p>
|
|
|
582 </section>
|
|
|
583 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="15" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
584 background-color: #FFFFFF;
|
|
|
585 font-size: 28px;
|
|
|
586 color: #4b4b4b;
|
|
|
587 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
588 }
|
|
|
589
|
|
|
590 section.title {
|
|
|
591 font-size: 40px;
|
|
|
592 padding: 40px;
|
|
|
593 }
|
|
|
594 section.title h1 {
|
|
|
595 text-align: center;
|
|
|
596 }
|
|
|
597
|
|
|
598 section.slide h1 {
|
|
|
599 position: absolute;
|
|
|
600 left: 50px; top: 35px;
|
|
|
601 }
|
|
48
|
602 " class="slide" data-marpit-pagination="15" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
47
|
603 ;">
|
|
|
604 <p><img src="images/backfill.png" alt="" /></p>
|
|
|
605 </section>
|
|
|
606 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="16" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
607 background-color: #FFFFFF;
|
|
|
608 font-size: 28px;
|
|
|
609 color: #4b4b4b;
|
|
|
610 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
611 }
|
|
|
612
|
|
|
613 section.title {
|
|
|
614 font-size: 40px;
|
|
|
615 padding: 40px;
|
|
|
616 }
|
|
|
617 section.title h1 {
|
|
|
618 text-align: center;
|
|
|
619 }
|
|
|
620
|
|
|
621 section.slide h1 {
|
|
|
622 position: absolute;
|
|
|
623 left: 50px; top: 35px;
|
|
|
624 }
|
|
48
|
625 " class="slide" data-marpit-pagination="16" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
47
|
626 ;">
|
|
|
627 <h1>ファイルシステムの導入</h1>
|
|
|
628 <ul>
|
|
|
629 <li>Cephを採用
|
|
|
630 <ul>
|
|
|
631 <li>自己修復、自己管理機能を搭載するため信頼性が高い</li>
|
|
|
632 <li>柔軟なアクセス方法の提供
|
|
|
633 <ul>
|
|
|
634 <li>Object Gateway</li>
|
|
|
635 <li>ブロックデバイス</li>
|
|
|
636 <li>POSIX互換のファイルシステム</li>
|
|
|
637 </ul>
|
|
|
638 </li>
|
|
|
639 </ul>
|
|
|
640 </li>
|
|
|
641 </ul>
|
|
|
642 </section>
|
|
|
643 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="17" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
644 background-color: #FFFFFF;
|
|
|
645 font-size: 28px;
|
|
|
646 color: #4b4b4b;
|
|
|
647 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
648 }
|
|
|
649
|
|
|
650 section.title {
|
|
|
651 font-size: 40px;
|
|
|
652 padding: 40px;
|
|
|
653 }
|
|
|
654 section.title h1 {
|
|
|
655 text-align: center;
|
|
|
656 }
|
|
|
657
|
|
|
658 section.slide h1 {
|
|
|
659 position: absolute;
|
|
|
660 left: 50px; top: 35px;
|
|
|
661 }
|
|
48
|
662 " class="slide" data-marpit-pagination="17" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
663 ;">
|
|
|
664 <h1>教育情報システムの構成</h1>
|
|
|
665 <ul>
|
|
47
|
666 <li>汎用サーバ全てにKVM、Podman、Singularityをインストール</li>
|
|
46
|
667 <li>Slurm
|
|
|
668 <ul>
|
|
|
669 <li>汎用サーバ1台をコントローラ/計算ノード</li>
|
|
|
670 <li>残りを計算ノード</li>
|
|
|
671 </ul>
|
|
|
672 </li>
|
|
|
673 <li>Ceph
|
|
|
674 <ul>
|
|
|
675 <li>ディスクサーバをOSD</li>
|
|
|
676 <li>汎用サーバ3台をMON, MDS, MGR</li>
|
|
|
677 </ul>
|
|
|
678 </li>
|
|
|
679 </ul>
|
|
|
680 </section>
|
|
|
681 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
682 background-color: #FFFFFF;
|
|
|
683 font-size: 28px;
|
|
|
684 color: #4b4b4b;
|
|
|
685 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
686 }
|
|
|
687
|
|
|
688 section.title {
|
|
|
689 font-size: 40px;
|
|
|
690 padding: 40px;
|
|
|
691 }
|
|
|
692 section.title h1 {
|
|
|
693 text-align: center;
|
|
|
694 }
|
|
|
695
|
|
|
696 section.slide h1 {
|
|
|
697 position: absolute;
|
|
|
698 left: 50px; top: 35px;
|
|
|
699 }
|
|
48
|
700 " class="slide" data-marpit-pagination="18" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
47
|
701 ;" data-marpit-advanced-background="background"><div data-marpit-advanced-background-container="true" data-marpit-advanced-background-direction="horizontal"><figure style="background-image:url("images/system.png");background-size:80%;"></figure></div></section></foreignObject><foreignObject width="1280" height="720"><section id="18" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
46
|
702 background-color: #FFFFFF;
|
|
|
703 font-size: 28px;
|
|
|
704 color: #4b4b4b;
|
|
|
705 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
706 }
|
|
|
707
|
|
|
708 section.title {
|
|
|
709 font-size: 40px;
|
|
|
710 padding: 40px;
|
|
|
711 }
|
|
|
712 section.title h1 {
|
|
|
713 text-align: center;
|
|
|
714 }
|
|
|
715
|
|
|
716 section.slide h1 {
|
|
|
717 position: absolute;
|
|
|
718 left: 50px; top: 35px;
|
|
|
719 }
|
|
48
|
720 " class="slide" data-marpit-pagination="18" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
47
|
721 ;" data-marpit-advanced-background="content"></section>
|
|
48
|
722 </foreignObject><foreignObject width="1280" height="720" data-marpit-advanced-background="pseudo"><section class="slide" style="" data-marpit-advanced-background="pseudo" data-marpit-pagination="18" data-marpit-pagination-total="32"></section></foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="19" data-paginate="true" data-class="title" data-theme="default" data-style="section {
|
|
46
|
723 background-color: #FFFFFF;
|
|
|
724 font-size: 28px;
|
|
|
725 color: #4b4b4b;
|
|
|
726 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
727 }
|
|
|
728
|
|
|
729 section.title {
|
|
|
730 font-size: 40px;
|
|
|
731 padding: 40px;
|
|
|
732 }
|
|
|
733 section.title h1 {
|
|
|
734 text-align: center;
|
|
|
735 }
|
|
|
736
|
|
|
737 section.slide h1 {
|
|
|
738 position: absolute;
|
|
|
739 left: 50px; top: 35px;
|
|
|
740 }
|
|
48
|
741 " class="title" data-marpit-pagination="19" data-marpit-pagination-total="32" style="--paginate:true;--class:title;--theme:default;
|
|
46
|
742 ;">
|
|
47
|
743 <h1>教育情報システムの利用と管理</h1>
|
|
46
|
744 </section>
|
|
|
745 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="20" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
746 background-color: #FFFFFF;
|
|
|
747 font-size: 28px;
|
|
|
748 color: #4b4b4b;
|
|
|
749 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
750 }
|
|
|
751
|
|
|
752 section.title {
|
|
|
753 font-size: 40px;
|
|
|
754 padding: 40px;
|
|
|
755 }
|
|
|
756 section.title h1 {
|
|
|
757 text-align: center;
|
|
|
758 }
|
|
|
759
|
|
|
760 section.slide h1 {
|
|
|
761 position: absolute;
|
|
|
762 left: 50px; top: 35px;
|
|
|
763 }
|
|
48
|
764 " class="slide" data-marpit-pagination="20" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
765 ;">
|
|
47
|
766 <h1>VM貸出サービスの利用</h1>
|
|
48
|
767 <ul>
|
|
|
768 <li>VMの作成、スペックの変更で申請が必要なくなった</li>
|
|
|
769 <li>VMの作成
|
|
|
770 <ul>
|
|
|
771 <li><code>ie-virsh define --template Ubuntu-20 VM_NAME</code></li>
|
|
|
772 </ul>
|
|
|
773 </li>
|
|
|
774 <li>スペックの変更
|
|
|
775 <ul>
|
|
|
776 <li><code>ie-virsh edit VM_NAME</code></li>
|
|
|
777 </ul>
|
|
|
778 </li>
|
|
|
779 </ul>
|
|
46
|
780 </section>
|
|
47
|
781 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="21" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
46
|
782 background-color: #FFFFFF;
|
|
|
783 font-size: 28px;
|
|
|
784 color: #4b4b4b;
|
|
|
785 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
786 }
|
|
|
787
|
|
|
788 section.title {
|
|
|
789 font-size: 40px;
|
|
|
790 padding: 40px;
|
|
|
791 }
|
|
|
792 section.title h1 {
|
|
|
793 text-align: center;
|
|
|
794 }
|
|
|
795
|
|
|
796 section.slide h1 {
|
|
|
797 position: absolute;
|
|
|
798 left: 50px; top: 35px;
|
|
|
799 }
|
|
48
|
800 " class="slide" data-marpit-pagination="21" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
801 ;">
|
|
48
|
802 <h1>ie-podmanの使用方法</h1>
|
|
|
803 <ul>
|
|
|
804 <li>PodmanはDockerと同じCLIを提供している</li>
|
|
|
805 <li>IPアドレス、GPUをコンテナへ割り当てられる
|
|
|
806 <ul>
|
|
|
807 <li><code>ie-podman run --ip --gpu [IMAGE_NAME]</code></li>
|
|
|
808 </ul>
|
|
|
809 </li>
|
|
|
810 <li>作成したイメージをsifファイルへの変換に対応
|
|
|
811 <ul>
|
|
|
812 <li><code>ie-podman sif [IMAGE_NAME]</code></li>
|
|
|
813 </ul>
|
|
|
814 </li>
|
|
|
815 </ul>
|
|
46
|
816 </section>
|
|
|
817 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="22" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
818 background-color: #FFFFFF;
|
|
|
819 font-size: 28px;
|
|
|
820 color: #4b4b4b;
|
|
|
821 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
822 }
|
|
|
823
|
|
|
824 section.title {
|
|
|
825 font-size: 40px;
|
|
|
826 padding: 40px;
|
|
|
827 }
|
|
|
828 section.title h1 {
|
|
|
829 text-align: center;
|
|
|
830 }
|
|
|
831
|
|
|
832 section.slide h1 {
|
|
|
833 position: absolute;
|
|
|
834 left: 50px; top: 35px;
|
|
|
835 }
|
|
48
|
836 " class="slide" data-marpit-pagination="22" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
47
|
837 ;">
|
|
|
838 <h1>GPUの利用方法</h1>
|
|
48
|
839 <ul>
|
|
|
840 <li>Singularityでは容易にGPUを利用できる
|
|
|
841 <ul>
|
|
|
842 <li><code>singularity run --nv [SIF_NAME]</code></li>
|
|
|
843 </ul>
|
|
|
844 </li>
|
|
|
845 <li>ホームディレクトリ、/tmpなどがコンテナにマウントされる
|
|
|
846 <ul>
|
|
|
847 <li>プログラムの実行に便利</li>
|
|
|
848 </ul>
|
|
|
849 </li>
|
|
|
850 <li>SlurmによるJob管理
|
|
|
851 <ul>
|
|
|
852 <li>必要なリソースを記述し投下する</li>
|
|
|
853 <li>CPU数、GPU数</li>
|
|
|
854 </ul>
|
|
|
855 </li>
|
|
|
856 </ul>
|
|
47
|
857 </section>
|
|
48
|
858 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="23" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
47
|
859 background-color: #FFFFFF;
|
|
|
860 font-size: 28px;
|
|
|
861 color: #4b4b4b;
|
|
|
862 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
863 }
|
|
|
864
|
|
|
865 section.title {
|
|
|
866 font-size: 40px;
|
|
|
867 padding: 40px;
|
|
|
868 }
|
|
|
869 section.title h1 {
|
|
|
870 text-align: center;
|
|
|
871 }
|
|
|
872
|
|
|
873 section.slide h1 {
|
|
|
874 position: absolute;
|
|
|
875 left: 50px; top: 35px;
|
|
|
876 }
|
|
48
|
877 " class="slide" data-marpit-pagination="23" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
47
|
878 ;">
|
|
48
|
879 <h1>batchファイルの例</h1>
|
|
|
880 <ul>
|
|
|
881 <li>Jobに必要とするリソース
|
|
|
882 <ul>
|
|
|
883 <li>CPU 8コア、GPU 1つ</li>
|
|
|
884 </ul>
|
|
|
885 </li>
|
|
|
886 <li>Jobの実行時間
|
|
|
887 <ul>
|
|
|
888 <li>1分</li>
|
|
|
889 </ul>
|
|
|
890 </li>
|
|
|
891 </ul>
|
|
|
892 <pre><code class="language-bash"><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap><span class="hljs-meta">#!/bin/bash</span>
|
|
|
893 <span class="hljs-comment">#SBATCH --job-name sample</span>
|
|
|
894 <span class="hljs-comment">#SBATCH --output logs/%x-%j.log</span>
|
|
|
895 <span class="hljs-comment">#SBATCH --error logs/%x-%j.err</span>
|
|
|
896 <span class="hljs-comment">#SBATCH --nodes 1</span>
|
|
|
897 <span class="hljs-comment">#SBATCH --cpus-per-task 8</span>
|
|
|
898 <span class="hljs-comment">#SBATCH --gpus tesla:1</span>
|
|
|
899 <span class="hljs-comment">#SBATCH --time 01:00</span>
|
|
|
900
|
|
|
901 singularity <span class="hljs-built_in">exec</span> --nv [SIF_NAME] [COMMANDS]
|
|
|
902 </span></span></foreignObject></svg></code></pre>
|
|
47
|
903 </section>
|
|
48
|
904 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="24" data-paginate="true" data-class="title" data-theme="default" data-style="section {
|
|
47
|
905 background-color: #FFFFFF;
|
|
|
906 font-size: 28px;
|
|
|
907 color: #4b4b4b;
|
|
|
908 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
909 }
|
|
|
910
|
|
|
911 section.title {
|
|
|
912 font-size: 40px;
|
|
|
913 padding: 40px;
|
|
|
914 }
|
|
|
915 section.title h1 {
|
|
|
916 text-align: center;
|
|
|
917 }
|
|
|
918
|
|
|
919 section.slide h1 {
|
|
|
920 position: absolute;
|
|
|
921 left: 50px; top: 35px;
|
|
|
922 }
|
|
48
|
923 " class="title" data-marpit-pagination="24" data-marpit-pagination-total="32" style="--paginate:true;--class:title;--theme:default;
|
|
|
924 ;">
|
|
|
925 <h1>教育情報システムの評価</h1>
|
|
|
926 </section>
|
|
|
927 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="25" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
928 background-color: #FFFFFF;
|
|
|
929 font-size: 28px;
|
|
|
930 color: #4b4b4b;
|
|
|
931 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
932 }
|
|
|
933
|
|
|
934 section.title {
|
|
|
935 font-size: 40px;
|
|
|
936 padding: 40px;
|
|
|
937 }
|
|
|
938 section.title h1 {
|
|
|
939 text-align: center;
|
|
|
940 }
|
|
|
941
|
|
|
942 section.slide h1 {
|
|
|
943 position: absolute;
|
|
|
944 left: 50px; top: 35px;
|
|
|
945 }
|
|
|
946 " class="slide" data-marpit-pagination="25" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
947 ;">
|
|
|
948 <h1>ファイルシステムの評価 1/2</h1>
|
|
|
949 <ul>
|
|
48
|
950 <li>
|
|
|
951 <p>実験概要</p>
|
|
46
|
952 <ul>
|
|
48
|
953 <li><code>dd</code>コマンドを使用し書き込み速度を比較する</li>
|
|
46
|
954 </ul>
|
|
|
955 </li>
|
|
48
|
956 <li>
|
|
|
957 <p>書き込み速度の比較</p>
|
|
46
|
958 <ul>
|
|
48
|
959 <li>GFS2</li>
|
|
|
960 <li>NFS</li>
|
|
|
961 <li>CephFS</li>
|
|
|
962 <li>CephRBD</li>
|
|
46
|
963 </ul>
|
|
|
964 </li>
|
|
|
965 </ul>
|
|
|
966 </section>
|
|
|
967 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
968 background-color: #FFFFFF;
|
|
|
969 font-size: 28px;
|
|
|
970 color: #4b4b4b;
|
|
|
971 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
972 }
|
|
|
973
|
|
|
974 section.title {
|
|
|
975 font-size: 40px;
|
|
|
976 padding: 40px;
|
|
|
977 }
|
|
|
978 section.title h1 {
|
|
|
979 text-align: center;
|
|
|
980 }
|
|
|
981
|
|
|
982 section.slide h1 {
|
|
|
983 position: absolute;
|
|
|
984 left: 50px; top: 35px;
|
|
|
985 }
|
|
48
|
986 " class="slide" data-marpit-pagination="26" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
|
987 ;" data-marpit-advanced-background="background"><div data-marpit-advanced-background-container="true" data-marpit-advanced-background-direction="horizontal"><figure style="background-image:url("images/fswrite.png");background-size:70%;"></figure></div></section></foreignObject><foreignObject width="1280" height="720"><section id="26" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
988 background-color: #FFFFFF;
|
|
|
989 font-size: 28px;
|
|
|
990 color: #4b4b4b;
|
|
|
991 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
992 }
|
|
|
993
|
|
|
994 section.title {
|
|
|
995 font-size: 40px;
|
|
|
996 padding: 40px;
|
|
|
997 }
|
|
|
998 section.title h1 {
|
|
|
999 text-align: center;
|
|
|
1000 }
|
|
|
1001
|
|
|
1002 section.slide h1 {
|
|
|
1003 position: absolute;
|
|
|
1004 left: 50px; top: 35px;
|
|
|
1005 }
|
|
|
1006 " class="slide" data-marpit-pagination="26" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
|
1007 ;" data-marpit-advanced-background="content">
|
|
|
1008 <h1>ファイルシステムの評価 2/2</h1>
|
|
|
1009 </section>
|
|
|
1010 </foreignObject><foreignObject width="1280" height="720" data-marpit-advanced-background="pseudo"><section class="slide" style="" data-marpit-advanced-background="pseudo" data-marpit-pagination="26" data-marpit-pagination-total="32"></section></foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="27" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
46
|
1011 background-color: #FFFFFF;
|
|
|
1012 font-size: 28px;
|
|
|
1013 color: #4b4b4b;
|
|
|
1014 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
1015 }
|
|
|
1016
|
|
|
1017 section.title {
|
|
|
1018 font-size: 40px;
|
|
|
1019 padding: 40px;
|
|
|
1020 }
|
|
|
1021 section.title h1 {
|
|
|
1022 text-align: center;
|
|
|
1023 }
|
|
|
1024
|
|
|
1025 section.slide h1 {
|
|
|
1026 position: absolute;
|
|
|
1027 left: 50px; top: 35px;
|
|
|
1028 }
|
|
48
|
1029 " class="slide" data-marpit-pagination="27" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
|
1030 ;">
|
|
|
1031 <h1>ie-podmanの評価 1/3</h1>
|
|
|
1032 <ul>
|
|
|
1033 <li>
|
|
|
1034 <p>実験環境</p>
|
|
|
1035 <ul>
|
|
|
1036 <li>新システムの汎用サーバで実施</li>
|
|
|
1037 </ul>
|
|
|
1038 </li>
|
|
|
1039 <li>
|
|
|
1040 <p>実験概要</p>
|
|
|
1041 <ul>
|
|
|
1042 <li>イメージのBuild速度を比較する</li>
|
|
|
1043 </ul>
|
|
|
1044 </li>
|
|
49
|
1045 </ul>
|
|
|
1046 <pre><code class="language-Dockerfile"><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap><span class="hljs-keyword">FROM</span> ubuntu:<span class="hljs-number">20.04</span>
|
|
|
1047 <span class="hljs-keyword">RUN</span><span class="bash"> apt-get update && \
|
|
|
1048 apt-get upgrade -y</span>
|
|
|
1049 </span></span></foreignObject></svg></code></pre>
|
|
|
1050 <ul>
|
|
|
1051 <li>Build速度の比較
|
|
48
|
1052 <ul>
|
|
|
1053 <li>Docker</li>
|
|
|
1054 <li>Podman (rootless)</li>
|
|
|
1055 <li>ie-podman</li>
|
|
|
1056 </ul>
|
|
|
1057 </li>
|
|
|
1058 </ul>
|
|
46
|
1059 </section>
|
|
|
1060 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
1061 background-color: #FFFFFF;
|
|
|
1062 font-size: 28px;
|
|
|
1063 color: #4b4b4b;
|
|
|
1064 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
1065 }
|
|
|
1066
|
|
|
1067 section.title {
|
|
|
1068 font-size: 40px;
|
|
|
1069 padding: 40px;
|
|
|
1070 }
|
|
|
1071 section.title h1 {
|
|
|
1072 text-align: center;
|
|
|
1073 }
|
|
|
1074
|
|
|
1075 section.slide h1 {
|
|
|
1076 position: absolute;
|
|
|
1077 left: 50px; top: 35px;
|
|
|
1078 }
|
|
49
|
1079 " class="slide" data-marpit-pagination="28" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
|
1080 ;" data-marpit-advanced-background="background"><div data-marpit-advanced-background-container="true" data-marpit-advanced-background-direction="horizontal"><figure style="background-image:url("images/container2.png");background-size:70%;"></figure></div></section></foreignObject><foreignObject width="1280" height="720"><section id="28" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
|
1081 background-color: #FFFFFF;
|
|
|
1082 font-size: 28px;
|
|
|
1083 color: #4b4b4b;
|
|
|
1084 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
1085 }
|
|
|
1086
|
|
|
1087 section.title {
|
|
|
1088 font-size: 40px;
|
|
|
1089 padding: 40px;
|
|
|
1090 }
|
|
|
1091 section.title h1 {
|
|
|
1092 text-align: center;
|
|
|
1093 }
|
|
|
1094
|
|
|
1095 section.slide h1 {
|
|
|
1096 position: absolute;
|
|
|
1097 left: 50px; top: 35px;
|
|
|
1098 }
|
|
|
1099 " class="slide" data-marpit-pagination="28" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
|
1100 ;" data-marpit-advanced-background="content">
|
|
|
1101 <h1>ie-podmanの評価 2/3</h1>
|
|
|
1102 </section>
|
|
|
1103 </foreignObject><foreignObject width="1280" height="720" data-marpit-advanced-background="pseudo"><section class="slide" style="" data-marpit-advanced-background="pseudo" data-marpit-pagination="28" data-marpit-pagination-total="32"></section></foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="29" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
46
|
1104 background-color: #FFFFFF;
|
|
|
1105 font-size: 28px;
|
|
|
1106 color: #4b4b4b;
|
|
|
1107 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
1108 }
|
|
|
1109
|
|
|
1110 section.title {
|
|
|
1111 font-size: 40px;
|
|
|
1112 padding: 40px;
|
|
|
1113 }
|
|
|
1114 section.title h1 {
|
|
|
1115 text-align: center;
|
|
|
1116 }
|
|
|
1117
|
|
|
1118 section.slide h1 {
|
|
|
1119 position: absolute;
|
|
|
1120 left: 50px; top: 35px;
|
|
|
1121 }
|
|
48
|
1122 " class="slide" data-marpit-pagination="29" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
49
|
1123 ;">
|
|
46
|
1124 <h1>ie-podmanの評価 3/3</h1>
|
|
49
|
1125 <ul>
|
|
|
1126 <li>Rootlessは<code>syscall</code>が複数呼ばれている
|
|
|
1127 <ul>
|
|
|
1128 <li>そのため、イメージの作成が遅いのではないか</li>
|
|
|
1129 </ul>
|
|
|
1130 </li>
|
|
|
1131 <li>左がrootless、右がrootfull</li>
|
|
|
1132 </ul>
|
|
|
1133 <p><img src="images/syscall.png" alt="height:325" style="height:325px;" /></p>
|
|
46
|
1134 </section>
|
|
49
|
1135 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="30" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
46
|
1136 background-color: #FFFFFF;
|
|
|
1137 font-size: 28px;
|
|
|
1138 color: #4b4b4b;
|
|
|
1139 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
1140 }
|
|
|
1141
|
|
|
1142 section.title {
|
|
|
1143 font-size: 40px;
|
|
|
1144 padding: 40px;
|
|
|
1145 }
|
|
|
1146 section.title h1 {
|
|
|
1147 text-align: center;
|
|
|
1148 }
|
|
|
1149
|
|
|
1150 section.slide h1 {
|
|
|
1151 position: absolute;
|
|
|
1152 left: 50px; top: 35px;
|
|
|
1153 }
|
|
48
|
1154 " class="slide" data-marpit-pagination="30" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
1155 ;">
|
|
|
1156 <h1>学習環境の評価</h1>
|
|
|
1157 <ul>
|
|
|
1158 <li>VM
|
|
|
1159 <ul>
|
|
|
1160 <li>学生が自由にスペックを変更できる</li>
|
|
|
1161 <li>ディスク容量を抑えれる</li>
|
|
|
1162 </ul>
|
|
|
1163 </li>
|
|
|
1164 <li>コンテナ
|
|
|
1165 <ul>
|
|
|
1166 <li>気軽に利用できる</li>
|
|
|
1167 <li>高性能な実況環境を利用できる</li>
|
|
|
1168 </ul>
|
|
|
1169 </li>
|
|
|
1170 </ul>
|
|
|
1171 </section>
|
|
48
|
1172 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="31" data-paginate="true" data-class="title" data-theme="default" data-style="section {
|
|
46
|
1173 background-color: #FFFFFF;
|
|
|
1174 font-size: 28px;
|
|
|
1175 color: #4b4b4b;
|
|
|
1176 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
1177 }
|
|
|
1178
|
|
|
1179 section.title {
|
|
|
1180 font-size: 40px;
|
|
|
1181 padding: 40px;
|
|
|
1182 }
|
|
|
1183 section.title h1 {
|
|
|
1184 text-align: center;
|
|
|
1185 }
|
|
|
1186
|
|
|
1187 section.slide h1 {
|
|
|
1188 position: absolute;
|
|
|
1189 left: 50px; top: 35px;
|
|
|
1190 }
|
|
48
|
1191 " class="title" data-marpit-pagination="31" data-marpit-pagination-total="32" style="--paginate:true;--class:title;--theme:default;
|
|
46
|
1192 ;">
|
|
|
1193 <h1>まとめ</h1>
|
|
|
1194 </section>
|
|
48
|
1195 </foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="32" data-paginate="true" data-class="slide" data-theme="default" data-style="section {
|
|
46
|
1196 background-color: #FFFFFF;
|
|
|
1197 font-size: 28px;
|
|
|
1198 color: #4b4b4b;
|
|
|
1199 font-family: "Arial", "Hiragino Maru Gothic ProN";
|
|
|
1200 }
|
|
|
1201
|
|
|
1202 section.title {
|
|
|
1203 font-size: 40px;
|
|
|
1204 padding: 40px;
|
|
|
1205 }
|
|
|
1206 section.title h1 {
|
|
|
1207 text-align: center;
|
|
|
1208 }
|
|
|
1209
|
|
|
1210 section.slide h1 {
|
|
|
1211 position: absolute;
|
|
|
1212 left: 50px; top: 35px;
|
|
|
1213 }
|
|
48
|
1214 " class="slide" data-marpit-pagination="32" data-marpit-pagination-total="32" style="--paginate:true;--class:slide;--theme:default;
|
|
46
|
1215 ;">
|
|
|
1216 <h1>今後の課題</h1>
|
|
|
1217 <ul>
|
|
48
|
1218 <li>教育情報システムの周知
|
|
|
1219 <ul>
|
|
|
1220 <li>Jobの投下やリソースの要求方法</li>
|
|
|
1221 <li>ie-virsh、ie-podmanの使用方法</li>
|
|
|
1222 <li>定期的な周知が必要</li>
|
|
|
1223 </ul>
|
|
|
1224 </li>
|
|
|
1225 <li>ie-podmanのネットワーク構成の見直し
|
|
|
1226 <ul>
|
|
|
1227 <li>プレフィックス長が24のため、最大254個のIPアドレス</li>
|
|
|
1228 <li>コンテナを停止で使用されない場合は削除する必要がある</li>
|
|
|
1229 </ul>
|
|
|
1230 </li>
|
|
|
1231 <li>バックアップの運用
|
|
|
1232 <ul>
|
|
|
1233 <li>Cephと専用サーバ以外のバックアップ先を用意する必要がある</li>
|
|
|
1234 </ul>
|
|
|
1235 </li>
|
|
46
|
1236 </ul>
|
|
|
1237 </section>
|
|
|
1238 <script>!function(){"use strict";const t="marpitSVGPolyfill:setZoomFactor,",e=Symbol();let r,o;function n(n){const i="object"==typeof n&&n.target||document,a="object"==typeof n?n.zoom:n;window[e]||(Object.defineProperty(window,e,{configurable:!0,value:!0}),window.addEventListener("message",(({data:e,origin:r})=>{if(r===window.origin)try{if(e&&"string"==typeof e&&e.startsWith(t)){const[,t]=e.split(","),r=Number.parseFloat(t);Number.isNaN(r)||(o=r)}}catch(t){console.error(t)}})));let l=!1;Array.from(i.querySelectorAll("svg[data-marpit-svg]"),(t=>{var e,n,i,s;t.style.transform||(t.style.transform="translateZ(0)");const c=a||o||t.currentScale||1;r!==c&&(r=c,l=c);const d=t.getBoundingClientRect(),{length:u}=t.children;for(let r=0;r<u;r+=1){const o=t.children[r],a=o.getScreenCTM();if(a){const t=null!==(n=null===(e=o.x)||void 0===e?void 0:e.baseVal.value)&&void 0!==n?n:0,r=null!==(s=null===(i=o.y)||void 0===i?void 0:i.baseVal.value)&&void 0!==s?s:0,l=o.firstChild,{style:u}=l;u.transformOrigin||(u.transformOrigin=`${-t}px ${-r}px`),u.transform=`scale(${c}) matrix(${a.a}, ${a.b}, ${a.c}, ${a.d}, ${a.e-d.left}, ${a.f-d.top}) translateZ(0.0001px)`}}})),!1!==l&&Array.from(i.querySelectorAll("iframe"),(({contentWindow:e})=>{null==e||e.postMessage(`${t}${l}`,"null"===window.origin?"*":window.origin)}))}r=1,o=void 0;const i=(t,e,r)=>{if(t.getAttribute(e)!==r)return t.setAttribute(e,r),!0};function a({once:t=!1,target:e=document}={}){const r="Apple Computer, Inc."===navigator.vendor?[n]:[];let o=!t;const a=()=>{for(const t of r)t({target:e});!function(t=document){Array.from(t.querySelectorAll('svg[data-marp-fitting="svg"]'),(t=>{var e;const r=t.firstChild,o=r.firstChild,{scrollWidth:n,scrollHeight:a}=o;let l,s=1;if(t.hasAttribute("data-marp-fitting-code")&&(l=null===(e=t.parentElement)||void 0===e?void 0:e.parentElement),t.hasAttribute("data-marp-fitting-math")&&(l=t.parentElement),l){const t=getComputedStyle(l),e=Math.ceil(l.clientWidth-parseFloat(t.paddingLeft||"0")-parseFloat(t.paddingRight||"0"));e&&(s=e)}const c=Math.max(n,s),d=Math.max(a,1),u=`0 0 ${c} ${d}`;i(r,"width",`${c}`),i(r,"height",`${d}`),i(t,"preserveAspectRatio",getComputedStyle(t).getPropertyValue("--preserve-aspect-ratio")||"xMinYMin meet"),i(t,"viewBox",u)&&t.classList.toggle("__reflow__")}))}(e),o&&window.requestAnimationFrame(a)};return a(),()=>{o=!1}}const l=Symbol(),s=document.currentScript;((t=document)=>{if("undefined"==typeof window)throw new Error("Marp Core's browser script is valid only in browser context.");if(t[l])return t[l];const e=a({target:t}),r=()=>{e(),delete t[l]};Object.defineProperty(t,l,{configurable:!0,value:r})})(s?s.getRootNode():document)}();
|
|
49
|
1239 </script></foreignObject></svg></div><div class="bespoke-marp-note" data-index="5" tabindex="0"><p>---
|
|
|
1240 # オンプレミス環境
|
|
|
1241
|
|
|
1242 - 汎用サーバ x 4
|
|
|
1243 - ディスクサーバ x 2
|
|
|
1244
|
|
|
1245 | | |
|
|
|
1246 | :---: | :---: |
|
|
|
1247 | CPU | Intel Xeon Gold 6238 (2.10GHz/22Core) |
|
|
|
1248 | GPU | Nvidia Tesla V100S |
|
|
|
1249 | メモリ | 512GB |
|
|
|
1250 | SAS SSD | 5TB |
|
|
|
1251 | NVMe SSD | 1.5TB |</p></div><script>!function(){"use strict";var e=function(e,t){var n,r=1===(e.parent||e).nodeType?e.parent||e:document.querySelector(e.parent||e),s=[].filter.call("string"==typeof e.slides?r.querySelectorAll(e.slides):e.slides||r.children,(function(e){return"SCRIPT"!==e.nodeName})),a={},i=function(e,t){return(t=t||{}).index=s.indexOf(e),t.slide=e,t},o=function(e,t){a[e]=(a[e]||[]).filter((function(e){return e!==t}))},l=function(e,t){return(a[e]||[]).reduce((function(e,n){return e&&!1!==n(t)}),!0)},c=function(e,t){s[e]&&(n&&l("deactivate",i(n,t)),n=s[e],l("activate",i(n,t)))},d=function(e,t){var r=s.indexOf(n)+e;l(e>0?"next":"prev",i(n,t))&&c(r,t)},u={off:o,on:function(e,t){return(a[e]||(a[e]=[])).push(t),o.bind(null,e,t)},fire:l,slide:function(e,t){if(!arguments.length)return s.indexOf(n);l("slide",i(s[e],t))&&c(e,t)},next:d.bind(null,1),prev:d.bind(null,-1),parent:r,slides:s,destroy:function(e){l("destroy",i(n,e)),a={}}};return(t||[]).forEach((function(e){e(u)})),n||c(0),u};function t(e){e.parent.classList.add("bespoke-marp-parent"),e.slides.forEach((e=>e.classList.add("bespoke-marp-slide"))),e.on("activate",(t=>{const n=t.slide,r=!n.classList.contains("bespoke-marp-active");e.slides.forEach((e=>{e.classList.remove("bespoke-marp-active"),e.setAttribute("aria-hidden","true")})),n.classList.add("bespoke-marp-active"),n.removeAttribute("aria-hidden"),r&&(n.classList.add("bespoke-marp-active-ready"),document.body.clientHeight,n.classList.remove("bespoke-marp-active-ready"))}))}function n(e){let t=0,n=0;Object.defineProperty(e,"fragments",{enumerable:!0,value:e.slides.map((e=>[null,...e.querySelectorAll("[data-marpit-fragment]")]))});const r=r=>void 0!==e.fragments[t][n+r],s=(r,s)=>{t=r,n=s,e.fragments.forEach(((e,t)=>{e.forEach(((e,n)=>{if(null==e)return;const a=t<r||t===r&&n<=s;e.setAttribute("data-bespoke-marp-fragment",a?"active":"inactive"),t===r&&n===s?e.setAttribute("data-bespoke-marp-current-fragment","current"):e.removeAttribute("data-bespoke-marp-current-fragment")}))})),e.fragmentIndex=s;const a={slide:e.slides[r],index:r,fragments:e.fragments[r],fragmentIndex:s};e.fire("fragment",a)};e.on("next",(({fragment:a=!0})=>{if(a){if(r(1))return s(t,n+1),!1;const a=t+1;e.fragments[a]&&s(a,0)}else{const r=e.fragments[t].length;if(n+1<r)return s(t,r-1),!1;const a=e.fragments[t+1];a&&s(t+1,a.length-1)}})),e.on("prev",(({fragment:a=!0})=>{if(r(-1)&&a)return s(t,n-1),!1;const i=t-1;e.fragments[i]&&s(i,e.fragments[i].length-1)})),e.on("slide",(({index:t,fragment:n})=>{let r=0;if(void 0!==n){const s=e.fragments[t];if(s){const{length:e}=s;r=-1===n?e-1:Math.min(Math.max(n,0),e-1)}}s(t,r)})),s(0,0)}
|
|
46
|
1252 /*!
|
|
|
1253 * screenfull
|
|
|
1254 * v5.0.2 - 2020-02-13
|
|
|
1255 * (c) Sindre Sorhus; MIT License
|
|
|
1256 */
|
|
|
1257 var r,s=(function(e){!function(){var t="undefined"!=typeof window&&void 0!==window.document?window.document:{},n=e.exports,r=function(){for(var e,n=[["requestFullscreen","exitFullscreen","fullscreenElement","fullscreenEnabled","fullscreenchange","fullscreenerror"],["webkitRequestFullscreen","webkitExitFullscreen","webkitFullscreenElement","webkitFullscreenEnabled","webkitfullscreenchange","webkitfullscreenerror"],["webkitRequestFullScreen","webkitCancelFullScreen","webkitCurrentFullScreenElement","webkitCancelFullScreen","webkitfullscreenchange","webkitfullscreenerror"],["mozRequestFullScreen","mozCancelFullScreen","mozFullScreenElement","mozFullScreenEnabled","mozfullscreenchange","mozfullscreenerror"],["msRequestFullscreen","msExitFullscreen","msFullscreenElement","msFullscreenEnabled","MSFullscreenChange","MSFullscreenError"]],r=0,s=n.length,a={};r<s;r++)if((e=n[r])&&e[1]in t){for(r=0;r<e.length;r++)a[n[0][r]]=e[r];return a}return!1}(),s={change:r.fullscreenchange,error:r.fullscreenerror},a={request:function(e){return new Promise(function(n,s){var a=function(){this.off("change",a),n()}.bind(this);this.on("change",a);var i=(e=e||t.documentElement)[r.requestFullscreen]();i instanceof Promise&&i.then(a).catch(s)}.bind(this))},exit:function(){return new Promise(function(e,n){if(this.isFullscreen){var s=function(){this.off("change",s),e()}.bind(this);this.on("change",s);var a=t[r.exitFullscreen]();a instanceof Promise&&a.then(s).catch(n)}else e()}.bind(this))},toggle:function(e){return this.isFullscreen?this.exit():this.request(e)},onchange:function(e){this.on("change",e)},onerror:function(e){this.on("error",e)},on:function(e,n){var r=s[e];r&&t.addEventListener(r,n,!1)},off:function(e,n){var r=s[e];r&&t.removeEventListener(r,n,!1)},raw:r};r?(Object.defineProperties(a,{isFullscreen:{get:function(){return Boolean(t[r.fullscreenElement])}},element:{enumerable:!0,get:function(){return t[r.fullscreenElement]}},isEnabled:{enumerable:!0,get:function(){return Boolean(t[r.fullscreenEnabled])}}}),n?e.exports=a:window.screenfull=a):n?e.exports={isEnabled:!1}:window.screenfull={isEnabled:!1}}()}(r={exports:{}},r.exports),r.exports);function a(e){e.fullscreen=()=>{s.isEnabled&&s.toggle(document.body)},document.addEventListener("keydown",(t=>{70!==t.which&&122!==t.which||t.altKey||t.ctrlKey||t.metaKey||!s.isEnabled||(e.fullscreen(),t.preventDefault())}))}function i(e=2e3){return t=>{let n;function r(){n&&clearTimeout(n),n=setTimeout((()=>{t.parent.classList.add("bespoke-marp-inactive"),t.fire("marp-inactive")}),e),t.parent.classList.contains("bespoke-marp-inactive")&&(t.parent.classList.remove("bespoke-marp-inactive"),t.fire("marp-active"))}document.addEventListener("mousedown",r),document.addEventListener("mousemove",r),document.addEventListener("touchend",r),setTimeout(r,0)}}const o=["AUDIO","BUTTON","INPUT","SELECT","TEXTAREA","VIDEO"];function l(e){e.parent.addEventListener("keydown",(e=>{if(!e.target)return;const t=e.target;(o.includes(t.nodeName)||"true"===t.contentEditable)&&e.stopPropagation()}))}function c(e){window.addEventListener("load",(()=>{for(const t of e.slides){const e=t.querySelector("[data-marp-fitting]")?"":"hideable";t.setAttribute("data-bespoke-marp-load",e)}}))}var d;function u({interval:e=200}={}){return t=>{document.addEventListener("keydown",(e=>{if(32===e.which&&e.shiftKey)t.prev();else if(33===e.which||37===e.which||38===e.which)t.prev({fragment:!e.shiftKey});else if(32!==e.which||e.shiftKey)if(34===e.which||39===e.which||40===e.which)t.next({fragment:!e.shiftKey});else if(35===e.which)t.slide(t.slides.length-1,{fragment:-1});else{if(36!==e.which)return;t.slide(0)}else t.next();e.preventDefault()}));let n,r,s=0;t.parent.addEventListener("wheel",(a=>{let i=!1;const o=(e,t)=>{e&&(i=i||function(e,t){return function(e,t){const n=t===d.X?"Width":"Height";return e[`client${n}`]<e[`scroll${n}`]}(e,t)&&function(e,t){const{overflow:n}=e,r=e[`overflow${t}`];return"auto"===n||"scroll"===n||"auto"===r||"scroll"===r}(getComputedStyle(e),t)}(e,t)),(null==e?void 0:e.parentElement)&&o(e.parentElement,t)};if(0!==a.deltaX&&o(a.target,d.X),0!==a.deltaY&&o(a.target,d.Y),i)return;a.preventDefault(),r&&clearTimeout(r),r=setTimeout((()=>{n=0}),e);const l=Date.now()-s<e,c=Math.sqrt(Math.pow(a.deltaX,2)+Math.pow(a.deltaY,2)),u=c<=n;if(n=c,l||u)return;let f;(a.deltaX>0||a.deltaY>0)&&(f="next"),(a.deltaX<0||a.deltaY<0)&&(f="prev"),f&&(t[f](),s=Date.now())}))}}!function(e){e.X="X",e.Y="Y"}(d||(d={}));const f=(...e)=>history.replaceState(...e),m="data-bespoke-view";var p;!function(e){e.Normal="",e.Presenter="presenter",e.Next="next"}(p||(p={}));const h=(e,{protocol:t,host:n,pathname:r,hash:s}=location)=>{const a=e.toString();return`${t}//${n}${r}${a?"?":""}${a}${s}`},g=()=>{switch(document.body.getAttribute(m)){case p.Normal:return p.Normal;case p.Presenter:return p.Presenter;case p.Next:return p.Next;default:throw new Error("View mode is not assigned.")}},v=e=>new URLSearchParams(location.search).get(e),b=(e,t={})=>{const n=Object.assign({location:location,setter:f},t),r=new URLSearchParams(n.location.search);for(const t of Object.keys(e)){const n=e[t];"string"==typeof n?r.set(t,n):r.delete(t)}try{n.setter(null,document.title,h(r,n.location))}catch(e){console.error(e)}},w={available:(()=>{try{return localStorage.setItem("bespoke-marp","bespoke-marp"),localStorage.removeItem("bespoke-marp"),!0}catch(e){return console.warn("Warning: Using localStorage is restricted in the current host so some features may not work."),!1}})(),get:e=>{try{return localStorage.getItem(e)}catch(e){return null}},set:(e,t)=>{try{return localStorage.setItem(e,t),!0}catch(e){return!1}},remove:e=>{try{return localStorage.removeItem(e),!0}catch(e){return!1}}};function y(e=".bespoke-marp-osc"){const t=document.querySelector(e);if(!t)return()=>{};const n=(e,n)=>{t.querySelectorAll(`[data-bespoke-marp-osc=${JSON.stringify(e)}]`).forEach(n)};return s.isEnabled||n("fullscreen",(e=>e.style.display="none")),w.available||n("presenter",(e=>{e.disabled=!0,e.title="Presenter view is disabled due to restricted localStorage."})),e=>{t.addEventListener("click",(t=>{if(t.target instanceof HTMLElement){const{bespokeMarpOsc:n}=t.target.dataset;switch(n&&t.target.blur(),n){case"next":e.next({fragment:!t.shiftKey});break;case"prev":e.prev({fragment:!t.shiftKey});break;case"fullscreen":"function"==typeof e.fullscreen&&s.isEnabled&&e.fullscreen();break;case"presenter":e.openPresenterView()}}})),e.parent.appendChild(t),e.on("activate",(({index:t})=>{n("page",(n=>n.textContent=`Page ${t+1} of ${e.slides.length}`))})),e.on("fragment",(({index:t,fragments:r,fragmentIndex:s})=>{n("prev",(e=>e.disabled=0===t&&0===s)),n("next",(n=>n.disabled=t===e.slides.length-1&&s===r.length-1))})),e.on("marp-active",(()=>t.removeAttribute("aria-hidden"))),e.on("marp-inactive",(()=>t.setAttribute("aria-hidden","true"))),s.isEnabled&&s.onchange((()=>n("fullscreen",(e=>e.classList.toggle("exit",s.isEnabled&&s.isFullscreen)))))}}function x(){const e=Math.max(Math.floor(.85*window.innerWidth),640),t=Math.max(Math.floor(.85*window.innerHeight),360);return window.open(this.presenterUrl,`bespoke-marp-presenter-${this.syncKey}`,`width=${e},height=${t},menubar=no,toolbar=no`)}function k(){const e=new URLSearchParams(location.search);return e.set("view","presenter"),e.set("sync",this.syncKey),h(e)}var E=["area","base","br","col","command","embed","hr","img","input","keygen","link","meta","param","source","track","wbr"];let L=e=>String(e).replace(/[&<>"']/g,(e=>`&${S[e]};`)),S={"&":"amp","<":"lt",">":"gt",'"':"quot","'":"apos"},I="dangerouslySetInnerHTML",P={className:"class",htmlFor:"for"},M={};function N(e,t){let n=[],r="";t=t||{};for(let e=arguments.length;e-- >2;)n.push(arguments[e]);if("function"==typeof e)return t.children=n.reverse(),e(t);if(e){if(r+="<"+e,t)for(let e in t)!1!==t[e]&&null!=t[e]&&e!==I&&(r+=` ${P[e]?P[e]:L(e)}="${L(t[e])}"`);r+=">"}if(-1===E.indexOf(e)){if(t[I])r+=t[I].__html;else for(;n.length;){let e=n.pop();if(e)if(e.pop)for(let t=e.length;t--;)n.push(e[t]);else r+=!0===M[e]?e:L(e)}r+=e?`</${e}>`:""}return M[r]=!0,r}const F=({children:e})=>N(null,null,...e),$="bespoke-marp-presenter-container",O="bespoke-marp-presenter-next",q="bespoke-marp-presenter-next-container",C="bespoke-marp-presenter-note-container",T="bespoke-marp-presenter-info-container",A="bespoke-marp-presenter-info-page",K="bespoke-marp-presenter-info-page-text",j="bespoke-marp-presenter-info-page-prev",R="bespoke-marp-presenter-info-page-next",U="bespoke-marp-presenter-info-time",D="bespoke-marp-presenter-info-timer";function V(e){const{title:t}=document;document.title="[Presenter view]"+(t?` - ${t}`:"");const n={},r=e=>(n[e]=n[e]||document.querySelector(`.${e}`),n[e]);document.body.appendChild((e=>{const t=document.createElement("div");return t.className=$,t.appendChild(e),t.insertAdjacentHTML("beforeend",N(F,null,N("div",{class:q},N("iframe",{class:O,src:"?view=next"})),N("div",{class:C}),N("div",{class:T},N("div",{class:A},N("button",{class:j,tabindex:"-1",title:"Previous"},"Previous"),N("span",{class:K}),N("button",{class:R,tabindex:"-1",title:"Next"},"Next")),N("time",{class:U,title:"Current time"}),N("div",{class:D})))),t})(e.parent)),(e=>{r(q).addEventListener("click",(()=>e.next()));const t=r(O),n=(s=t,(e,t)=>{var n;return null===(n=s.contentWindow)||void 0===n?void 0:n.postMessage(`navigate:${e},${t}`,"null"===window.origin?"*":window.origin)});var s;t.addEventListener("load",(()=>{r(q).classList.add("active"),n(e.slide(),e.fragmentIndex),e.on("fragment",(({index:e,fragmentIndex:t})=>n(e,t)))}));const a=document.querySelectorAll(".bespoke-marp-note");a.forEach((e=>{e.addEventListener("keydown",(e=>e.stopPropagation())),r(C).appendChild(e)})),e.on("activate",(()=>a.forEach((t=>t.classList.toggle("active",t.dataset.index==e.slide()))))),e.on("activate",(({index:t})=>{r(K).textContent=`${t+1} / ${e.slides.length}`}));const i=r(j),o=r(R);i.addEventListener("click",(t=>{i.blur(),e.prev({fragment:!t.shiftKey})})),o.addEventListener("click",(t=>{o.blur(),e.next({fragment:!t.shiftKey})})),e.on("fragment",(({index:t,fragments:n,fragmentIndex:r})=>{i.disabled=0===t&&0===r,o.disabled=t===e.slides.length-1&&r===n.length-1}));const l=()=>r(U).textContent=(new Date).toLocaleTimeString();l(),setInterval(l,250)})(e)}function X(e){const t=g();return t===p.Next&&e.appendChild(document.createElement("span")),e=>{t===p.Normal&&function(e){if(!(e=>e.syncKey&&"string"==typeof e.syncKey)(e))throw new Error("The current instance of Bespoke.js is invalid for Marp bespoke presenter plugin.");Object.defineProperties(e,{openPresenterView:{enumerable:!0,value:x},presenterUrl:{enumerable:!0,get:k}}),w.available&&document.addEventListener("keydown",(t=>{80!==t.which||t.altKey||t.ctrlKey||t.metaKey||(t.preventDefault(),e.openPresenterView())}))}(e),t===p.Presenter&&V(e),t===p.Next&&function(e){const t=t=>{if(t.origin!==window.origin)return;const[n,r]=t.data.split(":");if("navigate"===n){const[t,n]=r.split(",");let s=Number.parseInt(t,10),a=Number.parseInt(n,10)+1;a>=e.fragments[s].length&&(s+=1,a=0),e.slide(s,{fragment:a})}};window.addEventListener("message",t),e.on("destroy",(()=>window.removeEventListener("message",t)))}(e)}}function Y(e){e.on("activate",(t=>{document.querySelectorAll(".bespoke-progress-parent > .bespoke-progress-bar").forEach((n=>{n.style.flexBasis=100*t.index/(e.slides.length-1)+"%"}))}))}const B=e=>{const t=Number.parseInt(e,10);return Number.isNaN(t)?null:t};function z(e={}){const t=Object.assign({history:!0},e);return e=>{let n=!0;const r=e=>{const t=n;try{return n=!0,e()}finally{n=t}},s=(t={fragment:!0})=>{((t,n)=>{const{fragments:r,slides:s}=e,a=Math.max(0,Math.min(t,s.length-1)),i=Math.max(0,Math.min(n||0,r[a].length-1));a===e.slide()&&i===e.fragmentIndex||e.slide(a,{fragment:i})})((B(location.hash.slice(1))||1)-1,t.fragment?B(v("f")||""):null)};e.on("fragment",(({index:e,fragmentIndex:r})=>{n||b({f:0===r||r.toString()},{location:Object.assign(Object.assign({},location),{hash:`#${e+1}`}),setter:(...e)=>t.history?history.pushState(...e):history.replaceState(...e)})})),setTimeout((()=>{s(),window.addEventListener("hashchange",(()=>r((()=>{s({fragment:!1}),b({f:void 0})})))),window.addEventListener("popstate",(()=>{n||r((()=>s()))})),n=!1}),0)}}let H;function W(e={}){const t=e.key||((e=21)=>{let t="",n=crypto.getRandomValues(new Uint8Array(e));for(;e--;){let r=63&n[e];t+=r<36?r.toString(36):r<62?(r-26).toString(36).toUpperCase():r<63?"_":"-"}return t})(),n=`bespoke-marp-sync-${t}`,r=()=>{const e=w.get(n);return e?JSON.parse(e):Object.create(null)},s=e=>{const t=r(),s=Object.assign(Object.assign({},t),e(t));return w.set(n,JSON.stringify(s)),s};return s((e=>({reference:(e.reference||0)+1}))),e=>{Object.defineProperty(e,"syncKey",{value:t,enumerable:!0});let a=!0;setTimeout((()=>{e.on("fragment",(e=>{a&&s((()=>({index:e.index,fragmentIndex:e.fragmentIndex})))}))}),0),window.addEventListener("storage",(t=>{if(t.key===n&&t.oldValue&&t.newValue){const n=JSON.parse(t.oldValue),r=JSON.parse(t.newValue);if(n.index!==r.index||n.fragmentIndex!==r.fragmentIndex)try{a=!1,e.slide(r.index,{fragment:r.fragmentIndex})}finally{a=!0}}})),e.on("destroy",(()=>{const{reference:e}=r();void 0===e||e<=1?w.remove(n):s((()=>({reference:e-1})))}))}}function J({slope:e=Math.tan(-35*Math.PI/180),swipeThreshold:t=30}={}){return n=>{let r;const s=n.parent,a=e=>{const t=s.getBoundingClientRect();return{x:e.pageX-(t.left+t.right)/2,y:e.pageY-(t.top+t.bottom)/2}};s.addEventListener("touchstart",(e=>{r=1===e.touches.length?a(e.touches[0]):void 0}),{passive:!0}),s.addEventListener("touchmove",(e=>{if(r)if(1===e.touches.length){e.preventDefault();const t=a(e.touches[0]),n=t.x-r.x,s=t.y-r.y;r.delta=Math.sqrt(Math.pow(Math.abs(n),2)+Math.pow(Math.abs(s),2)),r.radian=Math.atan2(n,s)}else r=void 0})),s.addEventListener("touchend",(s=>{if(r){if(r.delta&&r.delta>=t&&r.radian){let t=r.radian-e;t=(t+Math.PI)%(2*Math.PI)-Math.PI,n[t<0?"next":"prev"](),s.stopPropagation()}r=void 0}}),{passive:!0})}}
|
|
|
1258 /*! *****************************************************************************
|
|
|
1259 Copyright (c) Microsoft Corporation.
|
|
|
1260
|
|
|
1261 Permission to use, copy, modify, and/or distribute this software for any
|
|
|
1262 purpose with or without fee is hereby granted.
|
|
|
1263
|
|
|
1264 THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
|
|
|
1265 REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
|
|
|
1266 AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
|
|
|
1267 INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
|
|
|
1268 LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
|
|
|
1269 OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
|
|
|
1270 PERFORMANCE OF THIS SOFTWARE.
|
|
|
1271 ***************************************************************************** */function _(e,t,n,r){return new(n||(n=Promise))((function(s,a){function i(e){try{l(r.next(e))}catch(e){a(e)}}function o(e){try{l(r.throw(e))}catch(e){a(e)}}function l(e){var t;e.done?s(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(i,o)}l((r=r.apply(e,t||[])).next())}))}const G=()=>(void 0===H&&(H="wakeLock"in navigator&&navigator.wakeLock),H),Q=()=>_(void 0,void 0,void 0,(function*(){const e=G();if(e)try{const t=yield e.request("screen");return t.addEventListener("release",(()=>{console.debug("[Marp CLI] Wake Lock was released")})),console.debug("[Marp CLI] Wake Lock is active"),t}catch(e){console.warn(e)}return null}));function Z(){return _(this,void 0,void 0,(function*(){if(!G())return;let e;const t=()=>{e&&"visible"===document.visibilityState&&Q()};return document.addEventListener("visibilitychange",t),document.addEventListener("fullscreenchange",t),e=yield Q(),e}))}const ee=[p.Normal,p.Presenter,p.Next];!function(r=document.getElementById("p")){document.body.setAttribute(m,(()=>{switch(v("view")){case"next":return p.Next;case"presenter":return p.Presenter;default:return p.Normal}})());const s=(e=>{const t=v(e);return b({[e]:void 0}),t})("sync")||void 0,o=!1,d=!0,f=e(r,((...e)=>{const t=ee.findIndex((e=>g()===e));if(t<0)throw new Error("Invalid view");return e.map((([e,n])=>e[t]&&n)).filter((e=>e))})([[d,d,o],W({key:s})],[[d,d,d],X(r)],[[d,d,o],l],[[d,d,d],t],[[d,o,o],i()],[[d,d,d],c],[[d,d,d],z({history:!1})],[[d,d,o],u()],[[d,d,o],a],[[d,o,o],Y],[[d,d,o],J()],[[d,o,o],y()],[[d,d,d],n],[[d,d,o],Z]));window.addEventListener("beforeunload",(()=>b({sync:f.syncKey}))),window.addEventListener("unload",(()=>f.destroy()))}()}();</script></body></html> |
