diff --git a/react/src/index.jsx b/react/src/index.jsx
index d9a01e8..24ecb18 100644
--- a/react/src/index.jsx
+++ b/react/src/index.jsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { render } from "react-dom";
+import { createRoot } from "react-dom/client";
 import { BrowserRouter, Navigate, Route, Routes } from "react-router-dom";
 
 import { Playlist } from "./playlist";
@@ -30,9 +30,10 @@ function App() {
   );
 }
 
-render(
+const container = document.getElementById("index");
+const root = createRoot(container);
+root.render(
   <BrowserRouter>
     <App />
   </BrowserRouter>,
-  document.getElementById("index"),
 );