# 메타데이터 다루기

[메타데이터](/friendly-next-js/next.js-1/undefined-5.md)에서 배웠던 내용을 토대로 날씨 앱의 메타데이터를 바꿔보겠습니다.&#x20;

### 정적 메타데이터

항상 고정된 메타데이터를 지정하는 건 `metadata` 객체를 정의하는 것으로 해결됩니다.

{% code title="app/layout.tsx" %}

```tsx
export const metadata: Metadata = {
  title: '날씨 앱',
  description: 'Next.js로 만든 날씨 앱',
}
```

{% endcode %}

### 동적 메타데이터

데이터에 따라 다른 메타데이터를 지정하기 위해선 `generateMetadata`라는 이름의 함수를 정의하면 됩니다. 함수 내에서 `fetch` 함수를 이용해 데이터를 가져올 수도 있으니 원하는 어떤 문구든 만들 수 있습니다.

{% code title="app/\[location]/page.tsx" %}

```tsx
export function generateMetadata({ searchParams }: Props): Metadata {
  return {
    title: `${searchParams.name}의 3일 예보`,
    description: `${searchParams.name}의 3일 예보를 알려드립니다`,
  }
}
```

{% endcode %}

주요 기능은 완성됐습니다. 이제 서비스를 배포해보겠습니다.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://book.hajoeun.dev/friendly-next-js/next.js-2/undefined-6.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
