create-miro-app/dist/templates/targets/client/react/src/app.jsx

Create Miro app

import * as React from 'react'; 
import { createRoot } from 'react-dom/client'; 

import '../src/assets/style.css'; 

async function addSticky() {
    const stickyNote = await miro.board.createStickyNote({
        content: 'Hello, World!', 
    }); 
    
    await miro.board.viewport.zoomTo(stickyNote); 
} 

const App = () => {
    React.useEffect(() => {
        addSticky(); 
    }, []); 
    
    return ( <div className="grid wrapper"> 
      <div className="cs1 ce12"> 
        <img src="/src/assets/congratulations.png" alt=""/> 
      </div> 
      <div className="cs1 ce12"> 
        <h1>Congratulations!</h1> 
        <p>You've just created your first Miro app!</p> 
        <p> 
          To explore more and build your own app, see the Miro Developer
          Platform documentation.
        </p> 
      </div> 
      <div className="cs1 ce12"> 
        <a  className="button button-primary"  target="_blank"  href="https://developers.miro.com" > 
          Read the documentation
        </a> 
      </div> 
    </div> ); 
}; 

const container = document.getElementById('root'); 
const root = createRoot(container); 
root.render(<App />);