g2plotを使用した多系列折線グラフの実装例
二酸化炭素排出量のソース
import { Line } from '@antv/g2plot';
fetch('https://gw.alipayobjects.com/os/bmw-prod/55424a73-7cb8-4f79-b60d-3ab627ac5698.json')
.then((response) => response.json())
.then((chartData) => {
const emissionsChart = new Line('container', {
data: chartData,
xField: 'year',
yField: 'value',
se ...
6月25日 19:48 投稿
フロントエンドアーキテクチャ構築の実践ガイド
プロジェクト全体の構築
フロントエンド開発ツールチェーン概要
現代のフロントエンド開発では、複雑なプロジェクト要件に対応するための様々なツールが存在します。
主要ツールカテゴリ
静的型チェック: TypeScript, Flow
コード品質検査: ESLint
パッケージ管理: npm, Yarn
トランスパイラ: Babel
開発サーバー: ホットリロード、HMR対応
バンドラー: Webpack, Rollup ...
6月18日 00:06 投稿
Ant Designを使用したReact管理ダッシュボードの実装
管理ダッシュボードの構造
Ant Designコンポーネントを活用したReactベースの管理インターフェース実装例：
<script type="text/babel">
const { Layout, Menu, Table, Modal, Form, Button } = antd;
function StorageManager() {
const [collapsed, setCollapsed] = React.useState(false);
const [showAddModal, setShowAddModal] = React.useState(false);
...
6月15日 22:43 投稿