# gt-next: General Translation Next.js SDK: 使用组件 URL: https://generaltranslation.com/zh/docs/next/tutorials/examples/currency-converter/t.mdx --- title: 使用组件 description: 开始翻译吧！ --- ## 概述现在终于可以开始翻译了！设置好 `` 组件后，你就可以把应用翻译成任何想要的语言！其实可以分为两个步骤：添加 `` 组件添加 `` 组件 ## 添加 `` 组件先把 `` 组件添加到你的应用中。好在这一步只需要做一次。 ```jsx title="src/app/layout.tsx" copy import { GTProvider } from 'gt-next' // [!code highlight] ... export default function RootLayout({ children, }: Readonly<{ children: React.ReactNode; }>) { return ( // [!code highlight] {children} // [!code highlight] ); } ``` **为什么需要 `` 组件？** `` 负责将翻译从服务端传递到客户端。只要你想在客户端渲染 `` 组件，就需要用 `` 将其包裹起来。你可以在[这里](/docs/next/api/components/gtprovider)了解更多关于 `` 组件的信息。 ## 添加 `` 组件这正是你一直在等的部分…… 现在要做的，就是在内容开头加上 ``，并在末尾加上结束标签 ``。别忘了添加一个唯一的标识符字符串，作为该翻译的 id。 ```jsx title="src/app/page.tsx" copy import { T } from 'gt-next' // [!code highlight] ... function Page() { ... return ( // [!code highlight] ... // [!code highlight] ); } export default Page; ``` 这样就完成了！现在你可以开始翻译你的应用了！