Àwọn tókìnnì díẹ̀ láti ṣe UI
AI kọ tókìnnì tó dín ní 26% pẹ̀lú Lyra UI.
A ní kí Claude Sonnet kọ ìbánisọ̀rọ̀ chat, dashboard àti ojú-ìwé ètò kan náà pẹ̀lú Lyra UI, pẹ̀lú React, Tailwind àti shadcn/ui, àti pẹ̀lú HTML, CSS àti JavaScript lásán (18 ìgbìmọ̀ ṣíṣe). Pẹ̀lú Lyra UI, ó kọ tókìnnì ìjáde tó dín ní 26% àti ìlà kóòdù tó dín ní 46% ju pẹ̀lú shadcn/ui lọ, àti tókìnnì tó dín ní 33% ju pẹ̀lú HTML lásán lọ, nítorí pé tag kan rọ́pò markup, ìṣàpèjúwe àti state. Àwọn ìgbìmọ̀ ṣíṣe Lyra tún ka ìtọ́kasí llms-full.txt, èyí tí àwọn aṣojú máa ń fi pamọ́ tí wọ́n sì tún lò.
Àpẹẹrẹ
Ìbánisọ̀rọ̀ chat nínú tag díẹ̀.
<script type="module">
import '@aceshooting/lyra-ui/components/lr-chat-viewport.js';
import '@aceshooting/lyra-ui/components/lr-chat-message.js';
import '@aceshooting/lyra-ui/components/lr-chat-composer.js';
</script>
<lr-chat-viewport>
<lr-chat-message message-role="user">Summarize this report.</lr-chat-message>
<lr-chat-message message-role="assistant" status="streaming">Here are the key points…</lr-chat-message>
</lr-chat-viewport>
<lr-chat-composer placeholder="Ask anything"></lr-chat-composer>