- CDNを使用したMaterial-UIのインストール手順:
- HTMLファイルの
<head>
セクション内で、以下のスクリプトを追加します。
- HTMLファイルの
<script src="https://unpkg.com/material-ui@latest/umd/material-ui.production.min.js"></script>
<link rel="stylesheet" href="https://unpkg.com/material-ui@latest/umd/material-ui.production.min.css" />
- インストールが完了したら、Material-UIのコンポーネントを使用するための例を以下に示します。
import React from 'react';
import ReactDOM from 'react-dom';
import Button from '@material-ui/core/Button';
function App() {
return (
<div>
<Button variant="contained" color="primary">
Click me
</Button>
</div>
);
}
ReactDOM.render(<App />, document.getElementById('root'));
上記の例では、Button
コンポーネントを使用してボタンを作成しています。variant
プロパティを使用してボタンのスタイルを指定し、color
プロパティを使用してボタンの色を指定することができます。
このように、Material-UIのCDNを使用することで、簡単にMaterial-UIをインストールして利用することができます。CDNを使用することで、ローカル環境に依存せずに最新のMaterial-UIバージョンを利用することができます。