Codesand Box で React Suite を動かしてみる

使ってみる

1. CodesandBox の Web ページを開く

   https://codesandbox.io/

2. 「Create a Sandbox, it's free」をクリック
   利用条件等は，利用者で確認すること．
   
3. 「Create a Sandbox」をクリック
   
4. 「React (create-react-app)」をクリック
   
5. rsuite を追加する
   1. まず，「Add Dependency」をクリック
      
   2. 検索ボタンをクリック
      
   3. 「rsuite」を検索し，追加する
      
   4. 「RSUITE Hello World (3.0)」を選ぶ
      
   5. 画面が変わるので確認する
      
6. エディタに次のプログラムを入れたときの実行結果は次の通り．

   Python プログラムを実行する

   Python プログラムの実行: 別ページ »で説明

   Python のまとめ: 別ページ »にまとめ

   import React from "react";
   import ReactDOM from "react-dom";
   import { Button } from "rsuite";
   
   const styles = {
     padding: 20,
     textAlign: "center"
   };
   
   const App = () => (
     <div style={styles}>
       <Button>Hello World</Button>
     </div>
   );
   
   const rootElement = document.getElementById("root");
   ReactDOM.render(<App />, rootElement);
   

   実行結果