Connect the web book to the hub and add reading progress

README.md

@@ -23,7 +23,7 @@ Matheus Facure의 [Causal Inference for The Brave and True](https://matheusfacur
   <a href="https://doi.org/10.5281/zenodo.4445778"><img src="https://img.shields.io/badge/%EC%9B%90%EC%84%9C%20DOI-10.5281%2Fzenodo.4445778-blue" alt="원서 DOI"></a>
 </p>
 
-**[웹북으로 읽기](https://causalinferencelab.github.io/Causal-Inference-with-Python/)** · [용어집](https://causalinferencelab.github.io/Causal-Inference-with-Python/glossary.html) · [번역 가이드](TRANSLATION_GUIDE.md) · [오류 제보](https://github.com/CausalInferenceLab/Causal-Inference-with-Python/issues)
+**[웹북으로 읽기](https://causalinferencelab.github.io/Causal-Inference-with-Python/)** · [인과추론 허브](https://causalinferencelab.github.io/) · [용어집](https://causalinferencelab.github.io/Causal-Inference-with-Python/glossary.html) · [번역 가이드](TRANSLATION_GUIDE.md) · [오류 제보](https://github.com/CausalInferenceLab/Causal-Inference-with-Python/issues)
 
 <br>
 
@@ -35,6 +35,8 @@ Matheus Facure의 [Causal Inference for The Brave and True](https://matheusfacur
 
 번역은 전문 번역가가 아니라 데이터 분석가, 데이터 과학자, 연구자들이 함께 했습니다. 용어는 『실무로 통하는 인과추론 with 파이썬』(한빛미디어)과 맞췄고, 핵심 용어는 처음 나올 때 영어를 함께 적었습니다. 어색한 문장이나 잘못된 번역을 발견하면 언제든 알려 주세요.
 
+이 책은 인과추론팀의 오픈소스와 자료를 L0–L4 커리큘럼으로 엮은 [Causal Inference Hub](https://causalinferencelab.github.io/)의 L1 중심 자료입니다. [허브에서 이 책의 자리](https://causalinferencelab.github.io/#station=Causal-Inference-with-Python)를 열면 앞뒤로 이어지는 자료를 볼 수 있습니다.
+
 <br>
 
 ## 목차
@@ -125,6 +127,8 @@ cd book && quarto preview
 
 `book/prepare.py`는 빌드할 때 [번역 가이드](TRANSLATION_GUIDE.md)의 용어표로 웹북의 '용어집' 페이지를 만들고, `book/postrender.py`는 렌더링이 끝난 뒤 웹북 검색 색인(`search-index.json`)을 만듭니다. `book/prepare.py`는 빌드할 때만 장 제목, 수식 표기, 접힌 코드, 옮긴이 주 상자를 책 형식으로 바꿉니다. 그래서 노트북은 원서와 같은 구조로 두면 됩니다.
 
+읽기 기능(읽은 장 기록, 이어 읽기, 장 끝 평가, 허브로 가는 링크)은 `book/reader.html`, GA4 설정은 `book/analytics.html`에 있습니다. 읽은 장 기록은 독자의 브라우저(`localStorage`의 `cil-book-*`)에만 남고, 같은 도메인의 [Causal Inference Hub](https://causalinferencelab.github.io/)가 이 기록으로 진도와 활동 여권 스탬프를 보여 줍니다.
+
 <br>
 
 ## 원서 변경 반영

book/_quarto.yml

@@ -13,9 +13,6 @@ execute:
   enabled: false
 
 book:
-  google-analytics:
-    tracking-id: "G-BEBVKYH8HL"
-    anonymize-ip: true
   title: "Python으로 하는 인과추론"
   subtitle: "Causal Inference for The Brave and True 한국어판"
   author:
@@ -39,6 +36,7 @@ book:
     style: docked
     collapse-level: 3
     header: |
+      <a class="hub-card" href="https://causalinferencelab.github.io/"><span class="hub-card-arrow" aria-hidden="true">←</span><span class="hub-card-text"><b>Causal Inference Hub</b><small>인과추론팀 커리큘럼과 오픈소스</small></span></a>
       <a class="brand-lockup" href="https://pseudo-lab.com/" target="_blank" rel="noopener" aria-label="가짜연구소">
         <img class="brand-pseudolab only-light" src="assets/pseudolab-dark.png" alt="가짜연구소 Pseudo Lab">
         <img class="brand-pseudolab only-dark" src="assets/pseudolab-light.png" alt="가짜연구소 Pseudo Lab">
@@ -48,6 +46,8 @@ book:
   page-footer:
     left: "[가짜연구소](https://pseudo-lab.com/) 인과추론팀 옮김 · 원서 © [Matheus Facure](https://matheusfacure.github.io/python-causality-handbook/landing-page.html)"
     center:
+      - text: 인과추론 허브
+        href: https://causalinferencelab.github.io/
       - text: 번역 가이드
         href: https://github.com/CausalInferenceLab/Causal-Inference-with-Python/blob/main/TRANSLATION_GUIDE.md
       - text: 오류 제보
@@ -115,13 +115,16 @@ format:
     html-math-method: mathjax
     df-print: default
     link-external-newwindow: true
+    link-external-filter: '^(?:https?:)\/\/causalinferencelab\.github\.io\/'
     back-to-top-navigation: true
     include-after-body:
       - sidebar-resize.html
       - chapter-toc.html
       - site-search.html
+      - reader.html
       - comments.html
     include-in-header:
+      - analytics.html
       - text: |
           <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css">
           <link rel="preconnect" href="https://fonts.googleapis.com">

book/analytics.html

@@ -0,0 +1,26 @@
+<!-- Google Analytics 4 (웹북). 허브는 따로 G-C5V0X2SGD3을 쓴다. -->
+<script>
+  // 배포된 웹북에서만 집계한다(로컬·PR 미리보기 제외). 허브와 같은 설정: Google 신호·광고 개인화 끔.
+  window.dataLayer = window.dataLayer || [];
+  function gtag(){dataLayer.push(arguments);}
+  (function () {
+    var ID = "G-BEBVKYH8HL";
+    if (location.hostname === "causalinferencelab.github.io") {
+      var s = document.createElement("script");
+      s.async = true;
+      s.src = "https://www.googletagmanager.com/gtag/js?id=" + ID;
+      document.head.appendChild(s);
+      gtag("js", new Date());
+      gtag("config", ID, { page_location: location.href, allow_google_signals: false, allow_ad_personalization_signals: false });
+    }
+    // 유입 정보(utm_*)는 page_location으로 GA에 넘기고, 주소창에서는 지워 공유되는 링크를 깔끔하게 둔다
+    try {
+      var u = new URL(location.href), drop = [];
+      u.searchParams.forEach(function (v, k) { if (k.indexOf("utm_") === 0) drop.push(k); });
+      if (drop.length) {
+        drop.forEach(function (k) { u.searchParams.delete(k); });
+        history.replaceState(history.state, "", u.pathname + u.search + u.hash);
+      }
+    } catch (e) {}
+  })();
+</script>

book/index.qmd

@@ -7,17 +7,22 @@ aliases:
 ```{=html}
 <div class="hero">
   <div class="hero-main">
+    <nav class="hero-crumb" aria-label="위치">
+      <a href="https://causalinferencelab.github.io/">인과추론 허브</a>
+      <span aria-hidden="true">›</span>
+      <a href="https://causalinferencelab.github.io/#station=Causal-Inference-with-Python">커리큘럼 L1</a>
+    </nav>
     <div class="hero-brand">
       <img class="hero-pseudolab" src="assets/pseudolab-light.png" alt="가짜연구소 Pseudo Lab">
       <span class="hero-brand-divider"></span>
       <span class="hero-brand-team">인과추론팀 <b>Causal-Lab</b></span>
     </div>
     <p class="hero-title">Python으로 하는<br>인과추론</p>
-    <p class="hero-sub">Causal Inference for The Brave and True 한국어판. 인과추론의 기초부터 실무 응용까지, 모든 실습을 파이썬으로.</p>
+    <p class="hero-sub"><a href="https://matheusfacure.github.io/python-causality-handbook/landing-page.html">Causal Inference for The Brave and True</a> 한국어판. 인과추론의 기초부터 실무 응용까지, 모든 실습을 파이썬으로.</p>
     <div class="hero-actions">
       <a class="primary" href="01-Introduction-To-Causality.html">1장부터 읽기</a>
+      <a class="ghost" href="https://causalinferencelab.github.io/">인과추론 허브</a>
       <a class="ghost" href="https://github.com/CausalInferenceLab/Causal-Inference-with-Python">GitHub</a>
-      <a class="ghost" href="https://matheusfacure.github.io/python-causality-handbook/landing-page.html">원서 보기</a>
     </div>
   </div>
   <div class="hero-aside">
@@ -87,11 +92,36 @@ aliases:
 
 1부는 학계에서 자리 잡은 내용이라 인과적 질문을 다룰 때 기댈 수 있는 튼튼한 토대가 됩니다. 2부는 저자가 핀테크 회사에서 쌓은 실무 경험에서 나온 내용이 많아 더 실험적이고, 그만큼 현업에 바로 가져다 쓸 거리가 많습니다.
 
+## 인과추론 허브에서 이어 가기
+
+```{=html}
+<a class="hub-banner" href="https://causalinferencelab.github.io/">
+  <img src="assets/causal-lab-mark.png" alt="" width="56" height="64">
+  <span class="hub-banner-text">
+    <span class="hub-banner-k">가짜연구소 인과추론팀</span>
+    <span class="hub-banner-t">Causal Inference Hub</span>
+    <span class="hub-banner-d">웹북, 영상, 스터디 자료, 데이터 에이전트까지. 팀이 만든 오픈소스를 L0–L4 커리큘럼으로 엮었습니다.</span>
+  </span>
+  <span class="hub-banner-go">허브 둘러보기 <span aria-hidden="true">→</span></span>
+</a>
+```
+
+이 책은 가짜연구소 인과추론팀의 [Causal Inference Hub](https://causalinferencelab.github.io/)에 있는 자료입니다. 허브는 팀이 2022년부터 만든 오픈소스와 자료를 L0부터 L4까지 커리큘럼으로 엮어 둔 곳이고, 이 책은 L1('어떻게 추정하나')의 중심 자료입니다. 허브에서는 이 책을 'Brave & True 인과추론 번역서'로 소개합니다.
+
+인과추론이 처음이라면 L0의 [영상으로 여는 인과추론](https://causalinferencelab.github.io/causal-studio/)으로 먼저 감을 잡고 넘어와도 좋습니다. 책을 마친 뒤에는 관심에 따라 이렇게 이어 갈 수 있습니다.
+
+- 내 데이터에 적용해 보고 싶다면: [산업 사례 템플릿](https://causalinferencelab.github.io/#station=causal-inference-practice), [책 예제 코드](https://causalinferencelab.github.io/#station=causal-inference-in-python-code)
+- 메타러너와 이중 머신러닝을 코드로 더 익히고 싶다면: ML 트랙의 [CausalML 스터디](https://causalinferencelab.github.io/#station=causal-inference-with-causalML)
+- A/B 테스트를 제대로 하고 싶다면: 실험 트랙의 [온라인 통제 실험](https://causalinferencelab.github.io/#station=OCE-Materials)
+- 헬스케어와 규제 연구가 궁금하다면: 연구 트랙의 [RWE 규제 가이드라인](https://causalinferencelab.github.io/#station=Bridging-Causal-Inference-and-Real-World-Evidence-A-Study-of-FDA-and-Other-Regulatory-Guidelines)
+
+각 장 끝에도 그 장 다음에 보면 좋은 허브 자료를 하나씩 붙여 두었습니다. 전체 흐름은 [허브에서 이 책의 자리](https://causalinferencelab.github.io/#station=Causal-Inference-with-Python)를 열어 보면 앞뒤 자료와 함께 한눈에 보입니다.
+
 ## 이렇게 읽어 주세요
 
-각 장은 원서의 주피터 노트북을 그대로 옮긴 것이라 코드와 출력이 원서와 같습니다. 노트북 파일은 [GitHub 저장소](https://github.com/CausalInferenceLab/Causal-Inference-with-Python/tree/main/causal-inference-for-the-brave-and-true)에서 내려받아 직접 실행해 볼 수 있습니다. 그래프를 그리는 코드처럼 길어서 접어 둔 셀은 **코드**를 눌러 펼치면 됩니다.
+각 장은 원서의 주피터 노트북을 그대로 옮긴 것이라 코드와 출력이 원서와 같습니다. 노트북 파일은 [GitHub 저장소](https://github.com/CausalInferenceLab/Causal-Inference-with-Python/tree/main/causal-inference-for-the-brave-and-true)에서 내려받아 직접 실행해 볼 수 있습니다. 그래프를 그리는 코드처럼 길어서 접어 둔 셀은 **코드**를 눌러 펼치면 됩니다. 끝까지 읽은 장은 왼쪽 목차에 ✓ 표시가 붙고, 다음에 오면 첫 화면에서 이어 읽을 수 있습니다. 이 기록은 지금 쓰는 브라우저에만 남습니다.
 
-용어는 같은 저자의 책을 옮긴 『실무로 통하는 인과추론 with 파이썬』(한빛미디어)과 맞췄습니다. 두 책을 함께 보셔도 용어가 헷갈리지 않습니다. 용어의 원어와 그 용어를 다루는 장은 [용어집](glossary.html)에서 찾을 수 있습니다. 왼쪽 위 검색(단축키 `/` 또는 `Ctrl+K`)에 한국어나 영어 용어를 넣어도 됩니다. 띄어쓰기는 달라도 찾아 줍니다. 번역 원칙과 용어표는 [번역 가이드](https://github.com/CausalInferenceLab/Causal-Inference-with-Python/blob/main/TRANSLATION_GUIDE.md)에 정리해 두었습니다.
+용어는 같은 저자의 책을 옮긴 『실무로 통하는 인과추론 with 파이썬』(한빛미디어)과 맞췄습니다. 두 책을 함께 보셔도 용어가 헷갈리지 않습니다. 용어의 원어와 그 용어를 다루는 장은 [용어집](glossary.html)에서 찾을 수 있습니다. 왼쪽 위 검색(단축키 `/` 또는 `Ctrl+K`)에 한국어나 영어 용어를 넣어도 됩니다. 띄어쓰기는 달라도 찾아 줍니다. 번역 원칙과 용어표는 [번역 가이드](https://github.com/CausalInferenceLab/Causal-Inference-with-Python/blob/main/TRANSLATION_GUIDE.md)에 정리해 두었습니다. 이번 개정에서 무엇을 고쳤는지, 용어를 왜 그렇게 정했는지, 원서에서 어떤 오류를 찾았는지는 허브 연재 [번역 노트: Brave & True 한국어판](https://causalinferencelab.github.io/article.html#brave-true-webbook-01)에 세 편으로 썼습니다.
 
 ## 함께 만들어 주세요
 

book/prepare.py

@@ -183,7 +183,7 @@ def build_glossary():
         "다른 자료에서 본 표기(예: 처치군, 통제군)나 띄어 쓴 표기로 검색해도 이 페이지에서 찾을 수 있고, "
         "용어 앞의 `#`을 복사하면 그 용어로 바로 이동하는 주소가 됩니다.",
         "",
-        f"::: {{.callout-tip appearance=\"simple\" title=\"용어 제안하기\"}}\n빠진 용어나 더 자연스러운 번역어가 있다면 [용어 제안 이슈]({propose})로 알려 주세요. 논의를 거쳐 번역 가이드와 이 용어집에 함께 반영합니다.\n:::",
+        f"::: {{.callout-tip appearance=\"simple\" title=\"용어 제안하기\"}}\n빠진 용어나 더 자연스러운 번역어가 있다면 [용어 제안 이슈]({propose})로 알려 주세요. 논의를 거쳐 번역 가이드와 이 용어집에 함께 반영합니다. 주요 용어를 왜 이렇게 정했는지는 허브 연재 [번역하며 정한 인과추론 용어](https://causalinferencelab.github.io/article.html#brave-true-terms-02)에 정리했습니다.\n:::",
         "",
     ]
     order = list(CHAPTERS)