1. React 18 スターターの構造
テンプレートギャラリーからReact 18プロジェクトを選択すると、TSXサポートやMonacoのコード補完を備えた標準構成が瞬時に用意されます。
// src/App.tsx
import React, { useState } from 'react';
export function App() {
const [val, setVal] = useState(0);
return <button onClick={() => setVal(val + 1)}>クリック数: {val}</button>;
}2. Vue 3 単一ファイルコンポーネントの高速コンパイル
Vue 3テンプレートでは、@vue/compiler-sfcにより.vueファイルがブラウザメモリ内で直接コンパイルされます。
<!-- src/App.vue -->
<template>
<div>
<h2>GB Coder上のVue 3</h2>
<button @click="count++">カウント: {{ count }}</button>
</div>
</template>
<script setup>
import { ref } from 'vue';
const count = ref(0);
</script>3. xterm.jsターミナルでのコマンド実行
Ctrl+`キーでターミナルを開き、npm installでのライブラリ追加やビルドスクリプトの実行を自由に行えます。