📝 (study) 8주차 API 대면 자료 보강

[seoJing]

작업

• 대면 8주차 API/CORS 자료를 HTTP, AJAX, Fetch, Axios, 인증, TanStack Query 흐름으로 보강했습니다.
• CORS 동작 방식과 프론트 개발 서버 프록시의 원리/장단점을 추가했습니다.
• 7주차 파일 구조 내용과 이어지도록 API 파일 배치 예시를 정리했습니다.
• 9주차 Next.js 렌더링 자료와 관련 안내 문구를 최신 흐름에 맞췄습니다.

검증

• pnpm build 성공

메모

• PR 브랜치는 스터디 관련 5개 MDX 파일만 포함하도록 main 기준으로 분리했습니다.

Summary by CodeRabbit

• Documentation
  • Updated curriculum roadmap: week 9 now focuses on Next.js rendering and web performance
  • Enhanced week 8 API content with expanded CORS curriculum and modern API integration patterns
  • Aligned course wrap-up and learning objectives with updated topic schedule

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 047cf722-3ba4-4cf4-ae89-518cf40f2582

📥 Commits

Reviewing files that changed from the base of the PR and between c72e1e5 and 35dc158.

📒 Files selected for processing (1)

• apps/web/content/study/clab-26-1/in-person/week8.mdx

---

📝 Walkthrough

Walkthrough

Week 8 in-person lecture extensively rewritten to position API interactions as frontend-backend contracts, expanded with CORS curriculum and modern API integration patterns. Week 6, 9, and 11 course overviews synchronized to reflect curriculum shift from web security topics to Next.js rendering and performance in week 9.

Changes

API Contract-Driven API Learning & Curriculum Alignment

Layer / File(s)	Summary
Week 8: API Contracts & CORS Foundation apps/web/content/study/clab-26-1/in-person/week8.mdx	Early description and section 1 repositioned API work as frontend-backend contractual agreements. Sections 4–6 introduce expanded CORS curriculum: origins and SOP, request verification, preflight flow, credentialed requests, and resolution strategies (server headers and development proxy).
Week 8: Modern API Integration & Code Architecture apps/web/content/study/clab-26-1/in-person/week8.mdx	Section 7 covers HTTP fundamentals, AJAX vs page reloads, callback→Promise/async-await, Fetch vs Axios (error handling), interceptors, token auth with refresh/401, and TanStack Query (query/mutation, cache invalidation). Section 8 provides file organization guidance (common HTTP client vs feature modules). Section 9 replaces example-only guidance with API contract checklist: auth, error codes, empty-list response shape, pagination indexing, CORS origins.
Week 8 Closing & Curriculum Timeline Synchronization apps/web/content/study/clab-26-1/in-person/week8.mdx, apps/web/content/study/clab-26-1/week9.mdx, apps/web/content/study/clab-26-1/in-person/week6-1.mdx, apps/web/content/study/clab-26-1/in-person/week11.mdx	Week 8 recap and week 9 teaser transition from web security to Next.js rendering/hydration. Week 9 intro reframes topic as "Next.js 렌더링 진화와 웹 퍼포먼스" and reconnects async/structural fundamentals (map/filter, destructuring, spread, modules) to server/client component separation and data-UI integration. Week 6-1 and week 11 course outline entries updated to align week 9 topic reference.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Possibly related PRs

• seoJing/SEOJing#18: Both PRs realign week 9 study content from web security toward Next.js rendering/performance, though they modify different MDX variants.

Poem

🐰 API contracts handshake, CORS walls crumble,

Fetch and Axios dance, promises don't tumble,

From security shields to rendering dreams so bright,

Next.js takes the stage—web vitals in sight! ✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 inconclusive)

Check name	Status	Explanation	Resolution
Title check	❓ Inconclusive	PR 제목은 이모지를 포함하고 있으며, 주요 변경사항인 8주차 API/CORS 자료 보강을 명확히 반영하고 있습니다. 다만 이모지의 사용과 간단한 표현은 구체성이 부족합니다.	이모지를 제거하고 '8주차 API/CORS 학습 자료 보강 및 9주차 Next.js 렌더링 안내 업데이트'처럼 주요 변경사항을 더 구체적으로 설명하는 것을 권장합니다.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch feat/study/week8-api-cors

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

apps/web/content/study/clab-26-1/in-person/week8.mdx

Oops! Something went wrong! :(

ESLint: 9.39.4

Error [ERR_MODULE_NOT_FOUND]: Cannot find package '@eslint/js' imported from /packages/config/eslint/base.js
at Object.getPackageJSONURL (node:internal/modules/package_json_reader:301:9)
at packageResolve (node:internal/modules/esm/resolve:764:81)
at moduleResolve (node:internal/modules/esm/resolve:855:18)
at defaultResolve (node:internal/modules/esm/resolve:988:11)
at #cachedDefaultResolve (node:internal/modules/esm/loader:697:20)
at #resolveAndMaybeBlockOnLoaderThread (node:internal/modules/esm/loader:714:38)
at ModuleLoader.resolveSync (node:internal/modules/esm/loader:746:52)
at #resolve (node:internal/modules/esm/loader:679:17)
at ModuleLoader.getOrCreateModuleJob (node:internal/modules/esm/loader:599:35)
at ModuleJob.syncLink (node:internal/modules/esm/module_job:162:33)

Tip

💬 Introducing Slack Agent: The best way for teams to turn conversations into code.

Slack Agent is built on CodeRabbit's deep understanding of your code, so your team can collaborate across the entire SDLC without losing context.

• Generate code and open pull requests
• Plan features and break down work
• Investigate incidents and troubleshoot customer tickets together
• Automate recurring tasks and respond to alerts with triggers
• Summarize progress and report instantly

Built for teams:

• Shared memory across your entire org—no repeating context
• Per-thread sandboxes to safely plan and execute work
• Governance built-in—scoped access, auditability, and budget controls

One agent for your entire SDLC. Right inside Slack.

👉 Get started

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[cloudflare-workers-and-pages]

Deploying with    Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	seojing	35dc158	Commit Preview URL Branch Preview URL	May 14 2026, 01:35 PM

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@apps/web/content/study/clab-26-1/in-person/week8.mdx`:
- Around line 463-468: The example uses localStorage.getItem("accessToken")
inside apiClient.interceptors.request.use which can be misread as a recommended
production pattern; update the MDX around this snippet to add a clear security
note stating this is a simple learning example, warn about XSS risks of storing
tokens in localStorage, and recommend using HttpOnly + Secure cookies
(server-set session/refresh cookies) or other secure storage flows as the
preferred production approach; mention briefly that with cookies the server
handles token storage and CSRF/SameSite considerations and link or point readers
to implement refresh-token flows instead of client-side localStorage.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: dd4d7e34-38a2-4c18-a0c0-aaf6acc5a04b

📥 Commits

Reviewing files that changed from the base of the PR and between 1c0fd89 and c72e1e5.

📒 Files selected for processing (5)

• apps/web/content/study/clab-26-1/in-person/week11.mdx
• apps/web/content/study/clab-26-1/in-person/week6-1.mdx
• apps/web/content/study/clab-26-1/in-person/week8.mdx
• apps/web/content/study/clab-26-1/in-person/week9.mdx
• apps/web/content/study/clab-26-1/week9.mdx

[seoJing]

CodeRabbit의 localStorage 토큰 저장 보안 지적 반영했습니다. 학습용 단순 예시임을 명시하고, XSS 위험 및 HttpOnly + Secure + SameSite 쿠키 기반 인증을 실무 대안으로 추가했습니다. Refresh Token 섹션에도 쿠키 기반 인증 시 CSRF/SameSite/CORS credentials를 백엔드와 맞춰야 한다는 설명을 보강했습니다.

[codecov-commenter]

⚠️ Please install the to ensure uploads and comments are reliably processed by Codecov.

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!