reactor-getting-started Skill

Source

• Creator: microsoft
• Repository: microsoft/microsoft-ui-reactor
• Skill file: plugins/reactor/skills/reactor-getting-started/SKILL.md

What it does

Reactor essentials in one place — React-to-Reactor mental model, minimal app shape, hooks, the most-used factories, the critical gotchas, and project setup. This is the only skill you need loaded for typical Reactor work; load topical skills (reactor-async, reactor-design, etc.) only when the task explicitly calls for

Skill instructions

Coming from React? Read this first. Reactor concepts are React's, with one C spelling. If you know React, you already know how Reactor works — components render an element tree, hooks manage state and effects, lists need keys, lifting state up is the same. Trust your React intuition for shape; verify the names against the table below or references/reactor.api.txt. | React | Reactor (C) | |---|---| | function App() { … } | class App : Component { override Element Render() { … } } | | useState(0) | var (count, setCount) = UseState(0); | | useReducer(reduce, init) | var (state, dispatch) = UseReducer<TState,TAction(reduce, init); | | useEffect(fn, [dep]) | UseEffect(fn, dep); | | useMemo(() = v, [dep]) | UseMemo(() = v, dep) | | useCallback(fn, [dep]) | UseCallback(fn, dep) | | useRef(v) | UseRef(v) | | callback ref / ref={node = …} | UseElementRef<T() + .Ref(r) | | useContext(Ctx) | UseContext(Ctx) | | <Provider value={x}{c}</Provider | c.Provide(Ctx, x) | | <div (linear layout) | FlexCo