PageSourceSearch

https://www.bau-haus.com/learn/

html bau-haus.com collected 2026-10-04 11:15:20 UTC 79,507 bytes, 527 lines download raw bytes

1<!DOCTYPE html>
2<html lang="ja">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1">
6        
6<script>
7    (function () {
8      var k = 'bauhaus-theme';
9      var t = localStorage.getItem(k);
10      if (t === 'dark' || (!t && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
11        document.documentElement.setAttribute('data-theme', 'dark');
12      }
13    })();
14    </script>
14
15    <title>学習ハブ &#8211; BAUHAUS</title>
16<meta name='robots' content='max-image-preview:large' />
17<!-- Google タグ (gtag.js) 同意モード dataLayer (Site Kit が追加) -->
18<script id="google_gtagjs-js-consent-mode-data-layer">
19window.dataLayer = window.dataLayer || [];function gtag(){dataLayer.push(arguments);}
20gtag('consent', 'default', {"ad_personalization":"denied","ad_storage":"denied","ad_user_data":"denied","analytics_storage":"denied","functionality_storage":"denied","security_storage":"denied","personalization_storage":"denied","region":["AT","BE","BG","CH","CY","CZ","DE","DK","EE","ES","FI","FR","GB","GR","HR","HU","IE","IS","IT","LI","LT","LU","LV","MT","NL","NO","PL","PT","RO","SE","SI","SK"],"wait_for_update":500});
21window._googlesitekitConsentCategoryMap = {"statistics":["analytics_storage"],"marketing":["ad_storage","ad_user_data","ad_personalization"],"functional":["functionality_storage","security_storage"],"preferences":["personalization_storage"]};
22window._googlesitekitConsents = {"ad_personalization":"denied","ad_storage":"denied","ad_user_data":"denied","analytics_storage":"denied","functionality_storage":"denied","security_storage":"denied","personalization_storage":"denied","region":["AT","BE","BG","CH","CY","CZ","DE","DK","EE","ES","FI","FR","GB","GR","HR","HU","IE","IS","IT","LI","LT","LU","LV","MT","NL","NO","PL","PT","RO","SE","SI","SK"],"wait_for_update":500};
23</script>
23
24<!-- (ここまで) Google タグ (gtag.js) 同意モード dataLayer (Site Kit が追加) -->
25<link rel='dns-prefetch' href='//www.googletagmanager.com' />
26<link rel='dns-prefetch' href='//pagead2.googlesyndication.com' />
27<link rel="alternate" title="oEmbed (JSON)" type="application/json+oembed" href="https://www.bau-haus.com/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fwww.bau-haus.com%2Flearn%2F" />
28<link rel="alternate" title="oEmbed (XML)" type="text/xml+oembed" href="https://www.bau-haus.com/wp-json/oembed/1.0/embed?url=https%3A%2F%2Fwww.bau-haus.com%2Flearn%2F&#038;format=xml" />
29<style id="wp-img-auto-sizes-contain-inline-css">
30img:is([sizes=auto i],[sizes^="auto," i]){contain-intrinsic-size:3000px 1500px}
31/*# sourceURL=wp-img-auto-sizes-contain-inline-css */
32</style>
33<style id="wp-emoji-styles-inline-css">
34
35	img.wp-smiley, img.emoji {
36		display: inline !important;
37		border: none !important;
38		box-shadow: none !important;
39		height: 1em !important;
40		width: 1em !important;
41		margin: 0 0.07em !important;
42		vertical-align: -0.1em !important;
43		background: none !important;
44		padding: 0 !important;
45	}
46/*# sourceURL=wp-emoji-styles-inline-css */
47</style>
48<style id="wp-block-library-inline-css">
49:root{--wp-block-synced-color:#7a00df;--wp-block-synced-color--rgb:122,0,223;--wp-bound-block-color:var(--wp-block-synced-color);--wp-editor-canvas-background:#ddd;--wp-admin-theme-color:#007cba;--wp-admin-theme-color--rgb:0,124,186;--wp-admin-theme-color-darker-10:#006ba1;--wp-admin-theme-color-darker-10--rgb:0,107,160.5;--wp-admin-theme-color-darker-20:#005a87;--wp-admin-theme-color-darker-20--rgb:0,90,135;--wp-admin-border-width-focus:2px}@media (min-resolution:192dpi){:root{--wp-admin-border-width-focus:1.5px}}.wp-element-button{cursor:pointer}:root .has-very-light-gray-background-color{background-color:#eee}:root .has-very-dark-gray-background-color{background-color:#313131}:root .has-very-light-gray-color{color:#eee}:root .has-very-dark-gray-color{color:#313131}:root .has-vivid-green-cyan-to-vivid-cyan-blue-gradient-background{background:linear-gradient(135deg,#00d084,#0693e3)}:root .has-purple-crush-gradient-background{background:linear-gradient(135deg,#34e2e4,#4721fb 50%,#ab1dfe)}:root .has-hazy-dawn-gradient-background{background:linear-gradient(135deg,#faaca8,#dad0ec)}:root .has-subdued-olive-gradient-background{background:linear-gradient(135deg,#fafae1,#67a671)}:root .has-atomic-cream-gradient-background{background:linear-gradient(135deg,#fdd79a,#004a59)}:root .has-nightshade-gradient-background{background:linear-gradient(135deg,#330968,#31cdcf)}:root .has-midnight-gradient-background{background:linear-gradient(135deg,#020381,#2874fc)}:root{--wp--preset--font-size--normal:16px;
49--wp--preset--font-size--huge:42px}.has-regular-font-size{font-size:1em}.has-larger-font-size{font-size:2.625em}.has-normal-font-size{font-size:var(--wp--preset--font-size--normal)}.has-huge-font-size{font-size:var(--wp--preset--font-size--huge)}:root .has-text-align-center{text-align:center}:root .has-text-align-left{text-align:left}:root .has-text-align-right{text-align:right}.has-fit-text{white-space:nowrap!important}#end-resizable-editor-section{display:none}.aligncenter{clear:both}.items-justified-left{justify-content:flex-start}.items-justified-center{justify-content:center}.items-justified-right{justify-content:flex-end}.items-justified-space-between{justify-content:space-between}.screen-reader-text{word-wrap:normal!important;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-break:normal!important}.screen-reader-text:focus{background-color:#ddd;clip-path:none;color:#444;display:block;font-size:1em;height:auto;left:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}html :where(.has-border-color){border-style:solid}html :where([style^=border-color],[style*=";border-color"],[style*="; border-color"]){border-style:solid}html :where([style^=border-top-color],[style*=";border-top-color"],[style*="; border-top-color"]){border-top-style:solid}html :where([style^=border-right-color],[style*=";border-right-color"],[style*="; border-right-color"]){border-right-style:solid}html :where([style^=border-bottom-color],[style*=";border-bottom-color"],[style*="; border-bottom-color"]){border-bottom-style:solid}html :where([style^=border-left-color],[style*=";border-left-color"],[style*="; border-left-color"]){border-left-style:solid}html :where([style^=border-width],[style*=";border-width"],[style*="; border-width"]){border-style:solid}html :where([style^=border-top-width],[style*=";border-top-width"],[style*="; border-top-width"]){border-top-style:solid}html :where([style^=border-right-width],[style*=";border-right-width"],[style*="; border-right-width"]){border-right-style:solid}html :where([style^=border-bottom-width],[style*=";border-bottom-width"],[style*="; border-bottom-width"]){border-bottom-style:solid}html :where([style^=border-left-width],[style*=";border-left-width"],[style*="; border-left-width"]){border-left-style:solid}html :where(img[class*=wp-image-]){height:auto;max-width:100%}:where(figure){margin:0 0 1em}html :where(.is-position-sticky){--wp-admin--admin-bar--position-offset:var(--wp-admin--admin-bar--height,0px)}@media screen and (max-width:600px){html :where(.is-position-sticky){--wp-admin--admin-bar--position-offset:0px}}
50
51/*# sourceURL=/wp-includes/css/dist/block-library/common.min.css */
52</style>
53<style id="wp-block-heading-inline-css">
54h1:where(.wp-block-heading).has-background,h2:where(.wp-block-heading).has-background,h3:where(.wp-block-heading).has-background,h4:where(.wp-block-heading).has-background,h5:where(.wp-block-heading).has-background,h6:where(.wp-block-heading).has-background{padding:1.25em 2.375em}h1.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h1.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h2.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h2.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h3.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h3.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h4.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h4.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h5.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h5.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h6.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h6.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]){rotate:180deg}
55/*# sourceURL=https://www.bau-haus.com/wp-includes/blocks/heading/style.min.css */
56</style>
57<style id="wp-block-image-inline-css">
58.wp-block-image>a,.wp-block-image>figure>a{display:inline-block}.wp-block-image img{box-sizing:border-box;height:auto;max-width:100%;vertical-align:bottom}@media not (prefers-reduced-motion){.wp-block-image img.hide{visibility:hidden}.wp-block-image img.show{animation:show-content-image .4s}}.wp-block-image[style*=border-radius] img,.wp-block-image[style*=border-radius]>a{border-radius:inherit}.wp-block-image.has-custom-border img{box-sizing:border-box}.wp-block-image.aligncenter{text-align:center}.wp-block-image.alignfull>a,.wp-block-image.alignwide>a{width:100%}.wp-block-image.alignfull img,.wp-block-image.alignwide img{height:auto;width:100%}.wp-block-image .aligncenter,.wp-block-image .alignleft,.wp-block-image .alignright,.wp-block-image.aligncenter,.wp-block-image.alignleft,.wp-block-image.alignright{display:table}.wp-block-image .aligncenter>figcaption,.wp-block-image .alignleft>figcaption,.wp-block-image .alignright>figcaption,.wp-block-image.aligncenter>figcaption,.wp-block-image.alignleft>figcaption,.wp-block-image.alignright>figcaption{caption-side:bottom;display:table-caption}.wp-block-image .alignleft{float:left;margin:.5em 1em .5em 0}.wp-block-image .alignright{float:right;margin:.5em 0 .5em 1em}.wp-block-image .aligncenter{margin-left:auto;margin-right:auto}.wp-block-image :where(figcaption){margin-bottom:1em;margin-top:.5em}.wp-block-image.is-style-circle-mask img{border-radius:9999px}@supports ((-webkit-mask-image:none) or (mask-image:none)) or (-webkit-mask-image:none){.wp-block-image.is-style-circle-mask img{border-radius:0;-webkit-mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>');mask-image:url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>');mask-mode:alpha;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain}}:root :where(.wp-block-image.is-style-rounded img,.wp-block-image .is-style-rounded img){border-radius:9999px}.wp-block-image figure{margin:0}.wp-lightbox-container{display:flex;flex-direction:column;position:relative}.wp-lightbox-container img{cursor:zoom-in}.wp-lightbox-container img:hover+button{opacity:1}.wp-lightbox-container button{align-items:center;backdrop-filter:blur(16px) saturate(180%);background-color:rgba(90,90,90,.25);border:none;border-radius:4px;cursor:zoom-in;display:flex;height:20px;justify-content:center;opacity:0;padding:0;position:absolute;right:16px;text-align:center;top:16px;width:20px;z-index:100}@media not (prefers-reduced-motion){.wp-lightbox-container button{transition:opacity .2s ease}}.wp-lightbox-container button:focus-visible{outline:3px auto rgba(90,90,90,.25);outline:3px auto -webkit-focus-ring-color;outline-offset:3px}.wp-lightbox-container button:hover{cursor:pointer;opacity:1}.wp-lightbox-container button:focus{opacity:1}.wp-lightbox-container button:focus,.wp-lightbox-container button:hover,.wp-lightbox-container button:not(:hover):not(:active):not(.has-background){background-color:rgba(90,90,90,.25);border:none}.wp-lightbox-overlay{box-sizing:border-box;
58cursor:zoom-out;height:100vh;left:0;overflow:hidden;position:fixed;top:0;visibility:hidden;width:100%;z-index:100000}.wp-lightbox-overlay .wp-lightbox-close-button{align-items:center;cursor:pointer;display:flex;font-family:inherit;gap:8px;justify-content:center;line-height:1;min-height:40px;min-width:40px;padding:0 4px;position:absolute;right:calc(env(safe-area-inset-right) + 16px);top:calc(env(safe-area-inset-top) + 16px);z-index:5000000}.wp-lightbox-overlay .wp-lightbox-close-button:focus,.wp-lightbox-overlay .wp-lightbox-close-button:hover,.wp-lightbox-overlay .wp-lightbox-close-button:not(:hover):not(:active):not(.has-background){background:none;border:none}.wp-lightbox-overlay .wp-lightbox-close-button:has(.wp-lightbox-close-text:not([hidden])) .wp-lightbox-close-icon svg{height:1em;width:1em}.wp-lightbox-overlay .wp-lightbox-close-icon svg{display:block}.wp-lightbox-overlay .wp-lightbox-navigation-button-next,.wp-lightbox-overlay .wp-lightbox-navigation-button-prev{align-items:center;bottom:16px;cursor:pointer;display:flex;font-family:inherit;gap:4px;justify-content:center;line-height:1;min-height:40px;min-width:40px;padding:0 8px;position:absolute;z-index:2000002}.wp-lightbox-overlay .wp-lightbox-navigation-button-next[hidden],.wp-lightbox-overlay .wp-lightbox-navigation-button-prev[hidden]{display:none}@media (min-width:960px){.wp-lightbox-overlay .wp-lightbox-navigation-button-next,.wp-lightbox-overlay .wp-lightbox-navigation-button-prev{bottom:50%;transform:translateY(-50%)}}.wp-lightbox-overlay .wp-lightbox-navigation-button-next:focus,.wp-lightbox-overlay .wp-lightbox-navigation-button-next:hover,.wp-lightbox-overlay .wp-lightbox-navigation-button-next:not(:hover):not(:active):not(.has-background),.wp-lightbox-overlay .wp-lightbox-navigation-button-prev:focus,.wp-lightbox-overlay .wp-lightbox-navigation-button-prev:hover,.wp-lightbox-overlay .wp-lightbox-navigation-button-prev:not(:hover):not(:active):not(.has-background){background:none;border:none;padding:0 8px}.wp-lightbox-overlay .wp-lightbox-navigation-button-next:has(.wp-lightbox-navigation-text:not([hidden])) .wp-lightbox-navigation-icon svg,.wp-lightbox-overlay .wp-lightbox-navigation-button-prev:has(.wp-lightbox-navigation-text:not([hidden])) .wp-lightbox-navigation-icon svg{display:block;height:1.5em;width:1.5em}.wp-lightbox-overlay .wp-lightbox-navigation-button-prev{left:calc(env(safe-area-inset-left) + 16px)}.wp-lightbox-overlay .wp-lightbox-navigation-button-next{right:calc(env(safe-area-inset-right) + 16px)}.wp-lightbox-overlay .wp-lightbox-navigation-icon svg{vertical-align:middle}.wp-lightbox-overlay .lightbox-image-container{height:var(--wp--lightbox-container-height);left:50%;overflow:hidden;position:absolute;top:50%;transform:translate(-50%,-50%);transform-origin:top left;width:var(--wp--lightbox-container-width);z-index:2000001}.wp-lightbox-overlay .wp-block-image{align-items:center;box-sizing:border-box;display:flex;height:100%;justify-content:center;margin:0;position:relative;transform-origin:0 0;width:100%;z-index:3000000}.wp-lightbox-overlay .wp-block-image img{height:var(--wp--lightbox-image-height);min-height:var(--wp--lightbox-image-height);min-width:var(--wp--lightbox-image-width);width:var(--wp--lightbox-image-width)}.wp-lightbox-overlay .wp-block-image figcaption{display:none}.wp-lightbox-overlay button{background:none;border:none}.wp-lightbox-overlay .scrim{background-color:#fff;height:100%;opacity:.9;position:absolute;width:100%;z-index:2000000}.wp-lightbox-overlay.active{visibility:visible}@media not (prefers-reduced-motion){.wp-lightbox-overlay.active{animation:turn-on-visibility .25s both}.wp-lightbox-overlay.active img{animation:turn-on-visibility .35s both}.wp-lightbox-overlay.show-closing-animation:not(.active){animation:turn-off-visibility .35s both}.wp-lightbox-overlay.show-closing-animation:not(.active) img{animation:turn-off-visibility .25s both}.wp-lightbox-overlay.zoom.active{animation:none;opacity:1;visibility:visible}.wp-lightbox-overlay.zoom.active .lightbox-image-container{animation:lightbox-zoom-in .4s}.wp-lightbox-overlay.zoom.active .lightbox-image-container img{animation:none}.wp-lightbox-overlay.zoom.active .scrim{animation:turn-on-visibility .4s forwards}.wp-lightbox-overlay.zoom.show-closing-animation:not(.active){animation:none}.wp-lightbox-overlay.zoom.show-closing-animation:not(.active) .lightbox-image-container{animation:lightbox-zoom-out .4s}.wp-lightbox-overlay.zoom.show-closing-animation:not(.active) .lightbox-image-container img{animation:none}.wp-lightbox-overlay.zoom.show-closing-animation:not(.active) .scrim{animation:turn-off-visibility .4s forwards}}
58@keyframes show-content-image{0%{visibility:hidden}99%{visibility:hidden}to{visibility:visible}}@keyframes turn-on-visibility{0%{opacity:0}to{opacity:1}}@keyframes turn-off-visibility{0%{opacity:1;visibility:visible}99%{opacity:0;visibility:visible}to{opacity:0;visibility:hidden}}@keyframes lightbox-zoom-in{0%{transform:translate(calc((-100vw + var(--wp--lightbox-scrollbar-width))/2 + var(--wp--lightbox-initial-left-position)),calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale))}to{transform:translate(-50%,-50%) scale(1)}}@keyframes lightbox-zoom-out{0%{transform:translate(-50%,-50%) scale(1);visibility:visible}99%{visibility:visible}to{transform:translate(calc((-100vw + var(--wp--lightbox-scrollbar-width))/2 + var(--wp--lightbox-initial-left-position)),calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale));visibility:hidden}}
59/*# sourceURL=https://www.bau-haus.com/wp-includes/blocks/image/style.min.css */
60</style>
61<style id="wp-block-list-inline-css">
62ol,ul{box-sizing:border-box}:root :where(.wp-block-list.has-background){padding:1.25em 2.375em}
63/*# sourceURL=https://www.bau-haus.com/wp-includes/blocks/list/style.min.css */
64</style>
65<style id="wp-block-paragraph-inline-css">
66.is-small-text{font-size:.875em}.is-regular-text{font-size:1em}.is-large-text{font-size:2.25em}.is-larger-text{font-size:3em}.has-drop-cap:not(:focus):first-letter{float:left;font-size:8.4em;font-style:normal;font-weight:100;line-height:.68;margin:.05em .1em 0 0;text-transform:uppercase}body.rtl .has-drop-cap:not(:focus):first-letter{float:none;margin-left:.1em}p.has-drop-cap.has-background{overflow:hidden}:root :where(p.has-background){padding:1.25em 2.375em}:where(p.has-text-color:not(.has-link-color)) a{color:inherit}p.has-text-align-left[style*="writing-mode:vertical-lr"],p.has-text-align-right[style*="writing-mode:vertical-rl"]{rotate:180deg}
67/*# sourceURL=https://www.bau-haus.com/wp-includes/blocks/paragraph/style.min.css */
68</style>
69<style id="wp-block-table-inline-css">
70.wp-block-table{overflow-x:auto}.wp-block-table table{border-collapse:collapse;width:100%}.wp-block-table thead{border-bottom:3px solid}.wp-block-table tfoot{border-top:3px solid}.wp-block-table td,.wp-block-table th{border:1px solid;padding:.5em}.wp-block-table .has-fixed-layout{table-layout:fixed;width:100%}.wp-block-table .has-fixed-layout td,.wp-block-table .has-fixed-layout th{word-break:break-word}.wp-block-table.aligncenter,.wp-block-table.alignleft,.wp-block-table.alignright{display:table;width:auto}.wp-block-table.aligncenter td,.wp-block-table.aligncenter th,.wp-block-table.alignleft td,.wp-block-table.alignleft th,.wp-block-table.alignright td,.wp-block-table.alignright th{word-break:break-word}.wp-block-table .has-subtle-light-gray-background-color{background-color:#f3f4f5}.wp-block-table .has-subtle-pale-green-background-color{background-color:#e9fbe5}.wp-block-table .has-subtle-pale-blue-background-color{background-color:#e7f5fe}.wp-block-table .has-subtle-pale-pink-background-color{background-color:#fcf0ef}.wp-block-table.is-style-stripes{background-color:transparent;border-collapse:inherit;border-spacing:0}.wp-block-table.is-style-stripes tbody tr:nth-child(odd){background-color:#f0f0f0}.wp-block-table.is-style-stripes.has-subtle-light-gray-background-color tbody tr:nth-child(odd){background-color:#f3f4f5}.wp-block-table.is-style-stripes.has-subtle-pale-green-background-color tbody tr:nth-child(odd){background-color:#e9fbe5}.wp-block-table.is-style-stripes.has-subtle-pale-blue-background-color tbody tr:nth-child(odd){background-color:#e7f5fe}.wp-block-table.is-style-stripes.has-subtle-pale-pink-background-color tbody tr:nth-child(odd){background-color:#fcf0ef}.wp-block-table.is-style-stripes td,.wp-block-table.is-style-stripes th{border-color:transparent}.wp-block-table.is-style-stripes{border-bottom:1px solid #f0f0f0}.wp-block-table .has-border-color td,.wp-block-table .has-border-color th,.wp-block-table .has-border-color tr,.wp-block-table .has-border-color>*{border-color:inherit}.wp-block-table table[style*=border-top-color] tr:first-child,.wp-block-table table[style*=border-top-color] tr:first-child td,.wp-block-table table[style*=border-top-color] tr:first-child th,.wp-block-table table[style*=border-top-color]>*,.wp-block-table table[style*=border-top-color]>* td,.wp-block-table table[style*=border-top-color]>* th{border-top-color:inherit}.wp-block-table table[style*=border-top-color] tr:not(:first-child){border-top-color:currentColor}.wp-block-table table[style*=border-right-color] td:last-child,.wp-block-table table[style*=border-right-color] th,.wp-block-table table[style*=border-right-color] tr,.wp-block-table table[style*=border-right-color]>*{border-right-color:inherit}.wp-block-table table[style*=border-bottom-color] tr:last-child,.wp-block-table table[style*=border-bottom-color] tr:last-child td,.wp-block-table table[style*=border-bottom-color] tr:last-child th,.wp-block-table table[style*=border-bottom-color]>*,.wp-block-table table[style*=border-bottom-color]>* td,.wp-block-table table[style*=border-bottom-color]>* th{border-bottom-color:inherit}.wp-block-table table[style*=border-bottom-color] tr:not(:last-child){border-bottom-color:currentColor}.wp-block-table table[style*=border-left-color] td:first-child,.wp-block-table table[style*=border-left-color] th,.wp-block-table table[style*=border-left-color] tr,.wp-block-table table[style*=border-left-color]>*{border-left-color:inherit}.wp-block-table table[style*=border-style] td,.wp-block-table table[style*=border-style] th,.wp-block-table table[style*=border-style] tr,.wp-block-table table[style*=border-style]>*{border-style:inherit}.wp-block-table table[style*=border-width] td,.wp-block-table table[style*=border-width] th,.wp-block-table table[style*=border-width] tr,.wp-block-table table[style*=border-width]>*{border-style:inherit;border-width:inherit}
71/*# sourceURL=https://www.bau-haus.com/wp-includes/blocks/table/style.min.css */
72</style>
73
74
75<style id="global-styles-inline-css">
76:root{--wp--preset--aspect-ratio--square: 1;--wp--preset--aspect-ratio--4-3: 4/3;--wp--preset--aspect-ratio--3-4: 3/4;--wp--preset--aspect-ratio--3-2: 3/2;--wp--preset--aspect-ratio--2-3: 2/3;--wp--preset--aspect-ratio--16-9: 16/9;--wp--preset--aspect-ratio--9-16: 9/16;--wp--preset--color--black: #000000;--wp--preset--color--cyan-bluish-gray: #abb8c3;--wp--preset--color--white: #ffffff;--wp--preset--color--pale-pink: #f78da7;--wp--preset--color--vivid-red: #cf2e2e;--wp--preset--color--luminous-vivid-orange: #ff6900;--wp--preset--color--luminous-vivid-amber: #fcb900;--wp--preset--color--light-green-cyan: #7bdcb5;--wp--preset--color--vivid-green-cyan: #00d084;--wp--preset--color--pale-cyan-blue: #8ed1fc;--wp--preset--color--vivid-cyan-blue: #0693e3;--wp--preset--color--vivid-purple: #9b51e0;--wp--preset--color--paper: #FAFAF8;--wp--preset--color--ink: #1C1C1A;--wp--preset--color--muted: #6B7280;--wp--preset--color--rule: #E8E6E1;--wp--preset--color--accent: #8FA63A;--wp--preset--color--accent-solid: #728B2A;--wp--preset--color--surface: #F3F2EF;--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg,rgb(6,147,227) 0%,rgb(155,81,224) 100%);--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%);--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg,rgb(252,185,
760) 0%,rgb(255,105,0) 100%);--wp--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg,rgb(255,105,0) 0%,rgb(207,46,46) 100%);--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg,rgb(238,238,238) 0%,rgb(169,184,195) 100%);--wp--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg,rgb(74,234,220) 0%,rgb(151,120,209) 20%,rgb(207,42,186) 40%,rgb(238,44,130) 60%,rgb(251,105,98) 80%,rgb(254,248,76) 100%);--wp--preset--gradient--blush-light-purple: linear-gradient(135deg,rgb(255,206,236) 0%,rgb(152,150,240) 100%);--wp--preset--gradient--blush-bordeaux: linear-gradient(135deg,rgb(254,205,165) 0%,rgb(254,45,45) 50%,rgb(107,0,62) 100%);--wp--preset--gradient--luminous-dusk: linear-gradient(135deg,rgb(255,203,112) 0%,rgb(199,81,192) 50%,rgb(65,88,208) 100%);--wp--preset--gradient--pale-ocean: linear-gradient(135deg,rgb(255,245,203) 0%,rgb(182,227,212) 50%,rgb(51,167,181) 100%);--wp--preset--gradient--electric-grass: linear-gradient(135deg,rgb(202,248,128) 0%,rgb(113,206,126) 100%);--wp--preset--gradient--midnight: linear-gradient(135deg,rgb(2,3,129) 0%,rgb(40,116,252) 100%);--wp--preset--font-size--small: 13px;--wp--preset--font-size--medium: 20px;--wp--preset--font-size--large: 36px;--wp--preset--font-size--x-large: 42px;--wp--preset--font-size--body: 17px;--wp--preset--font-size--h-2: 18px;--wp--preset--font-size--h-1: 22px;--wp--preset--font-family--sans: "Meiryo", "メイリオ", "Hiragino Sans", "Yu Gothic UI", sans-serif;--wp--preset--font-family--mono: "JetBrains Mono", "Meiryo UI", monospace;--wp--preset--spacing--20: 0.44rem;--wp--preset--spacing--30: 0.67rem;--wp--preset--spacing--40: 1rem;--wp--preset--spacing--50: 1.5rem;--wp--preset--spacing--60: 2.25rem;--wp--preset--spacing--70: 3.38rem;--wp--preset--spacing--80: 5.06rem;--wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);--wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);--wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);--wp--preset--shadow--outlined: 6px 6px 0px -3px rgb(255, 255, 255), 6px 6px rgb(0, 0, 0);--wp--preset--shadow--crisp: 6px 6px 0px rgb(0, 0, 0);}.wp-block-button{--wp--preset--dimension--25: 25%;--wp--preset--dimension--50: 50%;--wp--preset--dimension--75: 75%;--wp--preset--dimension--100: 100%;}:root { --wp--style--global--content-size: 720px;--wp--style--global--wide-size: 1120px; }:where(body) { margin: 0; }.wp-site-blocks > .alignleft { float: left; margin-right: 2em; }.wp-site-blocks > .alignright { float: right; margin-left: 2em; }.wp-site-blocks > .aligncenter { justify-content: center; margin-left: auto; margin-right: auto; }:where(.is-layout-flex){gap: 0.5em;}:where(.is-layout-grid){gap: 0.5em;}.is-layout-flow > .alignleft{float: left;margin-inline-start: 0;margin-inline-end: 2em;}.is-layout-flow > .alignright{float: right;margin-inline-start: 2em;margin-inline-end: 0;}.is-layout-flow > .aligncenter{margin-left: auto !important;margin-right: auto !important;}.is-layout-constrained > .alignleft{float: left;margin-inline-start: 0;margin-inline-end: 2em;}.is-layout-constrained > .alignright{float: right;margin-inline-start: 2em;margin-inline-end: 0;}.is-layout-constrained > .aligncenter{margin-left: auto !important;margin-right: auto !important;}.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)){max-width: var(--wp--style--global--content-size);margin-left: auto !important;margin-right: auto !important;}.is-layout-constrained > .alignwide{max-width: var(--wp--style--global--wide-size);}body .is-layout-flex{display: flex;}.is-layout-flex{flex-wrap: wrap;align-items: center;}.is-layout-flex > :is(*, div){margin: 0;}body .is-layout-grid{display: grid;}.is-layout-grid > :is(*, div){margin: 0;}body{background-color: var(--wp--preset--color--paper);color: var(--wp--preset--color--ink);font-family: var(--wp--preset--font-family--sans);font-size: var(--wp--preset--font-size--body);line-height: 1.85;padding-top: 0px;padding-right: 0px;padding-bottom: 0px;padding-left: 0px;}:root :where(.wp-element-button, .wp-block-button__link){background-color: #32373c;border-width: 0;color: #fff;font-family: inherit;font-size: inherit;font-style: inherit;font-weight: inherit;letter-spacing: inherit;line-height: inherit;padding-top: calc(0.667em + 2px);padding-right: calc(1.333em + 2px);padding-bottom: calc(0.667em + 2px);padding-left: calc(1.333em + 2px);text-decoration: none;text-transform: inherit;}.has-black-color{color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-color{color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-color{color: var(--wp--preset--color--white) !important;}.has-pale-pink-color{color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-color{color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-color{color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-color{color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-color{color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-color{color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-color{color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-color{color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-color{color: var(--wp--preset--color--vivid-purple) !important;}.has-paper-color{color: var(--wp--preset--color--paper) !important;}.has-ink-color{color: var(--wp--preset--color--ink) !important;}.has-muted-color{color: var(--wp--preset--color--muted) !important;}.has-rule-color{color: var(--wp--preset--color--rule) !important;}.has-accent-color{color: var(--wp--preset--color--accent) !important;}.has-accent-solid-color{color: var(--wp--preset--color--accent-solid) !important;}.has-surface-color{color: var(--wp--preset--color--surface) !important;}.has-black-background-color{background-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-background-color{background-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-background-color{background-color: var(--wp--preset--color--white) !important;}.has-pale-pink-background-color{background-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-background-color{background-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-background-color{background-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-background-color{background-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-background-color{background-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-background-color{background-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-background-color{background-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-background-color{background-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-background-color{background-color: var(--wp--preset--color--vivid-purple) !important;}.has-paper-background-color{background-color: var(--wp--preset--color--paper) !important;}.has-ink-background-color{background-color: var(--wp--preset--color--ink) !important;}.has-muted-background-color{background-color: var(--wp--preset--color--muted) !important;}.has-rule-background-color{background-color: var(--wp--preset--color--rule) !important;}.has-accent-background-color{background-color: var(--wp--preset--color--accent) !important;}.has-accent-solid-background-color{background-color: var(--wp--preset--color--accent-solid) !important;}.has-surface-background-color{background-color: var(--wp--preset--color--surface) !important;}.has-black-border-color{border-color: var(--wp--preset--color--black) !important;}.has-cyan-bluish-gray-border-color{border-color: var(--wp--preset--color--cyan-bluish-gray) !important;}.has-white-border-color{border-color: var(--wp--preset--color--white) !important;}.has-pale-pink-border-color{border-color: var(--wp--preset--color--pale-pink) !important;}.has-vivid-red-border-color{border-color: var(--wp--preset--color--vivid-red) !important;}.has-luminous-vivid-orange-border-color{border-color: var(--wp--preset--color--luminous-vivid-orange) !important;}.has-luminous-vivid-amber-border-color{border-color: var(--wp--preset--color--luminous-vivid-amber) !important;}.has-light-green-cyan-border-color{border-color: var(--wp--preset--color--light-green-cyan) !important;}.has-vivid-green-cyan-border-color{border-color: var(--wp--preset--color--vivid-green-cyan) !important;}.has-pale-cyan-blue-border-color{border-color: var(--wp--preset--color--pale-cyan-blue) !important;}.has-vivid-cyan-blue-border-color{border-color: var(--wp--preset--color--vivid-cyan-blue) !important;}.has-vivid-purple-border-color{border-color: var(--wp--preset--color--vivid-purple) !important;}.has-paper-border-color{border-color: var(--wp--preset--color--paper) !important;}.has-ink-border-color{border-color: var(--wp--preset--color--ink) !important;}.has-muted-border-color{border-color: var(--wp--preset--color--muted) !important;}.has-rule-border-color{border-color: var(--wp--preset--color--rule) !important;}.has-accent-border-color{border-color: var(--wp--preset--color--accent) !important;}.has-accent-solid-border-color{border-color: var(--wp--preset--color--accent-solid) !important;}.has-surface-border-color{border-color: var(--wp--preset--color--surface) !important;}.has-vivid-cyan-blue-to-vivid-purple-gradient-background{background: var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;}.has-light-green-cyan-to-vivid-green-cyan-gradient-background{background: var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;}.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;}.has-luminous-vivid-orange-to-vivid-red-gradient-background{background: var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;}
76.has-very-light-gray-to-cyan-bluish-gray-gradient-background{background: var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;}.has-cool-to-warm-spectrum-gradient-background{background: var(--wp--preset--gradient--cool-to-warm-spectrum) !important;}.has-blush-light-purple-gradient-background{background: var(--wp--preset--gradient--blush-light-purple) !important;}.has-blush-bordeaux-gradient-background{background: var(--wp--preset--gradient--blush-bordeaux) !important;}.has-luminous-dusk-gradient-background{background: var(--wp--preset--gradient--luminous-dusk) !important;}.has-pale-ocean-gradient-background{background: var(--wp--preset--gradient--pale-ocean) !important;}.has-electric-grass-gradient-background{background: var(--wp--preset--gradient--electric-grass) !important;}.has-midnight-gradient-background{background: var(--wp--preset--gradient--midnight) !important;}.has-small-font-size{font-size: var(--wp--preset--font-size--small) !important;}.has-medium-font-size{font-size: var(--wp--preset--font-size--medium) !important;}.has-large-font-size{font-size: var(--wp--preset--font-size--large) !important;}.has-x-large-font-size{font-size: var(--wp--preset--font-size--x-large) !important;}.has-body-font-size{font-size: var(--wp--preset--font-size--body) !important;}.has-h-2-font-size{font-size: var(--wp--preset--font-size--h-2) !important;}.has-h-1-font-size{font-size: var(--wp--preset--font-size--h-1) !important;}.has-sans-font-family{font-family: var(--wp--preset--font-family--sans) !important;}.has-mono-font-family{font-family: var(--wp--preset--font-family--mono) !important;}
77/*# sourceURL=global-styles-inline-css */
78</style>
79
80<link rel='stylesheet' id='pz-linkcard-css-css' href='//www.bau-haus.com/wp-content/uploads/pz-linkcard/style/style.min.css?ver=2.6.1.0' media='all' />
81<link rel='stylesheet' id='responsive-lightbox-prettyphoto-css' href='https://www.bau-haus.com/wp-content/plugins/responsive-lightbox/assets/prettyphoto/prettyPhoto.min.css?ver=3.1.6' media='all' />
82<link rel='stylesheet' id='toc-screen-css' href='https://www.bau-haus.com/wp-content/plugins/table-of-contents-plus/assets/screen.min.css?ver=202609.1' media='all' />
83<style id="toc-screen-inline-css">
84div#toc_container {width: 100%;}
85/*# sourceURL=toc-screen-inline-css */
86</style>
87<style id="jetpack-stats-inline-css">
88img#wpstats{display:none}
89/*# sourceURL=jetpack-stats-inline-css */
90</style>
91<link rel='stylesheet' id='bauhaus-main-css' href='https://www.bau-haus.com/wp-content/themes/bauhaus-theme/assets/css/main.css?ver=0.2.17' media='all' />
92<script id="jquery-core-js" src="https://www.bau-haus.com/wp-includes/js/jquery/jquery.min.js?ver=3.7.1"></script>
vendor: 1 bytes, line 92
92
93<script id="jquery-migrate-js" src="https://www.bau-haus.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=3.4.1"></script>
vendor: 1 bytes, line 93
93
94<script id="responsive-lightbox-prettyphoto-js" src="https://www.bau-haus.com/wp-content/plugins/responsive-lightbox/assets/prettyphoto/jquery.prettyPhoto.min.js?ver=3.1.6"></script>
vendor: 1 bytes, line 94
94
95<script id="underscore-js" src="https://www.bau-haus.com/wp-includes/js/underscore.min.js?ver=1.13.8"></script>
vendor: 1 bytes, line 95
95
96<script id="responsive-lightbox-infinite-scroll-js" src="https://www.bau-haus.com/wp-content/plugins/responsive-lightbox/assets/infinitescroll/infinite-scroll.pkgd.min.js?ver=4.0.1"></script>
vendor: 1 bytes, line 96
96
97<script id="dompurify-js" src="https://www.bau-haus.com/wp-content/plugins/responsive-lightbox/assets/dompurify/purify.min.js?ver=3.3.1"></script>
vendor: 1 bytes, line 97
97
98<script id="responsive-lightbox-sanitizer-js-before">
99window.RLG = window.RLG || {}; window.RLG.sanitizeAllowedHosts = ["youtube.com","www.youtube.com","youtu.be","vimeo.com","player.vimeo.com"];
100//# sourceURL=responsive-lightbox-sanitizer-js-before
101</script>
vendor: 1 bytes, line 101
101
102<script id="responsive-lightbox-sanitizer-js" src="https://www.bau-haus.com/wp-content/plugins/responsive-lightbox/js/sanitizer.js?ver=2.7.9"></script>
vendor: 1 bytes, line 102
102
103<script id="responsive-lightbox-js-before">
104var rlArgs = {"script":"prettyphoto","selector":"lightbox","customEvents":"","activeGalleries":true,"animationSpeed":"normal","slideshow":false,"slideshowDelay":5000,"slideshowAutoplay":false,"opacity":"0.75","showTitle":true,"allowResize":true,"allowExpand":true,"width":1080,"height":720,"separator":"\/","theme":"pp_default","horizontalPadding":20,"hideFlash":false,"wmode":"opaque","videoAutoplay":false,"modal":false,"deeplinking":false,"overlayGallery":true,"keyboardShortcuts":true,"social":false,"woocommerce_gallery":false,"ajaxurl":"https:\/\/www.bau-haus.com\/wp-admin\/admin-ajax.php","nonce":"4709496698","preview":false,"postId":7021,"scriptExtension":false};
105
106//# sourceURL=responsive-lightbox-js-before
107</script>
vendor: 1 bytes, line 107
107
108<script id="responsive-lightbox-js" src="https://www.bau-haus.com/wp-content/plugins/responsive-lightbox/js/front.js?ver=2.7.9"></script>
108
109<link rel="https://api.w.org/" href="https://www.bau-haus.com/wp-json/" /><link rel="alternate" title="JSON" type="application/json" href="https://www.bau-haus.com/wp-json/wp/v2/pages/7021" /><link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://www.bau-haus.com/xmlrpc.php?rsd" />
110<meta name="generator" content="WordPress 7.1.2" />
111<link rel="canonical" href="https://www.bau-haus.com/learn/" />
112<link rel='shortlink' href='https://www.bau-haus.com/?p=7021' />
113<meta name="generator" content="Site Kit by Google 1.188.0" />
113<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5688146980618248"
114     crossorigin="anonymous"></script>
114
115
116<!-- Google tag (gtag.js) -->
vendor: 65 bytes, lines 116-117
116
117<script async src="https://www.googletagmanager.com/gtag/js?id=
117G-KE1FGYC9ML
vendor: 13 bytes, line 117
117"></script>
118<script>
119  
vendor: 138 bytes, lines 119-123
119window.dataLayer = window.dataLayer || [];
120  function gtag(){dataLayer.push(arguments);}
121  gtag('js', new Date());
122
123  gtag('config', '
123G-KE1FGYC9ML
vendor: 5 bytes, line 123
123');
124</script>
124
125<!-- Google AdSense メタタグ (Site Kit が追加) -->
126<meta name="google-adsense-platform-account" content="ca-host-pub-2644536267352236">
127<meta name="google-adsense-platform-domain" content="sitekit.withgoogle.com">
128<!-- (ここまで) Google AdSense メタタグ (Site Kit が追加) -->
129<meta name="description" content="チュートリアル・シリーズ記事の学習ロードマップ。Zenn 書籍(新刊・MarkdownBook)への入口と、学&hellip;" />
130
131<!-- Google AdSense スニペット (Site Kit が追加) -->
132<script async crossorigin="anonymous" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5688146980618248&#038;host=ca-host-pub-2644536267352236"></script>
132
133
134<!-- (ここまで) Google AdSense スニペット (Site Kit が追加) -->
135
136<!-- Jetpack Open Graph Tags -->
137<meta property="og:type" content="article" />
138<meta property="og:title" content="学習ハブ" />
139<meta property="og:url" content="https://www.bau-haus.com/learn/" />
140<meta property="og:description" content="チュートリアル・シリーズ記事の学習ロードマップ。Zenn 書籍(新刊・MarkdownBook)への入口と、学&hellip;" />
141<meta property="article:published_time" content="2026-07-09T10:13:24+00:00" />
142<meta property="article:modified_time" content="2026-09-21T00:59:14+00:00" />
143<meta property="og:site_name" content="BAUHAUS" />
144<meta property="og:image" content="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-ai-driven-dev-cursor.jpg" />
145<meta property="og:image:width" content="96" />
146<meta property="og:image:height" content="134" />
147<meta property="og:image:alt" content="Cursor で回す AI 駆動開発の表紙" />
148<meta property="og:locale" content="ja_JP" />
149<meta name="twitter:text:title" content="学習ハブ" />
150<meta name="twitter:image" content="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-ai-driven-dev-cursor.jpg?w=144" />
151<meta name="twitter:image:alt" content="Cursor で回す AI 駆動開発の表紙" />
152<meta name="twitter:card" content="summary" />
153
154<!-- End Jetpack Open Graph Tags -->
155<script type="application/ld+json">{"@context":"https://schema.org","@graph":[{"@type":"BreadcrumbList","@id":"https://www.bau-haus.com/learn/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"ホーム","item":"https://www.bau-haus.com/"},{"@type":"ListItem","position":2,"name":"学習ハブ"}]}]}</script>
155
156</head>
157<body class="wp-singular page-template-default page page-id-7021 wp-embed-responsive wp-theme-bauhaus-theme bauhaus-page">
158
159<div class="reading-progress" id="reading-progress" aria-hidden="true"></div>
160
161<header class="site-header" role="banner">
162    <div class="site-header__inner site-wrap">
163        <a class="site-logo" href="https://www.bau-haus.com/">BAUHAUS</a>
164
165                    <nav class="nav"><ul id="menu-primary-menu" class="nav__list"><li id="menu-item-7243" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item menu-item-7243"><a href="https://www.bau-haus.com/learn/" aria-current="page">学習ハブ</a></li>
166<li id="menu-item-7244" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-7244"><a href="https://www.bau-haus.com/blog/category/tech-trends/">テック動向</a></li>
167<li id="menu-item-7283" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-7283"><a href="#">カテゴリ</a>
168<ul class="sub-menu">
169	<li id="menu-item-7284" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-7284"><a href="https://www.bau-haus.com/blog/category/nextjs/">Next.js</a></li>
170	<li id="menu-item-7285" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-7285"><a href="https://www.bau-haus.com/blog/category/react/">React</a></li>
171	<li id="menu-item-7286" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-7286"><a href="https://www.bau-haus.com/blog/category/ai-dev/">AI駆動開発</a></li>
172	<li id="menu-item-7287" class="menu-item menu-item-type-taxonomy menu-item-object-category menu-item-7287"><a href="https://www.bau-haus.com/blog/category/design-color/">デザイン・色彩</a></li>
173</ul>
174</li>
175<li id="menu-item-7245" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-7245"><a href="https://www.bau-haus.com/about/">About</a></li>
176</ul></nav>        
177        <div class="site-header__actions">
178            <button type="button" class="theme-toggle" id="theme-toggle" aria-pressed="false" aria-label="Toggle dark mode">
179                ダーク            </button>
180            <form role="search" method="get" class="search-form" action="https://www.bau-haus.com/" data-bauhaus-search>
181    <label class="screen-reader-text" for="s">サイト内検索</label>
182    <input type="search" id="s" class="search-form__input" placeholder="検索…" value="" name="s" autocomplete="off">
183    <button type="submit" class="search-form__submit" aria-label="検索する">⌕</button>
184</form>
185        </div>
186    </div>
187</header>
188
189<main id="main" class="site-main">
190    <article class="page-content site-wrap site-wrap--narrow post-7021 page type-page status-publish hentry">
191        <nav class="breadcrumb" aria-label="Breadcrumb"><a href="https://www.bau-haus.com/">ホーム</a><span class="breadcrumb__sep"> › </span><span class="breadcrumb__current">学習ハブ</span></nav>        <header class="page-content__header">
192            <h1 class="page-content__title">学習ハブ</h1>
193        </header>
194        <div class="entry-content">
195            <!-- brief-amplify-vscode-learn-bridge-2026-09 -->
196<!-- brief-learn-zenn-covers-2026-08-19 -->
197<!-- brief-a10-zenn-books-2026-08-11 -->
198<!-- brief-learn-namethatui-2026-08-04 -->
199<!-- brief-learn-wan-catalog-2026-07-29 -->
200<!-- brief-amplify-2026-07-27 -->
201
202<p class="wp-block-paragraph">BAUHAUS の<strong>チュートリアル・シリーズ記事</strong>を、読む順序が分かるようにまとめた学習ハブです。旗艦シリーズから順に読み進められます。Zenn 書籍は下の「Zenn 書籍(いま読むなら)」からどうぞ。単発のチュートリアルは末尾の「その他」または<a href="https://www.bau-haus.com/blog/category/%e3%83%8e%e3%82%a6%e3%83%8f%e3%82%a6/">カテゴリ「ノウハウ」</a>から探せます。</p>
203
204
205
206<div id="toc_container" role="navigation" aria-label="Table of Contents" data-nosnippet class="toc_white no_bullets toc_title_center"><p class="toc_title">目次</p><ul class="toc_list"><li><a href="#Zenn">
206Zenn 書籍(いま読むなら)</a><ul><li><a href="#_Cursor_AI">新刊: Cursor で回す AI 駆動開発</a></li><li><a href="#_MarkdownBook_7">シリーズ: MarkdownBook 全7巻</a></li><li><a href="#_Zenn">過去の Zenn 書籍(無料)</a></li></ul></li><li><a href="#i">学習記録アプリ完全ガイド</a><ul><li><a href="#React_Nextjs">React 版と Next.js 版の選び方</a></li><li><a href="#React">React 版(読む順)</a></li><li><a href="#Nextjs">Next.js 版(読む順)</a></li></ul></li><li><a href="#React_Supabase">名刺アプリチュートリアル(React + Supabase)</a></li><li><a href="#Nextjs_Supabase">カレンダーメモアプリ(Next.js + Supabase)</a></li><li><a href="#AI">AI 駆動開発入門</a></li><li><a href="#i-2">その他のチュートリアル(単発・入門)</a></li></ul></div>
207<h2 class="wp-block-heading"><span id="Zenn">Zenn 書籍(いま読むなら)</span></h2>
208
209
210
211<p class="wp-block-paragraph">サイト内の連載とは別に、Zenn で公開している書籍への入口です。まずは無料で読める章・巻からご覧ください。</p>
212
213
214
215<h3 class="wp-block-heading"><span id="_Cursor_AI">新刊: Cursor で回す AI 駆動開発</span></h3>
216
217
218
219<p class="wp-block-paragraph">コードをコピーする本ではなく、<strong>正本・契約・検証・UI防衛の型</strong>を一冊にまとめた本です。はじめに・第1章は無料で読めます(本編 ¥500)。</p>
220
221
222
223<div style="display:flex;gap:14px;align-items:flex-start;margin:0.4em 0 0.55em;max-width:38em">
224<a href="https://zenn.dev/amayann/books/ai-driven-dev-cursor" target="_blank" rel="noopener noreferrer" style="flex:0 0 96px">
225<img decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-ai-driven-dev-cursor.jpg" alt="Cursor で回す AI 駆動開発の表紙" width="96" height="134" style="width:96px;height:134px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
226</a>
227<div style="min-width:0">
228<p style="margin:0 0 8px;font-size:15px;line-height:1.45">
229<a href="https://zenn.dev/amayann/books/ai-driven-dev-cursor" target="_blank" rel="noopener noreferrer" style="display:inline-flex;align-items:center;gap:6px">
230<img decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-zenn-mark.png" alt="" width="16" height="16" style="width:16px;height:16px;margin:0;flex:0 0 16px"/>
231<span>Cursor で回す AI 駆動開発</span>
232</a>
233</p>
234<p style="margin:0;font-size:13px;line-height:1.55">
235<a href="https://zenn.dev/amayann/books/ai-driven-dev-cursor/viewer/01-intro" target="_blank" rel="noopener noreferrer">無料・はじめに</a>
236</p>
237</div>
238</div>
239<p style="margin:0 0 1.35em;display:flex;align-items:center;flex-wrap:wrap;gap:0 6px;font-size:15px;line-height:1.7">
240<span>裏側は</span>
241<a href="https://zenn.dev/amayann/articles/ai-driven-dev-cursor-creation" target="_blank" rel="noopener noreferrer" style="display:inline-flex;align-items:center;gap:4px">
242<img decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-zenn-mark.png" alt="" width="16" height="16" style="width:16px;height:16px;margin:0;flex:0 0 16px"/>
243<span>メイキング</span>
244</a>
245<span>です。</span>
246</p>
247
248
249
250<h3 class="wp-block-heading"><span id="_MarkdownBook_7">シリーズ: MarkdownBook 全7巻</span></h3>
251
252
253
254<p class="wp-block-paragraph">アプリを積み上げるハンズオン全7巻です。第1・2巻は無料で読めます。</p>
255
256
257
258<div style="display:flex;flex-wrap:wrap;gap:12px 14px;margin:0.4em 0 1em">
259<a href="https://zenn.dev/amayann/books/markdownbook-01-foundation" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
260<img decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-markdownbook-01.jpg" alt="MarkdownBook 第1巻の表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
261<span style="margin-top:6px">第1巻<br/>(無料)</span>
262</a>
263<a href="https://zenn.dev/amayann/books/markdownbook-02-content" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
264<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-markdownbook-02.jpg" alt="MarkdownBook 第2巻の表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
265<span style="margin-top:6px">第2巻<br/>(無料)</span>
266</a>
267<a href="https://zenn.dev/amayann/books/markdownbook-03-search" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
268<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-markdownbook-03.jpg" alt="MarkdownBook 第3巻の表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
269<span style="margin-top:6px">第3巻</span>
270</a>
271<a href="https://zenn.dev/amayann/books/markdownbook-04-auth" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
272<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-markdownbook-04.
272jpg" alt="MarkdownBook 第4巻の表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
273<span style="margin-top:6px">第4巻</span>
274</a>
275<a href="https://zenn.dev/amayann/books/markdownbook-05-payment" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
276<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-markdownbook-05.jpg" alt="MarkdownBook 第5巻の表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
277<span style="margin-top:6px">第5巻</span>
278</a>
279<a href="https://zenn.dev/amayann/books/markdownbook-06-pdf" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
280<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-markdownbook-06.jpg" alt="MarkdownBook 第6巻の表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
281<span style="margin-top:6px">第6巻</span>
282</a>
283<a href="https://zenn.dev/amayann/books/markdownbook-07-admin" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
284<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-markdownbook-07.jpg" alt="MarkdownBook 第7巻の表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
285<span style="margin-top:6px">第7巻</span>
286</a>
287</div>
288
289
290
291<p style="margin:0.15em 0 1.35em;display:flex;align-items:center;flex-wrap:wrap;gap:0 6px;font-size:15px;line-height:1.7">
292<span>シリーズの裏側は</span>
293<a href="https://zenn.dev/amayann/articles/markdownbook-creation-process" target="_blank" rel="noopener noreferrer" style="display:inline-flex;align-items:center;gap:4px">
294<img decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-zenn-mark.png" alt="" width="16" height="16" style="width:16px;height:16px;margin:0;flex:0 0 16px"/>
295<span>MarkdownBook メイキング</span>
296</a>
297<span>にまとめています。</span>
298</p>
299
300
301
302<h3 class="wp-block-heading"><span id="_Zenn">過去の Zenn 書籍(無料)</span></h3>
303
304
305
306<p class="wp-block-paragraph">サイト内連載に対応した Zenn 書籍です。無料で全チャプターを読めます。</p>
307
308
309
310<div style="display:flex;flex-wrap:wrap;gap:12px 14px;margin:0.4em 0 1em">
311<a href="https://zenn.dev/amayann/books/0d6c7caea3626b" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
312<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-legacy-react-firebase-learning-2.jpg" alt="React + Firebaseによる学習記録アプリ チュートリアルの表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
313<span style="margin-top:6px">React +<br/>Firebase<br/>学習記録</span>
314</a>
315<a href="https://zenn.dev/amayann/books/ecf7145aa6dca9" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
316<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-legacy-nextjs-firebase-learning-2.jpg" alt="Next.js + Firebaseによる学習記録アプリ チュートリアルの表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
317<span style="margin-top:6px">Next.js +<br/>
317Firebase<br/>学習記録</span>
318</a>
319<a href="https://zenn.dev/amayann/books/e53053d79e1f56" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
320<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-legacy-react-firebase-tracker-2.jpg" alt="React + Firebase 日々トラッカーアプリ開発の表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
321<span style="margin-top:6px">React +<br/>Firebase<br/>日々トラッカー</span>
322</a>
323<a href="https://zenn.dev/amayann/books/83b4298bd4ec40" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
324<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-legacy-nextjs-supabase-calendar-2.jpg" alt="Next.js + Supabase カレンダーメモアプリの表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
325<span style="margin-top:6px">Next.js +<br/>Supabase<br/>カレンダー</span>
326</a>
327<a href="https://zenn.dev/amayann/books/a031d61853e3d4" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
328<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-legacy-nextjs-mongodb-todo-2.jpg" alt="Next.js + MongoDB カード型TODOアプリの表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
329<span style="margin-top:6px">Next.js +<br/>MongoDB<br/>TODO</span>
330</a>
331<a href="https://zenn.dev/amayann/books/18f5c79fb4778b" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
332<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-legacy-nextjs-supabase-task-2.jpg" alt="Next.js + Supabase タスク管理アプリの表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
333<span style="margin-top:6px">Next.js +<br/>Supabase<br/>タスク管理</span>
334</a>
335<a href="https://zenn.dev/amayann/books/6a78a940e7bfc3" target="_blank" rel="noopener noreferrer" style="display:flex;flex-direction:column;width:76px;font-size:12px;line-height:1.35;text-align:center">
336<img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/08/learn-hub-cover-legacy-nextjs-supabase-task-auth-2.jpg" alt="Next.js + Supabase タスク管理アプリ ユーザー認証編の表紙" width="76" height="106" style="width:76px;height:106px;object-fit:cover;border-radius:3px;box-shadow:0 1px 4px rgba(0,0,0,.18);display:block;margin:0"/>
337<span style="margin-top:6px">Next.js +<br/>Supabase<br/>認証編</span>
338</a>
339</div>
340
341
342
343<h2 class="wp-block-heading"><span id="i">学習記録アプリ完全ガイド</span></h2>
344
345
346
347<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-learning-16x9-1.jpg" alt="学習記録アプリの実装イメージ(React/Next.js)" class="wp-image-7027" width="1280" height="720" srcset="https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-learning-16x9-1.jpg 1280w, https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-learning-16x9-1-300x169.jpg 300w, https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-learning-16x9-1-1024x576.jpg 1024w, https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-learning-16x9-1-768x432.jpg 768w" sizes="auto, (max-width: 1280px) 100v
347w, 1280px" /></figure>
348
349
350
351<p class="wp-block-paragraph">学習内容を記録するアプリを、<strong>React(CRA)</strong>または<strong>Next.js(App Router)</strong>で作る連載です。Supabase 入門から Firebase 認証・DB、Zenn 書籍化までをカバーします。</p>
352
353
354
355<h3 class="wp-block-heading"><span id="React_Nextjs">React 版と Next.js 版の選び方</span></h3>
356
357
358
359<figure class="wp-block-table"><table><thead><tr><th>観点</th><th>React 版</th><th>Next.js 版</th></tr></thead><tbody><tr><td>向いている人</td><td>CRA / Vite から React に入門したい</td><td>App Router 前提で学びたい</td></tr><tr><td>主な BaaS</td><td>Supabase → Firebase</td><td>Firebase(Admin SDK 編あり)</td></tr><tr><td>最初の記事</td><td>チュートリアル 1</td><td>Firebase 認証・DB(前編)</td></tr><tr><td>冊子化のまとめ</td><td>Zenn 書籍化(React)</td><td>Zenn 書籍化(Next.js)</td></tr></tbody></table></figure>
360
361
362
363<h3 class="wp-block-heading"><span id="React">React 版(読む順)</span></h3>
364
365
366
367<ol class="wp-block-list">
368<li><a href="https://www.bau-haus.com/blog/2024/09/08/react%e3%83%81%e3%83%a5%e3%83%bc%e3%83%88%e3%83%aa%e3%82%a2%e3%83%ab-%e5%ad%a6%e7%bf%92%e8%a8%98%e9%8c%b2%e3%82%a2%e3%83%97%e3%83%aa-1/">チュートリアル 学習記録アプリ 1</a></li>
369<li><a href="https://www.bau-haus.com/blog/2024/09/19/react%e3%83%81%e3%83%a5%e3%83%bc%e3%83%88%e3%83%aa%e3%82%a2%e3%83%ab-%e5%ad%a6%e7%bf%92%e8%a8%98%e9%8c%b2%e3%82%a2%e3%83%97%e3%83%aa-2-supabase%e7%b7%a8/">チュートリアル 学習記録アプリ 2 Supabase 編</a></li>
370<li><a href="https://www.bau-haus.com/blog/2024/10/03/react-%e3%83%81%e3%83%a5%e3%83%bc%e3%83%88%e3%83%aa%e3%82%a2%e3%83%ab-%e5%ad%a6%e7%bf%92%e8%a8%98%e9%8c%b2%e3%82%a2%e3%83%97%e3%83%aa-3-%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e8%aa%8d%e8%a8%bc/">ユーザー認証実装(前編)</a></li>
371<li><a href="https://www.bau-haus.com/blog/2024/10/07/react-%e3%83%81%e3%83%a5%e3%83%bc%e3%83%88%e3%83%aa%e3%82%a2%e3%83%ab-%e5%ad%a6%e7%bf%92%e8%a8%98%e9%8c%b2%e3%82%a2%e3%83%97%e3%83%aa-3-%e3%83%a6%e3%83%bc%e3%82%b6%e3%83%bc%e8%aa%8d%e8%a8%bc-2/">ユーザー認証実装(後編)</a></li>
372<li><a href="https://www.bau-haus.com/blog/2024/12/01/react-%e3%83%81%e3%83%a5%e3%83%bc%e3%83%88%e3%83%aa%e3%82%a2%e3%83%ab-%e5%ad%a6%e7%bf%92%e8%a8%98%e9%8c%b2%e3%82%a2%e3%83%97%e3%83%aa-firebase%e3%81%a7%e8%aa%8d%e8%a8%bc%e3%83%bbdb%e5%ae%9f%e8%a3%85/">Firebase で認証・DB 実装(前編)</a></li>
373<li><a href="https://www.bau-haus.com/blog/2024/12/15/react-%e3%83%81%e3%83%a5%e3%83%bc%e3%83%88%e3%83%aa%e3%82%a2%e3%83%ab-%e5%ad%a6%e7%bf%92%e8%a8%98%e9%8c%b2%e3%82%a2%e3%83%97%e3%83%aa-firebase%e3%81%a7%e8%aa%8d%e8%a8%bc%e3%83%bbdb%e5%ae%9f%e8%a3%85-2/">Firebase で認証・DB 実装(後編)</a></li>
374<li><a href="https://www.bau-haus.com/blog/2025/03/11/react-%e5%ad%a6%e7%bf%92%e8%a8%98%e9%8c%b2%e3%82%a2%e3%83%97%e3%83%aa-with-firebase%e3%80%81zenn%e3%81%a7%e6%9b%b8%e7%b1%8d%e5%8c%96%e3%81%97%e3%81%a6%e3%81%bf%e3%81%be%e3%81%97%e3%81%9f/">Zenn で書籍化してみた(React)</a></li>
375</ol>
376
377
378
379<h3 class="wp-block-heading"><span id="Nextjs">Next.js 版(読む順)</span></h3>
380
381
382
383<ol class="wp-block-list">
384<li><a href="https://www.bau-haus.com/blog/2025/01/10/next-js-%e5%ad%a6%e7%bf%92%e8%a8%98%e9%8c%b2%e3%82%a2%e3%83%97%e3%83%aa-firebase%e8%aa%8d%e8%a8%bc%e3%83%bbdb%e5%ae%9f%e8%a3%85-%ef%bc%88%e5%89%8d%e7%b7%a8%ef%bc%89/">Firebase 認証・DB 実装(前編)</a></li>
385<li><a href="https://www.bau-haus.com/blog/2025/01/25/next-js-%e5%ad%a6%e7%bf%92%e8%a8%98%e9%8c%b2%e3%82%a2%e3%83%97%e3%83%aa-firebase%e8%aa%8d%e8%a8%bc%e3%83%bbdb%e5%ae%9f%e8%a3%85-%ef%bc%88%e5%be%8c%e7%b7%a8%ef%bc%89/">Firebase 認証・DB 実装(後編)</a></li>
386<li><a href="https://www.bau-haus.com/blog/2025/02/23/next-js-%e5%ad%a6%e7%bf%92%e8%a8%98%e9%8c%b2%e3%82%a2%e3%83%97%e3%83%aa-firebase%e8%aa%8d%e8%a8%bc%e3%83%bbdb%e5%ae%9f%e8%a3%85-%ef%bc%88admin-sdk%e7%b7%a8%ef%bc%89/">Firebase 認証・DB 実装(Admin SDK 編)</a></li>
387<li><a href="https://www.bau-haus.com/blog/2025/03/23/next-js-%e5%ad%a6%e7%bf%92%e8%
387a8%98%e9%8c%b2%e3%82%a2%e3%83%97%e3%83%aa-firebase%e8%aa%8d%e8%a8%bc%e3%83%bbdb%e5%ae%9f%e8%a3%85-zenn%e3%81%a7%e6%9b%b8%e7%b1%8d%e5%8c%96%e3%81%97%e3%81%a6%e3%81%bf/">Zenn で書籍化してみた(Next.js)</a></li>
388</ol>
389
390
391
392<h2 class="wp-block-heading"><span id="React_Supabase">名刺アプリチュートリアル(React + Supabase)</span></h2>
393
394
395
396<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-business-card-16x9-1.jpg" alt="名刺アプリの実装イメージ(React + Supabase)" class="wp-image-7028" width="1280" height="720" srcset="https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-business-card-16x9-1.jpg 1280w, https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-business-card-16x9-1-300x169.jpg 300w, https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-business-card-16x9-1-1024x576.jpg 1024w, https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-business-card-16x9-1-768x432.jpg 768w" sizes="auto, (max-width: 1280px) 100vw, 1280px" /></figure>
397
398
399
400<p class="wp-block-paragraph">名刺情報を管理するアプリを React と Supabase で構築するシリーズです。</p>
401
402
403
404<ol class="wp-block-list">
405<li><a href="https://www.bau-haus.com/blog/2024/10/23/react-%e3%83%81%e3%83%a5%e3%83%bc%e3%83%88%e3%83%aa%e3%82%a2%e3%83%ab-%e5%90%8d%e5%88%ba%e3%82%a2%e3%83%97%e3%83%aa-supabase%e9%80%a3%e6%90%ba-%ef%bc%88%e5%89%8d%e7%b7%a8%ef%bc%89/">Supabase 連携(前編)</a></li>
406<li><a href="https://www.bau-haus.com/blog/2024/11/03/react-%e3%83%81%e3%83%a5%e3%83%bc%e3%83%88%e3%83%aa%e3%82%a2%e3%83%ab-%e5%90%8d%e5%88%ba%e3%82%a2%e3%83%97%e3%83%aa-supabase%e9%80%a3%e6%90%ba-%ef%bc%88%e5%be%8c%e7%b7%a8%ef%bc%89/">Supabase 連携(後編)</a></li>
407<li><a href="https://www.bau-haus.com/blog/2024/11/18/react-%e3%83%81%e3%83%a5%e3%83%bc%e3%83%88%e3%83%aa%e3%82%a2%e3%83%ab-%e5%90%8d%e5%88%ba%e3%82%a2%e3%83%97%e3%83%aa-supabase%e9%80%a3%e6%90%ba-%ef%bc%88%e6%8b%a1%e5%bc%b5%e7%b7%a8%ef%bc%89/">Supabase 連携(拡張編)</a></li>
408</ol>
409
410
411
412<h2 class="wp-block-heading"><span id="Nextjs_Supabase">カレンダーメモアプリ(Next.js + Supabase)</span></h2>
413
414
415
416<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-calendar-16x9-1.jpg" alt="カレンダーメモアプリの画面イメージ(Next.js + Supabase)" class="wp-image-7029" width="1280" height="720" srcset="https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-calendar-16x9-1.jpg 1280w, https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-calendar-16x9-1-300x169.jpg 300w, https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-calendar-16x9-1-1024x576.jpg 1024w, https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-calendar-16x9-1-768x432.jpg 768w" sizes="auto, (max-width: 1280px) 100vw, 1280px" /></figure>
417
418
419
420<p class="wp-block-paragraph">カレンダー UI とメモを組み合わせたアプリを Next.js と Supabase で作る前後編です。</p>
421
422
423
424<ol class="wp-block-list">
425<li><a href="https://www.bau-haus.com/blog/2025/06/02/next-js-supabase-%e3%82%ab%e3%83%ac%e3%83%b3%e3%83%80%e3%83%bc%e3%83%a1%e3%83%a2%e3%82%a2%e3%83%97%e3%83%aa-%e3%83%81%e3%83%a5%e3%83%bc%e3%83%88%e3%83%aa%e3%82%a2%e3%83%ab-%e5%89%8d%e7%b7%a8/">チュートリアル(前編)</a></li>
426<li><a href="https://www.bau-haus.com/blog/2025/06/02/next-js-supabase-%e3%82%ab%e3%83%ac%e3%83%b3%e3%83%80%e3%83%bc%e3%83%a1%e3%83%a2%e3%82%a2%e3%83%97%e3%83%aa-%e3%83%81%e3%83%a5%e3%83%bc%e3%83%88%e3%83%aa%e3%82%a2%e3%83%ab-%e5%be%8c%e7%b7%a8/">チュートリアル(後編)</a></li>
427</ol>
428
429
430
431<h2 class="wp-block-heading"><span id="AI">AI 駆動開発入門</span></h2>
432
433
434
435<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" src="https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-ai-dev-16x9-1.jpg" alt="AI駆動開発の事例イメージ(Colorism v2)" class="wp-image-7030" width="1280" height="720" srcset="https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-ai-dev-16x9-1.jpg 1280w, https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-ai-dev-16x9-1-300x169.jpg 300w, https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-ai-dev-16x9-1-1024x576.jpg 1024w, https://www.bau-haus.com/wp-content/uploads/2026/07/learn-hub-ai-dev-16x9-1-768x432.jpg 768w" sizes="auto, (max-width: 1280px) 100v
435w, 1280px" /></figure>
436
437
438
439<p class="wp-block-paragraph">仕様駆動開発・Cursor / Kiro の活用、Colorism v2 の再構築など、AI 時代の開発フローを扱う記事です。</p>
440
441
442
443<ul class="wp-block-list">
444<li><a href="https://www.bau-haus.com/blog/2025/09/29/kiro%e3%81%a8cursor%e3%82%92%e6%b4%bb%e7%94%a8%e3%81%97%e3%81%9f%e4%bb%95%e6%a7%98%e9%a7%86%e5%8b%95%e9%96%8b%e7%99%ba/">Kiro と Cursor を活用した仕様駆動開発</a>(進め方・ツール)</li>
445<li><a href="https://www.bau-haus.com/blog/2026/06/06/colorism-v2-spec-driven-rebuild/">Colorism v2: 色彩学習アプリを作り直した話</a>(開発記)</li>
446<li><a href="https://www.bau-haus.com/blog/2026/07/17/spec-driven-judgment-lessons/">仕様駆動をやってみて分かったこと</a>(判断・正本ドキュメントの観察記)</li>
447<li><a href="https://www.bau-haus.com/blog/2026/07/20/cursor-3-11-side-chats-conversation-search/">Cursor 3.11 — Side Chats と会話検索</a>(本線を止めずに別質問)</li>
448<li><a href="https://www.bau-haus.com/blog/2026/07/29/wan-personal-catalog-ai-driven/">WANのプロンプト履歴が探しにくくて、自分用カタログを作った話</a>(個人用途ツール・探すより足す)</li>
449<li><a href="https://www.bau-haus.com/blog/2026/08/04/namethatui-ui-name-agent-prompt-dictionary/">Name That UI(NameThatUI)— UI部品の呼び名とエージェント向けプロンプト</a>(デザイン実装短報)</li>
450<li><a href="https://www.bau-haus.com/blog/2024/11/14/vscode-%e8%87%aa%e5%8b%95%e8%a3%9c%e5%ae%8c%e6%a9%9f%e8%83%bd%e3%81%8c%e5%8a%b9%e3%81%8b%e3%81%aa%e3%81%8f%e3%81%aa%e3%81%a3%e3%81%9f/">VSCodeの補完・予測変換(サジェスト)が出ないときの対処法</a>(開発環境の整備)</li>
451</ul>
452
453
454
455<h2 class="wp-block-heading"><span id="i-2">その他のチュートリアル(単発・入門)</span></h2>
456
457
458
459<p class="wp-block-paragraph">上記シリーズ以外の入門記事・Tips です。古いレガシー記事も含めた一覧は<a href="https://www.bau-haus.com/blog/category/%e3%83%8e%e3%82%a6%e3%83%8f%e3%82%a6/">カテゴリ「ノウハウ」</a>を参照してください。</p>
460
461
462
463<ul class="wp-block-list">
464<li><a href="https://www.bau-haus.com/blog/2024/08/22/reacttodo%e3%83%aa%e3%82%b9%e3%83%88%e3%81%ae%e4%bd%9c%e6%88%90-%e5%88%9d%e5%ad%a6%e8%80%85%e5%90%91%e3%81%91%ef%bc%91/">[React] Todo リストの作成(初学者向け 1)</a></li>
465<li><a href="https://www.bau-haus.com/blog/2024/08/25/reacttodo%e3%83%aa%e3%82%b9%e3%83%88%e3%81%ae%e4%bd%9c%e6%88%90-%e5%88%9d%e5%ad%a6%e8%80%85%e5%90%91%e3%81%91%ef%bc%92/">[React] Todo リストの作成(初学者向け 2)</a></li>
466<li><a href="https://www.bau-haus.com/blog/2024/10/15/css-%e3%83%ac%e3%82%b9%e3%83%9d%e3%83%b3%e3%82%b7%e3%83%96%e3%81%aafont-size%e6%8c%87%e5%ae%9a/">[CSS] レスポンシブな font-size 指定</a></li>
467<li><a href="https://www.bau-haus.com/blog/2025/02/09/google-cloud-shell-%e3%81%8c%e7%b4%a0%e6%99%b4%e3%82%89%e3%81%97%e3%81%99%e3%81%8e%e3%82%8b/">Google Cloud Shell が素晴らしすぎる</a></li>
468</ul>
469
470
471
472<p class="wp-block-paragraph">運営者ページは<a href="https://www.bau-haus.com/about/">About</a>、サイト全体の方針は<a href="https://www.bau-haus.com/">トップページ</a>からどうぞ。</p>
473
474        </div>
475    </article>
476    </main>
477
478<footer class="site-footer site-wrap" role="contentinfo">
479        <nav class="footer-nav" aria-label="Footer">
480        <a href="https://www.bau-haus.com/learn/">学習ハブ</a>
481        <a href="https://www.bau-haus.com/blog/category/tech-trends/">テック動向</a>
482                    <a href="https://www.bau-haus.com/blog/category/nextjs/">Next.js</a>
483                    <a href="https://www.bau-haus.com/blog/category/react/">React</a>
484                    <a href="https://www.bau-haus.com/blog/category/ai-dev/">AI駆動開発</a>
485                    <a href="https://www.bau-haus.com/blog/category/design-color/">デザイン・色彩</a>
486                <a href="https://www.bau-haus.com/about/">About</a>
487    </nav>
488    <p class="site-footer__copy">&copy; 2026 BAUHAUS</p>
489</footer>
490<script type="speculationrules">
491{"prefetch":[{"source":"document","where":{"and":[{"href_matches":"/*"},{"not":{"href_matches":["/wp-*.php","/wp-admin/*","/wp-content/uploads/*","/wp-content/*","/wp-content/plugins/*","/wp-content/themes/bauhaus-theme/*","/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]}
492</script>
vendor: 1 bytes, line 492
492
493<script id="pz-linkcard-excerpt-fit-js" src="https://www.bau-haus.com/wp-content/plugins/pz-linkcard/js/excerpt-fit.js?ver=2.6.1"></script>
vendor: 1 bytes, line 493
493
494<script id="pz-lkc-click-js-extra">
495var pz_lkc_ajax = {"ajax_url":"https://www.bau-haus.com/wp-admin/admin-ajax.php","nonce":"134b3b376a"};
496//# sourceURL=pz-lkc-click-js-extra
497</script>
vendor: 1 bytes, line 497
497
498<script id="pz-lkc-click-js" src="https://www.bau-haus.com/wp-content/plugins/pz-linkcard/js/click-counter.js?ver=2.6.1"></script>
vendor: 1 bytes, line 498
498
499<script id="toc-front-js-extra">
500var tocplus = {"smooth_scroll":"1","visibility_show":"show","visibility_hide":"hide","toggle_style":"brackets","width":"100%","smooth_scroll_offset":"120"};
501//# sourceURL=toc-front-js-extra
502</script>
vendor: 1 bytes, line 502
502
503<script id="toc-front-js" src="https://www.bau-haus.com/wp-content/plugins/table-of-contents-plus/assets/front.min.js?ver=202609.1"></script>
vendor: 1 bytes, line 503
503
504<script id="bauhaus-theme-js" src="https://www.bau-haus.com/wp-content/themes/bauhaus-theme/assets/js/theme.js?ver=0.2.17"></script>
vendor: 1 bytes, line 504
504
505<script id="googlesitekit-consent-mode-js" src="https://www.bau-haus.com/wp-content/plugins/google-site-kit/dist/assets/js/googlesitekit-consent-mode-755f1678e260138d789e.js"></script>
vendor: 1 bytes, line 505
505
506<script id="q2w3_fixed_widget-js-extra">
507var q2w3_sidebar_options = [{"use_sticky_position":false,"margin_top":50,"margin_bottom":0,"stop_elements_selectors":"","screen_max_width":0,"screen_max_height":0,"widgets":[]}];
508//# sourceURL=q2w3_fixed_widget-js-extra
509</script>
vendor: 1 bytes, line 509
509
510<script id="q2w3_fixed_widget-js" src="https://www.bau-haus.com/wp-content/plugins/q2w3-fixed-widget/js/frontend.min.js?ver=6.2.3"></script>
vendor: 1 bytes, line 510
510
511<script id="jetpack-stats-js-before">
512_stq = window._stq || [];
513_stq.push([ "view", {"v":"ext","blog":"232379270","post":"7021","tz":"9","srv":"www.bau-haus.com","j":"1:16.2"} ]);
514_stq.push([ "clickTrackerInit", "232379270", "7021" ]);
515//# sourceURL=jetpack-stats-js-before
516</script>
vendor: 1 bytes, line 516
516
517<script data-wp-strategy="defer" defer fetchpriority="low" id="jetpack-stats-js" src="https://stats.wp.com/e-202640.js"></script>
vendor: 1 bytes, line 517
517
518<script id="wp-emoji-settings" type="application/json">
519{"baseUrl":"https://s.w.org/images/core/emoji/17.0.2/72x72/","ext":".png","svgUrl":"https://s.w.org/images/core/emoji/17.0.2/svg/","svgExt":".svg","source":{"concatemoji":"https://www.bau-haus.com/wp-includes/js/wp-emoji-release.min.js?ver=7.1.2"}}
520</script>
vendor: 1 bytes, line 520
520
521<script type="module">
522/*! This file is auto-generated */
523var e="script#wp-emoji-settings",t=document.querySelector(e);if(!(t instanceof HTMLScriptElement))throw new Error("Element missing: "+e);const r=JSON.parse(t.text),s=(window._wpemojiSettings=r,"wpEmojiSettingsSupports"),o=["flag","emoji"];function i(e){try{var t={supportTests:e,timestamp:(new Date).valueOf()};sessionStorage.setItem(s,JSON.stringify(t))}catch(e){}}function c(e,t,n){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);t=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data);e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(n,0,0);const r=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data);return t.every((e,t)=>e===r[t])}function p(e,t){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);var n=e.getImageData(16,16,1,1);for(let e=0;e<n.data.length;e++)if(0!==n.data[e])return!1;return!0}function u(e,t,n,r){switch(t){case"flag":return n(e,"\ud83c\udff3\ufe0f\u200d\u26a7\ufe0f","\ud83c\udff3\ufe0f\u200b\u26a7\ufe0f")?!1:!n(e,"\ud83c\udde8\ud83c\uddf6","\ud83c\udde8\u200b\ud83c\uddf6")&&!n(e,"\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc65\udb40\udc6e\udb40\udc67\udb40\udc7f","\ud83c\udff4\u200b\udb40\udc67\u200b\udb40\udc62\u200b\udb40\udc65\u200b\udb40\udc6e\u200b\udb40\udc67\u200b\udb40\udc7f");case"emoji":return!r(e,"\ud83e\u1fac8")}return!1}function f(e,t,n,r){let a;const s=(a="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?new OffscreenCanvas(300,150):document.createElement("canvas")).getContext("2d",{willReadFrequently:!0}),o=(s.textBaseline="top",s.font="600 32px Arial",{});return e.forEach(e=>{o[e]=t(s,e,n,r)}),o}function a(e){var t=document.createElement("script");t.src=e,t.defer=!0,document.head.appendChild(t)}r.supports={everything:!0,everythingExceptFlag:!0},new Promise(t=>{let n=function(){try{var e=JSON.parse(sessionStorage.getItem(s));if("object"==typeof e&&"number"==typeof e.timestamp&&(new Date).valueOf()<e.timestamp+604800&&"object"==typeof e.supportTests)return e.supportTests}catch(e){}return null}();if(!n){if("undefined"!=typeof Worker&&"undefined"!=typeof OffscreenCanvas&&"undefined"!=typeof URL&&URL.createObjectURL&&"undefined"!=typeof Blob)try{var e="postMessage("+f.toString()+"("+[JSON.stringify(o),u.toString(),c.toString(),p.toString()].join(",")+"));",r=new Blob([e],{type:"text/javascript"});const a=new Worker(URL.createObjectURL(r),{name:"wpTestEmojiSupports"});return void(a.onmessage=e=>{i(n=e.data),a.terminate(),t(n)})}catch(e){}i(n=f(o,u,c,p))}t(n)}).then(e=>{for(const n in e)r.supports[n]=e[n],r.supports.everything=r.supports.everything&&r.supports[n],"flag"!==n&&(r.supports.everythingExceptFlag=r.supports.everythingExceptFlag&&r.supports[n]);var t;r.supports.everythingExceptFlag=r.supports.everythingExceptFlag&&!r.supports.flag,r.supports.everything||((t=r.source||{}).concatemoji?a(t.concatemoji):t.wpemoji&&t.twemoji&&(a(t.twemoji),a(t.wpemoji)))});
524//# sourceURL=https://www.bau-haus.com/wp-includes/js/wp-emoji-loader.min.js
525</script>
525
526</body>
527</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.