Latihan 1 dari materi Proyek Solid di SolidJS — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.
Kode awal sudah punya signal todos (array kosong) dan input (string kosong), plus addTodo yang baru memanggil e.preventDefault(). Lengkapi:
createMemo dan For (dan Show kalau perlu) dari "solid-js".const remaining = createMemo(() => todos().filter((t) => !t.done).length).addTodo, sesudah e.preventDefault(): if (!input().trim()) return, lalu setTodos((t) => [...t, { id: Date.now(), text: input(), done: false }]), lalu setInput("").toggleTodo(id) yang membalik done lewat map, dan removeTodo(id) yang memakai setTodos((t) => t.filter((todo) => todo.id !== id)).<div>: <h1>Todo App</h1>, <p>{remaining()} tersisa</p>, lalu <form onSubmit={addTodo}> berisi <input value={input()} onInput={(e) => setInput(e.target.value)} /> dan <button type="submit">Tambah</button>.<ul> dengan <For each={todos()}>: tiap <li> berisi checkbox onChange={() => toggleTodo(todo.id)}, teks todo, dan <button onClick={() => removeTodo(todo.id)}>Hapus</button>.Yang dicek:
<h1> dan <form>.createMemo(, For, onClick, dan filter(.Belajar Solid, klik Tambah: <ul> memuat Belajar Solid, dan kotak isiannya kosong lagi. Lalu klik Hapus: gak ada <li> lagi di <ul>.Tambah dengan kotak kosong: gak ada <li> di <ul>.<p> berisi persis 0 tersisa. Ketik Belajar Solid, klik Tambah: 1 tersisa. Lalu centang checkbox-nya: 0 tersisa lagi.
