1
Create your project
Start by creating a new Next.js project if you don’t have one set up already. The most common approach is to use Create Next App.
2
Add Orderly SDK
3
Add new route
Next.js has two routing modes: Page Router and App Router. Here we take App mode as an example. For more information about App Router, please refer to Next.js documentation.Create a new
trade/[symbol]
directory under the /app
directory, create a page.tsx
file, and add the following code:page.tsx
4
Import style
page.tsx
5
Done
Now you can start your project and access the
/trade/PERP_ETH_USDC
route, you will see a complete exchange page.