<aside> πŸ’‘

use server 은 μ„œλ²„μ•‘μ…˜μ΄ λ˜μ–΄μ•Όν•  것을 λ§ν•˜κΈ°λ§Œ! ν•˜λŠ” κ²ƒμž„ μ½”λ“œκ°€ μ„œλ²„μ—μ„œ μ‹€ν–‰λœλ‹€λŠ” 것을 μ˜λ―Έν•˜κ±°λ‚˜ 보μž₯ν•˜μ§€ μ•ŠμŒ

</aside>

https://nextjs.org/docs/app/building-your-application/rendering/composition-patterns#keeping-server-only-code-out-of-the-client-environment

install server-only

import 'server-only'
 
export async function getData() {
  const res = await fetch('<https://external-service.com/data>', {
    headers: {
      authorization: process.env.API_KEY,
    },
  })
 
  return res.json()
}

getData() ν•¨μˆ˜λ₯Ό ν΄λΌμ΄μ–ΈνŠΈμ—μ„œ 가져와 μ‹€ν–‰ν•  수 μžˆμ§€λ§Œ, μ„œλ²„μ—μ„œλ§Œ μ‚¬μš©λ˜μ–΄μ•Ό ν•  API_KEY 등을 ν¬ν•¨ν–ˆμ„λ•Œ NEXT_PUBLICμ„œλ²„μ—μ„œλ§Œ μ•‘μ„ΈμŠ€ν•  수 μžˆλŠ” 개인 λ³€μˆ˜μ΄κΈ°μ— μ›ν•˜λŠ” λŒ€λ‘œ μž‘λ™ν•˜μ§€ μ•Šμ„ 수 있음

λ˜ν•œ use server 을 ν΄λΌμ΄μ–ΈνŠΈλ‘œ λΆ€ν„° μ½”λ“œλ₯Ό μˆ¨κΈ°κΈ°μœ„ν•΄ μ‚¬μš©ν•  순 μ—†μŒ

κ·ΈλŸ΄λ•Œ server only λ₯Ό μ‚¬μš©ν•˜λ©΄ ν΄λΌμ΄μ–ΈνŠΈ κ΅¬μ„±μš”μ†Œμ— ν•΄λ‹Ή λͺ¨λ“ˆμ„ import ν•˜λ©΄ λΉŒλ“œ νƒ€μž„ 였λ₯˜κ°€ 남 !