에디터 ν™•μž₯ κΈ°λŠ₯(Editor extensions)을 μ‚¬μš©ν•˜λ©΄ Obsidianμ—μ„œ λ…ΈνŠΈλ₯Ό νŽΈμ§‘ν•˜λŠ” κ²½ν—˜μ„ μ»€μŠ€ν„°λ§ˆμ΄μ¦ˆν•  수 μžˆμŠ΅λ‹ˆλ‹€. 이 νŽ˜μ΄μ§€μ—μ„œλŠ” 에디터 ν™•μž₯ κΈ°λŠ₯이 무엇인지, μ–Έμ œ μ‚¬μš©ν•΄μ•Ό ν•˜λŠ”μ§€ μ„€λͺ…ν•©λ‹ˆλ‹€.

Obsidian은 λ§ˆν¬λ‹€μš΄ 에디터λ₯Ό κ΅¬λ™ν•˜κΈ° μœ„ν•΄ CodeMirror 6(CM6)을 μ‚¬μš©ν•©λ‹ˆλ‹€. Obsidianκ³Ό λ§ˆμ°¬κ°€μ§€λ‘œ CM6μ—λŠ” _ν™•μž₯ κΈ°λŠ₯(extensions)_μ΄λΌλŠ” 자체 ν”ŒλŸ¬κ·ΈμΈμ΄ μžˆμŠ΅λ‹ˆλ‹€. 즉, Obsidian의 _에디터 ν™•μž₯ κΈ°λŠ₯_은 _CodeMirror 6 ν™•μž₯ κΈ°λŠ₯_κ³Ό λ™μΌν•©λ‹ˆλ‹€.

에디터 ν™•μž₯ κΈ°λŠ₯을 κ΅¬μΆ•ν•˜κΈ° μœ„ν•œ APIλŠ” μ•½κ°„ λ…νŠΉν•˜λ©° μ‹œμž‘ν•˜κΈ° 전에 기본적인 μ•„ν‚€ν…μ²˜ 이해가 ν•„μš”ν•©λ‹ˆλ‹€. 이 μ„Ήμ…˜μ€ μ‹œμž‘ν•˜κΈ°μ— μΆ©λΆ„ν•œ μ»¨ν…μŠ€νŠΈμ™€ 예제λ₯Ό μ œκ³΅ν•˜κΈ° μœ„ν•œ κ²ƒμž…λ‹ˆλ‹€. 에디터 ν™•μž₯ κΈ°λŠ₯ ꡬ좕에 λŒ€ν•΄ 더 배우고 μ‹Άλ‹€λ©΄ CodeMirror 6 λ¬Έμ„œλ₯Ό μ°Έμ‘°ν•˜μ„Έμš”.

에디터 ν™•μž₯ κΈ°λŠ₯이 ν•„μš”ν•œκ°€μš”?

에디터 ν™•μž₯ κΈ°λŠ₯을 κ΅¬μΆ•ν•˜λŠ” 것은 도전적일 수 μžˆμœΌλ―€λ‘œ, ꡬ좕을 μ‹œμž‘ν•˜κΈ° 전에 μ •λ§λ‘œ ν•„μš”ν•œμ§€ κ³ λ €ν•˜μ„Έμš”.

  • 읽기 λͺ¨λ“œμ—μ„œ λ§ˆν¬λ‹€μš΄μ„ HTML둜 λ³€ν™˜ν•˜λŠ” 방식을 λ³€κ²½ν•˜λ €λ©΄ λ§ˆν¬λ‹€μš΄ ν›„μ²˜λ¦¬κΈ°λ₯Ό κ΅¬μΆ•ν•˜λŠ” 것을 κ³ λ €ν•˜μ„Έμš”.
  • 라이브 ν”„λ¦¬λ·°μ—μ„œ λ¬Έμ„œμ˜ λͺ¨μ–‘κ³Ό λŠλ‚Œμ„ λ³€κ²½ν•˜λ €λ©΄ 에디터 ν™•μž₯ κΈ°λŠ₯을 ꡬ좕해야 ν•©λ‹ˆλ‹€.

에디터 ν™•μž₯ κΈ°λŠ₯ 등둝

CodeMirror 6(CM6)은 μ›Ή κΈ°μˆ μ„ μ‚¬μš©ν•˜μ—¬ μ½”λ“œλ₯Ό νŽΈμ§‘ν•˜κΈ° μœ„ν•œ κ°•λ ₯ν•œ μ—”μ§„μž…λ‹ˆλ‹€. ν•΅μ‹¬μ μœΌλ‘œ 에디터 μžμ²΄λŠ” μ΅œμ†Œν•œμ˜ κΈ°λŠ₯ μ„ΈνŠΈλ₯Ό κ°€μ§€κ³  μžˆμŠ΅λ‹ˆλ‹€. ν˜„λŒ€μ μΈ μ—λ””ν„°μ—μ„œ κΈ°λŒ€ν•  수 μžˆλŠ” λͺ¨λ“  κΈ°λŠ₯은 선택할 수 μžˆλŠ” _ν™•μž₯ κΈ°λŠ₯_으둜 μ œκ³΅λ©λ‹ˆλ‹€. Obsidian은 μ΄λŸ¬ν•œ ν™•μž₯ κΈ°λŠ₯ 쀑 λ§Žμ€ 것을 기본으둜 μ œκ³΅ν•˜μ§€λ§Œ, μžμ‹ λ§Œμ˜ ν™•μž₯ κΈ°λŠ₯을 등둝할 μˆ˜λ„ μžˆμŠ΅λ‹ˆλ‹€.

에디터 ν™•μž₯ κΈ°λŠ₯을 λ“±λ‘ν•˜λ €λ©΄ Obsidian ν”ŒλŸ¬κ·ΈμΈμ˜ onload λ©”μ„œλ“œμ—μ„œ registerEditorExtension()을 μ‚¬μš©ν•˜μ„Έμš”:

onload() {
  this.registerEditorExtension([examplePlugin, exampleField]);
}

CM6λŠ” μ—¬λŸ¬ μœ ν˜•μ˜ ν™•μž₯ κΈ°λŠ₯을 μ§€μ›ν•˜μ§€λ§Œ, κ°€μž₯ 일반적인 두 κ°€μ§€λŠ” View plugins와 State fieldsμž…λ‹ˆλ‹€.