2022-11-22 18:21:34 +09:00
<!DOCTYPE html> < html lang = "C" > < head > < title > CHIRIMEN ハンズオン< / title > < meta property = "og:title" content = "CHIRIMEN ハンズオン" > < 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 > @ m e d i a s c r e e n { b o d y [ d a t a - b e s p o k e - v i e w = " " ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n , b o d y [ d a t a - b e s p o k e - v i e w = n e x t ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n , b o d y [ d a t a - b e s p o k e - v i e w = p r e s e n t e r ] . b e s p o k e - m a r p - p r e s e n t e r - c o n t a i n e r . b e s p o k e - m a r p - p r e s e n t e r - i n f o - c o n t a i n e r b u t t o n , b o d y [ d a t a - b e s p o k e - v i e w = p r e s e n t e r ] . b e s p o k e - m a r p - p r e s e n t e r - c o n t a i n e r . b e s p o k e - m a r p - p r e s e n t e r - n o t e - c o n t a i n e r b u t t o n { - w e b k i t - t a p - h i g h l i g h t - c o l o r : t r a n s p a r e n t ; - w e b k i t - a p p e a r a n c e : n o n e ; a p p e a r a n c e : n o n e ; b a c k g r o u n d - c o l o r : t r a n s p a r e n t ; b o r d e r : 0 ; c o l o r : i n h e r i t ; c u r s o r : p o i n t e r ; f o n t - s i z e : i n h e r i t ; o p a c i t y : . 8 ; o u t l i n e : n o n e ; p a d d i n g : 0 ; t r a n s i t i o n : o p a c i t y . 2 s l i n e a r } b o d y [ d a t a - b e s p o k e - v i e w = " " ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n : d i s a b l e d , b o d y [ d a t a - b e s p o k e - v i e w = n e x t ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n : d i s a b l e d , b o d y [ d a t a - b e s p o k e - v i e w = p r e s e n t e r ] . b e s p o k e - m a r p - p r e s e n t e r - c o n t a i n e r . b e s p o k e - m a r p - p r e s e n t e r - i n f o - c o n t a i n e r b u t t o n : d i s a b l e d , b o d y [ d a t a - b e s p o k e - v i e w = p r e s e n t e r ] . b e s p o k e - m a r p - p r e s e n t e r - c o n t a i n e r . b e s p o k e - m a r p - p r e s e n t e r - n o t e - c o n t a i n e r b u t t o n : d i s a b l e d { c u r s o r : n o t - a l l o w e d ; o p a c i t y : . 1 5 ! i m p o r t a n t } b o d y [ d a t a - b e s p o k e - v i e w = " " ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n : h o v e r , b o d y [ d a t a - b e s p o k e - v i e w = n e x t ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n : h o v e r , b o d y [ d a t a - b e s p o k e - v i e w = p r e s e n t e r ] . b e s p o k e - m a r p - p r e s e n t e r - c o n t a i n e r . b e s p o k e - m a r p - p r e s e n t e r - i n f o - c o n t a i n e r b u t t o n : h o v e r , b o d y [ d a t a - b e s p o k e - v i e w = p r e s e n t e r ] . b e s p o k e - m a r p - p r e s e n t e r - c o n t a i n e r . b e s p o k e - m a r p - p r e s e n t e r - n o t e - c o n t a i n e r b u t t o n : h o v e r { o p a c i t y : 1 } b o d y [ d a t a - b e s p o k e - v i e w = " " ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n : h o v e r : a c t i v e , b o d y [ d a t a - b e s p o k e - v i e w = n e x t ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n : h o v e r : a c t i v e , b o d y [ d a t a - b e s p o k e - v i e w = p r e s e n t e r ] . b e s p o k e - m a r p - p r e s e n t e r - c o n t a i n e r . b e s p o k e - m a r p - p r e s e n t e r - i n f o - c o n t a i n e r b u t t o n : h o v e r : a c t i v e , b o d y [ d a t a - b e s p o k e - v i e w = p r e s e n t e r ] . b e s p o k e - m a r p - p r e s e n t e r - c o n t a i n e r . b e s p o k e - m a r p - p r e s e n t e r - n o t e - c o n t a i n e r b u t t o n : h o v e r : a c t i v e { o p a c i t y : . 6 } b o d y [ d a t a - b e s p o k e - v i e w = " " ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n : h o v e r : n o t ( : d i s a b l e d ) , b o d y [ d a t a - b e s p o k e - v i e w = n e x t ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n : h o v e r : n o t ( : d i s a b l e d ) , b o d y [ d a t a - b e s p o k e - v i e w = p r e s e n t e r ] . b e s p o k e - m a r p - p r e s e n t e r - c o n t a i n e r . b e s p o k e - m a r p - p r e s e n t e r - i n f o - c o n t a i n e r b u t t o n : h o v e r : n o t ( : d i s a b l e d ) , b o d y [ d a t a - b e s p o k e - v i e w = p r e s e n t e r ] . b e s p o k e - m a r p - p r e s e n t e r - c o n t a i n e r . b e s p o k e - m a r p - p r e s e n t e r - n o t e - c o n t a i n e r b u t t o n : h o v e r : n o t ( : d i s a b l e d ) { t r a n s i t i o n : n o n e } b o d y [ d a t a - b e s p o k e - v i e w = " " ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n [ d a t a - b e s p o k e - m a r p - o s c = p r e v ] , b o d y [ d a t a - b e s p o k e - v i e w = n e x t ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n [ d a t a - b e s p o k e - m a r p - o s c = p r e v ] , b o d y [ d a t a - b e s p o k e - v i e w = p r e s e n t e r ] . b e s p o k e - m a r p - p r e s e n t e r - c o n t a i n e r . b e s p o k e - m a r p - p r e s e n t e r - i n f o - c o n t a i n e r b u t t o n . b e s p o k e - m a r p - p r e s e n t e r - i n f o - p a g e - p r e v { b a c k g r o u n d : t r a n s p a r e n t u r l ( " d a t a : i m a g e / s v g + x m l ; b a s e 6 4 , P H N 2 Z y B 4 b W x u c z 0 i a H R 0 c D o v L 3 d 3 d y 5 3 M y 5 v c m c v M j A w M C 9 z d m c i I H Z p Z X d C b 3 g 9 I j A g M C A x M D A g M T A w I j 4 8 c G F 0 a C B m a W x s P S J u b 2 5 l I i B z d H J v a 2 U 9 I i N m Z m Y i I H N 0 c m 9 r Z S 1 s a W 5 l Y 2 F w P S J y b 3 V u Z C I g c 3 R y b 2 t l L W x p b m V q b 2 l u P S J y b 3 V u Z C I g c 3 R y b 2 t l L X d p Z H R o P S I 1 I i B k P S J N N j g g O T A g M j g g N T B s N D A t N D A i L z 4 8 L 3 N 2 Z z 4 = " ) n o - r e p e a t 5 0 % ; b a c k g r o u n d - s i z e : c o n t a i n ; o v e r f l o w : h i d d e n ; t e x t - i n d e n t : 1 0 0 % ; w h i t e - s p a c e : n o w r a p } b o d y [ d a t a - b e s p o k e - v i e w = " " ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n [ d a t a - b e s p o k e - m a r p - o s c = n e x t ] , b o d y [ d a t a - b e s p o k e - v i e w = n e x t ] . b e s p o k e - m a r p - p a r e n t > . b e s p o k e - m a r p - o s c > b u t t o n [ d a t a - b e s p o k e - m a r p - o s c = n e x t ] , b o d y [ d a t a - b e s p o k e - v i e w = p r e s e n t e r ] . b e s p o k e - m a r p - p r e s e n t e r - c o n t a i n e r . b e s p o k e - m a r p - p r e s e n t e r - i n f o - c o n t a i n e r b u t t o n . b e s p o k e - m a r p - p r e s e n t e r - i n f o - p a g e - n e x t { b a c k g r o u n d : t r a n s p a r e n t u r l ( " d a t a : i m a g e / s v g + x m l ; b a s e 6 4 , P H N 2 Z y B 4 b W x u c z 0 i a H R 0 c D o v L 3 d 3 d y 5 3 M y 5 v c m c v M j A w M C 9 z d m c i I H Z p Z X d C b 3 g 9 I j A g M C A x M D A g M T A w I j
* Marp default theme.
*
* @theme default
* @author Yuki Hattori
*
* @auto-scaling true
* @size 16:9 1280px 720px
* @size 4:3 960px 720px
*/div#p>svg>foreignObject>section{--color-prettylights-syntax-comment:#6e7781;--color-prettylights-syntax-constant:#0550ae;--color-prettylights-syntax-entity:#8250df;--color-prettylights-syntax-storage-modifier-import:#24292f;--color-prettylights-syntax-entity-tag:#116329;--color-prettylights-syntax-keyword:#cf222e;--color-prettylights-syntax-string:#0a3069;--color-prettylights-syntax-variable:#953800;--color-prettylights-syntax-brackethighlighter-unmatched:#82071e;--color-prettylights-syntax-invalid-illegal-text:#f6f8fa;--color-prettylights-syntax-invalid-illegal-bg:#82071e;--color-prettylights-syntax-carriage-return-text:#f6f8fa;--color-prettylights-syntax-carriage-return-bg:#cf222e;--color-prettylights-syntax-string-regexp:#116329;--color-prettylights-syntax-markup-list:#3b2300;--color-prettylights-syntax-markup-heading:#0550ae;--color-prettylights-syntax-markup-italic:#24292f;--color-prettylights-syntax-markup-bold:#24292f;--color-prettylights-syntax-markup-deleted-text:#82071e;--color-prettylights-syntax-markup-deleted-bg:#ffebe9;--color-prettylights-syntax-markup-inserted-text:#116329;--color-prettylights-syntax-markup-inserted-bg:#dafbe1;--color-prettylights-syntax-markup-changed-text:#953800;--color-prettylights-syntax-markup-changed-bg:#ffd8b5;--color-prettylights-syntax-markup-ignored-text:#eaeef2;--color-prettylights-syntax-markup-ignored-bg:#0550ae;--color-prettylights-syntax-meta-diff-range:#8250df;--color-prettylights-syntax-brackethighlighter-angle:#57606a;--color-prettylights-syntax-sublimelinter-gutter-mark:#8c959f;--color-prettylights-syntax-constant-other-reference-link:#0a3069;--color-fg-default:#24292f;--color-fg-muted:#57606a;--color-fg-subtle:#6e7781;--color-canvas-default:#fff;--color-canvas-subtle:#f6f8fa;--color-border-default:#d0d7de;--color-border-muted:#d8dee4;--color-neutral-muted:rgba(175,184,193,.2);--color-accent-fg:#0969da;--color-accent-emphasis:#0969da;--color-attention-subtle:#fff8c5;--color-danger-fg:#cf222e;color-scheme:light}div#p>svg>foreignObject>section:where(.invert){--color-prettylights-syntax-comment:#8b949e;--color-prettylights-syntax-constant:#79c0ff;--color-prettylights-syntax-entity:#d2a8ff;--color-prettylights-syntax-storage-modifier-import:#c9d1d9;--color-prettylights-syntax-entity-tag:#7ee787;--color-prettylights-syntax-keyword:#ff7b72;--color-prettylights-syntax-string:#a5d6ff;--color-prettylights-syntax-variable:#ffa657;--color-prettylights-syntax-brackethighlighter-unmatched:#f85149;--color-prettylights-syntax-invalid-illegal-text:#f0f6fc;--color-prettylights-syntax-invalid-illegal-bg:#8e1519;--color-prettylights-syntax-carriage-return-text:#f0f6fc;--color-prettylights-syntax-carriage-return-bg:#b62324;--color-prettylights-syntax-string-regexp:#7ee787;--color-prettylights-syntax-markup-list:#f2cc60;--color-prettylights-syntax-markup-heading:#1f6feb;--color-prettylights-syntax-markup-italic:#c9d1d9;--color-prettylights-syntax-markup-bold:#c9d1d9;--color-prettylights-syntax-markup-deleted-text:#ffdcd7;--color-prettylights-syntax-markup-deleted-bg:#67060c;--color-prettylights-syntax-markup-inserted-text:#aff5b4;--color-prettylights-syntax-markup-inserted-bg:#033a16;--color-prettylights-syntax-markup-changed-text:#ffdfb6;--color-prettylights-syntax-markup-changed-bg:#5a1e02;--color-prettylights-syntax-markup-ignored-text:#c9d1d9;--color-prettylights-syntax-markup-ignored-bg:#1158c7;--color-prettylights-syntax-meta-diff-range:#d2a8ff;--color-prettylights-syntax-brackethighlighter-angle:#8b949e;--color-prettylights-syntax-sublimelinter-gutter-mark:#484f58;--color-prettylights-syntax-constant-other-reference-link:#a5d6ff;--color-fg-default:#c9d1d9;--color-fg-muted:#8b949e;--color-fg-subtle:#484f58;--color-canvas-default:#0d1117;--color-canvas-subtle:#161b22;--color-border-default:#30363d;--color-border-muted:#21262d;--color-neutral-muted:hsla(215,8%,47%,.4);--color-accent-fg:#58a6ff;--color-accent-emphasis:#1f6feb;--color-attention-subtle:rgba(187,128,9,.15);--color-danger-fg:#f85149;color-scheme:dark}div#p>svg>foreignObject>section{-ms-text-size-adjust:100%;-webkit-text
/* content:""; */display:table}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 .absent{color:var(--color-danger-fg)}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 :is(pre,marp-pre),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 table,div#p>svg>foreignObject>section ul{margin-bottom:16px;margin-top:0}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 sup>a:before{content:"["}div#p>svg>foreignObject>section sup>a:after{content:"]"}div#p>svg>foreignObject>section :is(h1,marp-h1) .octicon-link,div#p>svg>foreignObject>section :is(h2,marp-h2) .octicon-link,div#p>svg>foreignObject>section :is(h3,marp-h3) .octicon-link,div#p>svg>foreignObject>section :is(h4,marp-h4) .octicon-link,div#p>svg>foreignObject>section :is(h5,marp-h5) .octicon-link,div#p>svg>foreignObject>section :is(h6,marp-h6) .octicon-link{color:var(--color-fg-default);vertical-align:middle;visibility:hidden}div#p>svg>foreignObject>section :is(h1,marp-h1):hover .anchor,div#p>svg>foreignObject>section :is(h2,marp-h2):hover .anchor,div#p>svg>foreignObject>section :is(h3,marp-h3):hover .anchor,div#p>svg>foreignObject>section :is(h4,marp-h4):hover .anchor,div#p>svg>foreignObject>section :is(h5,marp-h5):hover .anchor,div#p>svg>foreignObject>section :is(h6,marp-h6):hover .anchor{text-decoration:none}div#p>svg>foreignObject>section :is(h1,marp-h1):hover .anchor .octicon-link,div#p>svg>foreignObject>section :is(h2,marp-h2):hover .anchor .octicon-link,div#p>svg>foreignObject>section :is(h3,marp-h3):hover .anchor .octicon-link,div#p>svg>foreignObject>section :is(h4,marp-h4):hover .anchor .octicon-link,div#p>svg>foreignObject>section :is(h5,marp-h5):hover .anchor .octicon-link,div#p>svg>foreignObject>section :is(h6,marp-h6):hover .anchor .octicon-link{visibility:visible}div#p>svg>foreignObject>section :is(h1,marp-h1) code,div#p>svg>foreignObject>section :is(h1,marp-h1) tt,div#p>svg>foreignObject>section :is(h2,marp-h2) code,div#p>svg>foreignObject>section :is(h2,marp-h2) tt,div#p>svg>foreignObject>section :is(h3,marp-h3) code,div#p>svg>foreignObject>section :is(h3,marp-h3) tt,div#p>svg>foreignObject>section :is(h4,marp-h4) code,div#p>svg>foreignObject>section :is(h4,marp-h4) tt,div#p>svg>foreignObject>section :is(h5,marp-h5) code,div#p>svg>foreignObject>section :is(h5,marp-h5) tt,div#p>svg>foreignObject>section :is(h6,marp-h6) code,div#p>svg>foreignObject>section :is(h6,marp-h6) tt{font-size:inherit;padding:0 .2em}div#p>svg>foreignObject>section ol.no-list,div#p>svg>foreignObject>section ul.no-list{list-style-type:none;padding:0}div#p>svg>foreignObject>section ol[type="1"]{list-style-type:decimal}div#p>svg>foreignObject>section ol[type=a]{list-style-type:lower-alpha}div#p>svg>foreignObject>section ol[type=i]{list-style-type:lower-roman}div#p>svg>foreignObject>section div>ol:not([type]){list-style-type:decimal}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-bottom:0;margin-top:0}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{font-size:1em;font-style:italic;font-weight:600;margin-top:16px;padding:0}div#p>svg>foreignObject>section dl dd{margin-bottom:16px;padding:0 16px}div#p>svg>foreignObject>section table th{font-weight:600}div#p>svg>foreignObject>s
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="1" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h1 > 1 日目< / h1 >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="2" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;" data-marpit-advanced-background="background">< div data-marpit-advanced-background-container = "true" data-marpit-advanced-background-direction = "horizontal" > < figure style = "background-image:url("https://webiotmakers.github.io/static/images/2022/template/ogp.jpg");" > < / figure > < / div > < / section > < / foreignObject > < foreignObject width = "1280" height = "720" > < section id = "2" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="2" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;" data-marpit-advanced-background="content">< / section >
< / foreignObject > < foreignObject width = "1280" height = "720" data-marpit-advanced-background = "pseudo" > < section data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="2" data-marpit-pagination-total="35" style="" data-marpit-advanced-background="pseudo">< / section > < / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "3" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="3" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h1 > CHIRIMEN ハンズオン< / h1 >
< p > 2022-10-08/2022-10-09 in 岡山< / p >
< p > WebDINO Japan シニアエンジニア< br / >
< a href = "https://github.com/kou029w" > 渡邉浩平< / a > < br / >
< img src = "https://github.com/kou029w.png" alt = "" style = "width:200px;" / > < / p >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "4" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="4" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > CHIRIMEN とは< / h2 >
< p > < img src = "https://res.cloudinary.com/chirimen/image/fetch/c_limit,f_auto,q_auto,w_1200/https://tutorial.chirimen.org/raspi/imgs/section0/CHIRIMENforRaspberryPi3.png" alt = "" style = "height:480px;" / > < / p >
< p > Web ブラウザーからハードウェアを制御するプロトタイピング環境< br / >
センサーやモーターなど組み合わせたさまざまなものをつくることができます< / p >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "5" data-paginate = "true" data-footer = "画像の引用元: Web× data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="5" data-marpit-pagination-total="35" style="--paginate:true;--footer:画像の引用元: Web×
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > 作品例< / h2 >
< p > < img src = "./assets/webiotmakers-gallery.dio.png" alt = "" style = "height:550px;" / > < / p >
< footer > 画像の引用元: Web× < a href = "https://webiotmakers.github.io/gallery/" > https://webiotmakers.github.io/gallery/< / a > < / footer >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "6" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="6" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > 本日の流れ< / h2 >
< p > 準備編 (11:20-12:00)< / p >
< ul >
< li > セットアップ< / li >
< / ul >
< p > 基礎編 (13:00-17:00)< / p >
< ul >
< li > L チカしてみよう< / li >
< li > GitHub アカウントの登録< / li >
< li > GPIO に関する基礎知識< / li >
< li > I2C に関する基礎知識< / li >
< / ul >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "7" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="7" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > 本日のゴール< / h2 >
< p > 基礎編< / p >
< ul >
< li > センサーやモーターの基本的な使い方を理解する< / li >
< / ul >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "8" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="8" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > Slack にアクセス (まだの方)< / h2 >
< p > < a href = "https://webiotmakerschallenge.slack.com" > webiotmakerschallenge.slack.com< / a > < / p >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "9" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="9" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > ハンズオン資料< / h2 >
< p > < a href = "https://tutorial.chirimen.org/raspi/" > tutorial.chirimen.org/raspi< / a > < br / >
または< br / >
「chirimen チュートリアル」で検索< / p >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "10" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="10" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > 困ったとき・分からないとき・気になることがあるとき< / h2 >
2023-01-14 15:54:10 +09:00
< p > 会場のスタッフにお気軽にお声がけください 🖐< br / >
(Slack でも OK 👌)< / p >
2022-11-22 18:21:34 +09:00
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "11" data-paginate = "true" data-footer = "https://tutorial.chirimen.org/raspi/section0#section-1" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="11" data-marpit-pagination-total="35" style="--paginate:true;--footer:https://tutorial.chirimen.org/raspi/section0#section-1;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > 機材の確認< / h2 >
< p > 必要なもの< / p >
< ul >
< li > クリアボックス
< ul >
< li > ディスプレイ/HDMI ケーブル/変換アダプター/AC アダプター (Type-C)< / li >
< li > AC アダプター付き電源タップ/Type-C ケーブル< / li >
< li > Raspberry Pi 本体/ヒートシンク< / li >
< li > 有線マウス< / li >
< / ul >
< / li >
< li > キーボード< / li >
< li > CHIRIMEN スターターキット
< ul >
< li > microSD カード< / li >
< / ul >
< / li >
< / ul >
< p > (必要なもの以外はクリアボックスに片付けておきましょう)< / p >
< footer > < a href = "https://tutorial.chirimen.org/raspi/section0#section-1" > https://tutorial.chirimen.org/raspi/section0#section-1< / a > < / footer >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "12" data-paginate = "true" data-footer = "画像の引用元: Get started with your OKdo Pi Kit in a flash - OKdo https://www.okdo.com/getstarted/" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="12" data-marpit-pagination-total="35" style="--paginate:true;--footer:画像の引用元: Get started with your OKdo Pi Kit in a flash - OKdo https://www.okdo.com/getstarted/;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > ヒートシンクの取り付け< / h2 >
< blockquote >
< p > < img src = "https://www.okdo.com/wp-content/uploads/2019/10/1-mount-heatsinks.jpg" alt = "" / > < / p >
< / blockquote >
< footer > 画像の引用元: Get started with your OKdo Pi Kit in a flash - OKdo < a href = "https://www.okdo.com/getstarted/" > https://www.okdo.com/getstarted/< / a > < / footer >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "13" data-paginate = "true" data-footer = "https://tutorial.chirimen.org/raspi/section0#chirimen-for-raspberry-pi--1" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="13" data-marpit-pagination-total="35" style="--paginate:true;--footer:https://tutorial.chirimen.org/raspi/section0#chirimen-for-raspberry-pi--1;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > Raspberry Pi の起動< / h2 >
< p > < img src = "./assets/setup-raspi.jpg" alt = "" style = "height:600px;" / > < / p >
< footer > < a href = "https://tutorial.chirimen.org/raspi/section0#chirimen-for-raspberry-pi--1" > https://tutorial.chirimen.org/raspi/section0#chirimen-for-raspberry-pi--1< / a > < / footer >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "14" data-paginate = "true" data-footer = "https://tutorial.chirimen.org/raspi/section0#wifi-" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="14" data-marpit-pagination-total="35" style="--paginate:true;--footer:https://tutorial.chirimen.org/raspi/section0#wifi-;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > Wi-Fi の設定< / h2 >
< p > Raspberry Pi の起動後、画面右上のパネルをクリックして設定を行います< / p >
< p > < img src = "./assets/setup-wifi.png" alt = "" / > < / p >
< p > (接続情報は会場で確認しましょう)< / p >
< footer > < a href = "https://tutorial.chirimen.org/raspi/section0#wifi-" > https://tutorial.chirimen.org/raspi/section0#wifi-< / a > < / footer >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "15" data-paginate = "true" data-footer = "https://tutorial.chirimen.org/raspi/section0#section-7" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="15" data-marpit-pagination-total="35" style="--paginate:true;--footer:https://tutorial.chirimen.org/raspi/section0#section-7;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > ブレッドボードでの配線< / h2 >
< p > < img src = "./assets/led-blink.dio.png" alt = "" style = "height:600px;" / > < / p >
< footer > < a href = "https://tutorial.chirimen.org/raspi/section0#section-7" > https://tutorial.chirimen.org/raspi/section0#section-7< / a > < / footer >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "16" data-paginate = "true" data-footer = "CHIRIMEN Examples https://chirimen.org/chirimen/gc/top/examples/" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="16" data-marpit-pagination-total="35" style="--paginate:true;--footer:CHIRIMEN Examples https://chirimen.org/chirimen/gc/top/examples/;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > サンプルコードの実行< / h2 >
< p > ブラウザー > Examples > GPIO Examples > GPIO-Blink > CSB (CodeSandbox)< / p >
< p > < img src = "./assets/link-to-led-blink-csb.jpg" alt = "" style = "height:480px;" / > < / p >
< footer > CHIRIMEN Examples < a href = "https://chirimen.org/chirimen/gc/top/examples/" > https://chirimen.org/chirimen/gc/top/examples/< / a > < / footer >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "17" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="17" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > ここまでのまとめ< / h2 >
< ul >
< li > CHIRIMEN for Raspberry Pi の起動< / li >
< li > LED を制御するサンプルコード (通称 LED チカチカ、L チカ) の実行< / li >
< / ul >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "18" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="18" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > GitHub アカウントの登録< / h2 >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "19" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="19" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > GitHub アカウントの登録< / h2 >
< p > < a href = "https://github.com/signup" > GitHub > Sign up< / a > からアカウントを作成します< br / >
アカウントに必要な項目を入力します< / p >
< p > < img src = "./assets/signup-github.png" alt = "" style = "height:480px;" / > < / p >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "20" data-paginate = "true" data-footer = "Join GitHub https://github.com/signup" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="20" data-marpit-pagination-total="35" style="--paginate:true;--footer:Join GitHub https://github.com/signup;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > GitHub アカウントの登録< / h2 >
< p > < img src = "./assets/signup-github-verify.png" alt = "" style = "height:480px;" / > < / p >
< footer > Join GitHub < a href = "https://github.com/signup" > https://github.com/signup< / a > < / footer >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "21" data-paginate = "true" data-footer = "Join GitHub https://github.com/signup" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="21" data-marpit-pagination-total="35" style="--paginate:true;--footer:Join GitHub https://github.com/signup;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > GitHub アカウントの登録< / h2 >
< p > 入力したメールアドレスに登録用のメールが届くので確認します< / p >
< p > < img src = "./assets/signup-github-verify-code.png" alt = "" style = "height:480px;" / > < / p >
< footer > Join GitHub < a href = "https://github.com/signup" > https://github.com/signup< / a > < / footer >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "22" data-paginate = "true" data-footer = "GitHub https://github.com/" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="22" data-marpit-pagination-total="35" style="--paginate:true;--footer:GitHub https://github.com/;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > GitHub アカウントの登録< / h2 >
< p > 次のような画面になれば OK< / p >
< p > < img src = "./assets/github.png" alt = "" style = "height:480px;" / > < / p >
< footer > GitHub < a href = "https://github.com/" > https://github.com/< / a > < / footer >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "23" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="23" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > CodeSandbox の使い方< / h2 >
< ul >
< li > < a href = "https://csb-jp.github.io/docs/usage" > CodeSandbox の基本的な使い方< / a > < / li >
< / ul >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "24" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="24" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > 後付< / h2 >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "25" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="25" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > その他< / h2 >
< ul >
< li > < a href = "https://tutorial.chirimen.org/raspi/debug" > デバッグ・トラブルシューティング< / a > < / li >
< li > < a href = "https://tutorial.chirimen.org/raspi/tips" > Tips・テクニック< / a > < / li >
< li > < a href = "https://tutorial.chirimen.org/raspi/faq" > 良くある質問と回答< / a > < / li >
< / ul >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "26" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="26" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h1 > 2 日目< / h1 >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "27" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="27" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > いろいろなデバイスを触ってみよう< / h2 >
2023-01-14 15:54:10 +09:00
< p > 自分の席に着き次第、自由に進めてもらって OK 👌< / p >
2022-11-22 18:21:34 +09:00
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "28" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="28" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > 本日の流れ< / h2 >
< p > ハンズオン講習会< / p >
< ul >
< li > 10:00-10:10 はじめに< / li >
< li > 11:30-12:00 片付け< / li >
< / ul >
< p > アイディアワークショップ< / p >
< ul >
< li > 13:00-13:30 インプットトーク< / li >
< li > 13:30-16:00 各チームの作戦会議< / li >
< li > 16:00-16:20 各チームの進捗共有< / li >
< li > 16:30-17:00 ハッカソンの説明など< / li >
< / ul >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section data-paginate = "true" data-footer = "画像の引用元: Web× data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="29" data-marpit-pagination-total="35" style="--paginate:true;--footer:画像の引用元: Web×
border-bottom: 10px solid #F5CE52;
}
;--marpit-advanced-background-split:48%;" data-marpit-advanced-background="background" data-marpit-advanced-background-split="right">< div data-marpit-advanced-background-container = "true" data-marpit-advanced-background-direction = "horizontal" > < figure style = "background-image:url("./assets/webiotmakers-gallery.dio.png");background-size:800px auto;" > < / figure > < / div > < / section > < / foreignObject > < foreignObject width = "52%" height = "720" > < section id = "29" data-paginate = "true" data-footer = "画像の引用元: Web× data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="29" data-marpit-pagination-total="35" style="--paginate:true;--footer:画像の引用元: Web×
border-bottom: 10px solid #F5CE52;
}
;--marpit-advanced-background-split:48%;" data-marpit-advanced-background="content" data-marpit-advanced-background-split="right">
< h2 > ハッカソンのポイント< / h2 >
< ul >
< li > ときめくような素敵なアイディア< / li >
< li > 審査本番に作品が機能すること< / li >
< / ul >
< footer > 画像の引用元: Web× < a href = "https://webiotmakers.github.io/gallery/" > https://webiotmakers.github.io/gallery/< / a > < / footer >
< / section >
< / foreignObject > < foreignObject width = "1280" height = "720" data-marpit-advanced-background = "pseudo" > < section data-paginate = "true" data-footer = "画像の引用元: Web× data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="29" data-marpit-pagination-total="35" style="" data-marpit-advanced-background="pseudo" data-marpit-advanced-background-split="right">< / section > < / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "30" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="30" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > 応用編< / h2 >
< ul >
< li > I2C で複数のデバイス扱う< / li >
< li > 遠隔制御< / li >
< / ul >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "31" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="31" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > I2C で複数のデバイス扱う< / h2 >
< p > それぞれのモジュールの VCC/GND/SDA/SCL を並列接続< br / >
< img src = "https://res.cloudinary.com/chirimen/image/fetch/c_limit,f_auto,q_auto,w_1000/https://tutorial.chirimen.org/raspi/imgs/section3/bh1750-and-adt7410.jpg" alt = "" style = "height:450px;" / > < br / >
スレーブアドレスが同じデバイスは同時に接続できません< br / >
< a href = "https://tutorial.chirimen.org/raspi/section3#section-7" > https://tutorial.chirimen.org/raspi/section3#section-7< / a > < / p >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "32" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="32" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > I2C で複数のデバイス扱う - 温湿度センサーと距離センサーの例< / h2 >
< iframe src = "https://codesandbox.io/embed/sht30-vl53l0x-pz620y?autoresize=1&codemirror=1&fontsize=14&hidenavigation=1&theme=dark"
style="width:100%; height:500px; border:0; border-radius: 4px; overflow:hidden;"
title="sht30-vl53l0x"
allow="accelerometer; ambient-light-sensor; camera; encrypted-media; geolocation; gyroscope; hid; microphone; midi; payment; usb; vr; xr-spatial-tracking"
sandbox="allow-forms allow-modals allow-popups allow-presentation allow-same-origin allow-scripts"
>< / iframe >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "33" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="33" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > 遠隔制御< / h2 >
< p > ブラウザー > Examples > Remote Examples > REMOTE-I2C-SHT30 > CSB< / p >
< p > < a href = "https://codesandbox.io/s/github/chirimen-oh/chirimen/tree/master/gc/contrib/examples/remote-i2c-SHT30" > < img src = "https://codesandbox.io/static/img/play-codesandbox.svg" alt = "" / > < / a > < / p >
< ul >
< li > < code > relay.subscribe(" {ここは書き換えて使用してください}" )< / code > < / li >
< / ul >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "34" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="34" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
2023-01-14 15:54:10 +09:00
< h2 > ⚠ 片付け注意事項< / h2 >
2022-11-22 18:21:34 +09:00
< ol >
< li > 借りたセンサーをすべて返却します< / li >
< li > Raspberry Pi の電源を切ります< / li >
< li > microSD カードは必ず抜き取り、CHIRIMEN スターターキットを片付けます< / li >
< li > クリアボックスを片付けます
< ul >
< li > できるだけ元の状態に戻してください< / li >
< / ul >
< / li >
< / ol >
< p > (詳しくは会場のスタッフが案内します)< / p >
< / section >
< / foreignObject > < / svg > < svg data-marpit-svg = "" viewBox = "0 0 1280 720" > < foreignObject width = "1280" height = "720" > < section id = "35" data-paginate = "true" data-style = "section :is ( h1 , h2 , h3 , h4 , h5 , h6 ) {
border-bottom: 10px solid #F5CE52;
}
" data-marpit-pagination="35" data-marpit-pagination-total="35" style="--paginate:true;--style:section :is(h1, h2, h3, h4, h5, h6) {
border-bottom: 10px solid #F5CE52;
}
;">
< h2 > ハッカソンに向けて< / h2 >
< p > リードタイムに注意 特に海外からの発送は時間がかかるので余裕を持って< br / >
品薄なものもあるので早めに調達を< br / >
< a href = "https://gist.github.com/elie-j/8a27e7a65a40371e0cda5754ce0a063d" > https://gist.github.com/elie-j/8a27e7a65a40371e0cda5754ce0a063d< / a > < / p >
< / section >
< script > ! f u n c t i o n ( ) { " u s e s t r i c t " ; c o n s t t = { h 1 : { p r o t o : ( ) = > H T M L H e a d i n g E l e m e n t , a t t r s : { r o l e : " h e a d i n g " , " a r i a - l e v e l " : " 1 " } , s t y l e : " d i s p l a y : b l o c k ; f o n t - s i z e : 2 e m ; m a r g i n - b l o c k - s t a r t : 0 . 6 7 e m ; m a r g i n - b l o c k - e n d : 0 . 6 7 e m ; m a r g i n - i n l i n e - s t a r t : 0 p x ; m a r g i n - i n l i n e - e n d : 0 p x ; f o n t - w e i g h t : b o l d ; " } , h 2 : { p r o t o : ( ) = > H T M L H e a d i n g E l e m e n t , a t t r s : { r o l e : " h e a d i n g " , " a r i a - l e v e l " : " 2 " } , s t y l e : " d i s p l a y : b l o c k ; f o n t - s i z e : 1 . 5 e m ; m a r g i n - b l o c k - s t a r t : 0 . 8 3 e m ; m a r g i n - b l o c k - e n d : 0 . 8 3 e m ; m a r g i n - i n l i n e - s t a r t : 0 p x ; m a r g i n - i n l i n e - e n d : 0 p x ; f o n t - w e i g h t : b o l d ; " } , h 3 : { p r o t o : ( ) = > H T M L H e a d i n g E l e m e n t , a t t r s : { r o l e : " h e a d i n g " , " a r i a - l e v e l " : " 3 " } , s t y l e : " d i s p l a y : b l o c k ; f o n t - s i z e : 1 . 1 7 e m ; m a r g i n - b l o c k - s t a r t : 1 e m ; m a r g i n - b l o c k - e n d : 1 e m ; m a r g i n - i n l i n e - s t a r t : 0 p x ; m a r g i n - i n l i n e - e n d : 0 p x ; f o n t - w e i g h t : b o l d ; " } , h 4 : { p r o t o : ( ) = > H T M L H e a d i n g E l e m e n t , a t t r s : { r o l e : " h e a d i n g " , " a r i a - l e v e l " : " 4 " } , s t y l e : " d i s p l a y : b l o c k ; m a r g i n - b l o c k - s t a r t : 1 . 3 3 e m ; m a r g i n - b l o c k - e n d : 1 . 3 3 e m ; m a r g i n - i n l i n e - s t a r t : 0 p x ; m a r g i n - i n l i n e - e n d : 0 p x ; f o n t - w e i g h t : b o l d ; " } , h 5 : { p r o t o : ( ) = > H T M L H e a d i n g E l e m e n t , a t t r s : { r o l e : " h e a d i n g " , " a r i a - l e v e l " : " 5 " } , s t y l e : " d i s p l a y : b l o c k ; f o n t - s i z e : 0 . 8 3 e m ; m a r g i n - b l o c k - s t a r t : 1 . 6 7 e m ; m a r g i n - b l o c k - e n d : 1 . 6 7 e m ; m a r g i n - i n l i n e - s t a r t : 0 p x ; m a r g i n - i n l i n e - e n d : 0 p x ; f o n t - w e i g h t : b o l d ; " } , h 6 : { p r o t o : ( ) = > H T M L H e a d i n g E l e m e n t , a t t r s : { r o l e : " h e a d i n g " , " a r i a - l e v e l " : " 6 " } , s t y l e : " d i s p l a y : b l o c k ; f o n t - s i z e : 0 . 6 7 e m ; m a r g i n - b l o c k - s t a r t : 2 . 3 3 e m ; m a r g i n - b l o c k - e n d : 2 . 3 3 e m ; m a r g i n - i n l i n e - s t a r t : 0 p x ; m a r g i n - i n l i n e - e n d : 0 p x ; f o n t - w e i g h t : b o l d ; " } , s p a n : { p r o t o : ( ) = > H T M L S p a n E l e m e n t } , p r e : { p r o t o : ( ) = > H T M L E l e m e n t , s t y l e : " d i s p l a y : b l o c k ; f o n t - f a m i l y : m o n o s p a c e ; w h i t e - s p a c e : p r e ; m a r g i n : 1 e m 0 ; - - m a r p - a u t o - s c a l i n g - w h i t e - s p a c e : p r e ; " } } , e = " d a t a - m a r p - a u t o - s c a l i n g - w r a p p e r " , i = " d a t a - m a r p - a u t o - s c a l i n g - s v g " , n = " d a t a - m a r p - a u t o - s c a l i n g - c o n t a i n e r " ; c l a s s s e x t e n d s H T M L E l e m e n t { c o n s t r u c t o r ( ) { s u p e r ( ) , t h i s . s v g P r e s e r v e A s p e c t R a t i o = " x M i n Y M i d m e e t " ; c o n s t t = t = > ( [ e ] ) = > { c o n s t { w i d t h : i , h e i g h t : n } = e . c o n t e n t R e c t ; t h i s [ t ] = { w i d t h : i , h e i g h t : n } , t h i s . u p d a t e S V G R e c t ( ) } ; t h i s . a t t a c h S h a d o w ( { m o d e : " o p e n " } ) , t h i s . c o n t a i n e r O b s e r v e r = n e w R e s i z e O b s e r v e r ( t ( " c o n t a i n e r S i z e " ) ) , t h i s . w r a p p e r O b s e r v e r = n e w R e s i z e O b s e r v e r ( ( ( . . . e ) = > { t ( " w r a p p e r S i z e " ) ( . . . e ) , t h i s . f l u s h S v g D i s p l a y ( ) } ) ) } s t a t i c g e t o b s e r v e d A t t r i b u t e s ( ) { r e t u r n [ " d a t a - d o w n s c a l e - o n l y " ] } c o n n e c t e d C a l l b a c k ( ) { v a r t , s , o , r , a ; t h i s . s h a d o w R o o t . i n n e r H T M L = ` \ n < s t y l e > \ n s v g [ $ { i } ] { d i s p l a y : b l o c k ; w i d t h : 1 0 0 % ; h e i g h t : a u t o ; v e r t i c a l - a l i g n : t o p ; } \ n s p a n [ $ { n } ] { d i s p l a y : t a b l e ; w h i t e - s p a c e : v a r ( - - m a r p - a u t o - s c a l i n g - w h i t e - s p a c e , n o w r a p ) ; w i d t h : m a x - c o n t e n t ; } \ n < / s t y l e > \ n < d i v $ { e } > \ n < s v g p a r t = " s v g " $ { i } > \ n < f o r e i g n O b j e c t > < s p a n $ { n } > < s l o t > < / s l o t > < / s p a n > < / f o r e i g n O b j e c t > \ n < / s v g > \ n < / d i v > \ n ` . s p l i t ( / \ n \ s * / ) . j o i n ( " " ) , t h i s . w r a p p e r = n u l l ! = = ( t = t h i s . s h a d o w R o o t . q u e r y S e l e c t o r ( ` d i v [ $ { e } ] ` ) ) & & v o i d 0 ! = = t ? t : v o i d 0 ; c o n s t l = t h i s . s v g ; t h i s . s v g = n u l l ! = = ( o = n u l l = = = ( s = t h i s . w r a p p e r ) | | v o i d 0 = = = s ? v o i d 0 : s . q u e r y S e l e c t o r ( ` s v g [ $ { i } ] ` ) ) & & v o i d 0 ! = = o ? o : v o i d 0 , t h i s . s v g ! = = l & & ( t h i s . s v g C o m p u t e d S t y l e = t h i s . s v g ? w i n d o w . g e t C o m p u t e d S t y l e ( t h i s . s v g ) : v o i d 0 ) , t h i s . c o n t a i n e r = n u l l ! = = ( a = n u l l = = = ( r = t h i s . s v g ) | | v o i d 0 = = = r ? v o i d 0 : r . q u e r y S e l e c t o r ( ` s p a n [ $ { n } ] ` ) ) & & v o i d 0 ! = = a ? a : v o i d 0 , t h i s . o b s e r v e ( ) } d i s c o n n e c t e d C a l l b a c k ( ) { t h i s . s v g = v o i d 0 , t h i s . s v g C o m p u t e d S t y l e = v o i d 0 , t h i s . w r a p p e r = v o i d 0 , t h i s . c o n t a i n e r = v o i d 0 , t h i s . o b s e r v e ( ) } a t t r i b u t e C h a n g e d C a l l b a c k ( ) { t h i s . o b s e r v e ( ) } f l u s h S v g D i s p l a y ( ) { c o n s t { s v g : t } = t h i s ; t & & ( t . s t y l e . d i s p l a y = " i n l i n e " , r e q u e s t A n i m a t i o n F r a m e ( ( ( ) = > { t . s t y l e . d i s p l a y = " " } ) ) ) } o b s e r v e ( ) { t h i s . c o n t a i n e r O b s e r v e r . d i s c o n n e c t ( ) , t h i s . w r a p p e r O b s e r v e r . d i s c o n n e c t ( ) , t h i s . w r a p p e r & & t h i s . w r a p p e r O b s e r v e r . o b s e r v e ( t h i s . w r a p p e r ) , t h i s . c o n t a i n e r & & t h i s . c o n t a i n e r O b s e r v e r . o b s e r v e ( t h i s . c o n t a i n e r ) , t h i s . s v g C o m p u t e d S t y l e & & t h i s . o b s e r v e S V G S t y l e ( t h i s . s v g C o m p u t e d S t y l e ) } o b s e r v e S V G S t y l e ( t ) { c o n s t e = ( ) = > { c o n s t i = ( ( ) = > { c o n s t e = t . g e t P r o p e r t y V a l u e ( " - - p r e s e r v e - a s p e c t - r a t i o " ) ; i f ( e ) r e t u r n e . t r i m ( ) ; r e t u r n ` x $ { ( ( { t e x t A l i g n : t , d i r e c t i o n : e } ) = > { i f ( t . e n d s W i t h ( " l e f t " ) ) r e t u r n " M i n " ; i f ( t . e n d s W i t h ( " r i g h t " ) ) r e t u r n " M a x " ; i f ( " s t a r t " = = = t | | " e n d " = = = t ) { l e t i = " r t l " = = = e ; r e t u r n " e n d " = = = t & & ( i = ! i ) , i ? " M a x " : " M i n " } r e t u r n " M i d " } ) ( t ) } Y M i d m e e t ` } ) ( ) ; i ! = = t h i s . s v g P r e s e r v e A s p e c t R a t i o & & ( t h i s . s v g P r e s e r v e A s p e c t R a t i o = i , t h i s . u p d a t e S V G R e c t ( ) ) , t = = = t h i s . s v g C o m p u t e d S t y l e & & r e q u e s t A n i m a t i o n F r a m e ( e ) } ; e ( )
< / script > < / foreignObject > < / svg > < / div > < div class = "bespoke-marp-note" data-index = "28" tabindex = "0" > < p > NOTE: 昨日・今日と技術的な話を中心にやってきましたが、極端な話ハッカソンの本番は、技術的に優れているかどうかは一旦忘れてもらってOK、コピペでOK、人の真似でOK
ですが限られた時間しかないので、これからの時間で、やりたいことを周りのスタッフに相談したり、Slackで相談してみてください< / p > < / div > < script > / * ! ! L i c e n s e : h t t p s : / / u n p k g . c o m / @ m a r p - t e a m / m a r p - c l i @ 2 . 2 . 0 / l i b / b e s p o k e . j s . L I C E N S E . t x t * /
2023-01-14 15:54:10 +09:00
!function(){"use strict";"undefined"!=typeof globalThis?globalThis:"undefined"!=typeof window?window:"undefined"!=typeof global?global:"undefined"!=typeof self&&self; const e=document.body,t=(...e)=>history.replaceState(...e),n="presenter",r="next",o=["",n,r],a="data-bespoke-marp-",i=(e,{protocol:t,host:n,pathname:r,hash:o}=location)=>{const a=e.toString();return`${t}//${n}${r}${a?"?":""}${a}${o}`},s=()=>e.dataset.bespokeView,l=e=>new URLSearchParams(location.search).get(e),c=(e,n={})=>{var r;const o={location,setter:t,...n},a=new URLSearchParams(o.location.search);for(const t of Object.keys(e)){const n=e[t];"string"==typeof n?a.set(t,n):a.delete(t)}try{o.setter({...null!==(r=window.history.state)& & void 0!==r?r:{}},"",i(a,o.location))}catch(e){console.error(e)}},d=(()=>{const e="bespoke-marp";try{return localStorage.setItem(e,e),localStorage.removeItem(e),!0}catch(e){return!1}})(),u=e=>{try{return localStorage.getItem(e)}catch(e){return null}},f=(e,t)=>{try{return localStorage.setItem(e,t),!0}catch(e){return!1}},m=e=>{try{return localStorage.removeItem(e),!0}catch(e){return!1}},g=(e,t)=>{const n="aria-hidden";t?e.setAttribute(n,"true"):e.removeAttribute(n)},p=e=>{e.parent.classList.add("bespoke-marp-parent"),e.slides.forEach((e=>e.classList.add("bespoke-marp-slide"))),e.on("activate",(t=>{const n="bespoke-marp-active",r=t.slide,o=r.classList,a=!o.contains(n);if(e.slides.forEach((e=>{e.classList.remove(n),g(e,!0)})),o.add(n),g(r,!1),a){const e=`${n}-ready`;o.add(e),document.body.clientHeight,o.remove(e)}}))},v=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],o=(r,o)=>{t=r,n=o,e.fragments.forEach(((e,t)=>{e.forEach(((e,n)=>{if(null==e)return;const i=t< r | | t = ==r&&n<=o;e.setAttribute(`${a}fragment`,(i?"":"in")+"active");const s = `${a}current-fragment`;t===r&&n===o?e.setAttribute(s,"current"):e.removeAttribute(s)}))})),e.fragmentIndex=o;const i = {slide:e.slides[r],index:r,fragments:e.fragments[r],fragmentIndex:o};e.fire("fragment",i)};e.on("next",(({fragment:a=!0})= > {if(a){if(r(1))return o(t,n+1),!1;const a=t+1;e.fragments[a]& & o(a,0)}else{const r=e.fragments[t].length;if(n+1< r ) return o ( t , r-1 ) , ! 1 ; const a = e.fragments[t+1];a&&o(t+1,a.length-1)}})),e.on("prev",(({fragment:a=!0})= > {if(r(-1)& & a)return o(t,n-1),!1;const i=t-1;e.fragments[i]& & o(i,e.fragments[i].length-1)})),e.on("slide",(({index:t,fragment:n})=>{let r=0;if(void 0!==n){const o=e.fragments[t];if(o){const{length:e}=o;r=-1===n?e-1:Math.min(Math.max(n,0),e-1)}}o(t,r)})),o(0,0)},h=document,y=()=>!(!h.fullscreenEnabled& & !h.webkitFullscreenEnabled),b=()=>!(!h.fullscreenElement& & !h.webkitFullscreenElement),w=e=>{e.fullscreen=()=>{y()& & (async()=>{return b()?null===(e=h.exitFullscreen||h.webkitExitFullscreen)||void 0===e?void 0:e.call(h):((e=h.body)=>{var t;return null===(t=e.requestFullscreen||e.webkitRequestFullscreen)||void 0===t?void 0:t.call(e)})();var e})()},document.addEventListener("keydown",(t=>{"f"!==t.key& & "F11"!==t.key||t.altKey||t.ctrlKey||t.metaKey||!y()||(e.fullscreen(),t.preventDefault())}))},x="bespoke-marp-inactive",k=(e=2e3)=>({parent:t,fire:n})=>{const r=t.classList,o=e=>n(`marp-${e?"":"in"}active`);let a;const i=()=>{a&&clearTimeout(a),a=setTimeout((()=>{r.add(x),o()}),e),r.contains(x)&&(r.remove(x),o(!0))}; for(const e of["mousedown","mousemove","touchend"])document.addEventListener(e,i);setTimeout(i,0)},E=["AUDIO","BUTTON","INPUT","SELECT","TEXTAREA","VIDEO"],$=e=>{e.parent.addEventListener("keydown",(e=>{if(!e.target)return;const t=e.target;(E.includes(t.nodeName)||"true"===t.contentEditable)& & e.stopPropagation()}))},L=e=>{window.addEventListener("load",(()=>{for(const t of e.slides){const e=t.querySelector("marp-auto-scaling, [data-auto-scaling], [data-marp-fitting]");t.setAttribute(`${a}load`,e?"":"hideable")}}))},S=({interval:e=250}={})=>t=>{document.addEventListener("keydown",(e=>{if(" "===e.key&&e.shiftKey)t.prev(); else if("ArrowLeft"===e.key||"ArrowUp"===e.key||"PageUp"===e.key)t.prev({fragment:!e.shiftKey});else i
