TradingView Charting Library and Nextjs Integration Example (JavaScript)

The earliest supported version of the Charting Library for these examples is v24.002.

This example is intended to cover Nextjs from v13 onwards.

How to start

1. Check that you can view https://github.com/tradingview/charting_library/. If you do not have access then you can request access to this repository here.
2. Install dependencies npm install.
3. Copy the charting library files
   1. If you are able to run bash scripts then the copy_charting_library_files.sh script can be used to copy the current stable version's files.
   2. If you are not able to run bash scripts then do the following:
      1. Copy charting_library folder from https://github.com/tradingview/charting_library/ to /public/static folders.
      2. Copy datafeeds folder from https://github.com/tradingview/charting_library/ to /public/static.
4. Run npm run build and npm run start. It will build the project and open a default browser with the Charting Library.
5. Run npm run dev when you start to develop with this project.

What is Charting Library

Charting Library is a standalone solution for displaying charts. This free, downloadable library is hosted on your servers and is connected to your data feed to be used in your website or app. Learn more and download.

What is React

React is a JavaScript library for building user interfaces. It is maintained by Facebook, Instagram and a community of individual developers and corporations.

What is Nextjs

Nextjs is React Sever Side Rendering Framework for React with zero-configuration.

About This Project

This project was bootstrapped with NextJs.