Code Block

1const calculateTotal = (items) => {
2  return items.reduce((sum, item) => sum + item.price, 0);
3};

1def factorial(n):
2    if n <= 1:
3        return 1
4    return n * factorial(n - 1)
5
6print(factorial(5))

1$npm install @/components/ui
2$npm run dev

1{
2  "name": "my-app",
3  "version": "1.0.0",
4  "dependencies": {
5    "react": "^18.0.0",
6    "next": "^14.0.0"
7  }
8}

1.button {
2  background: var(--primary);
3  color: var(--primary-foreground);
4  border-radius: 0.375rem;
5  padding: 0.5rem 1rem;
6}

1import React, { useState, useEffect } from 'react';
2import { Button } from '@/components/ui/button';
3import { Input } from '@/components/ui/input';
4
5export function TodoList() {
6  const [todos, setTodos] = useState([]);
7  const [input, setInput] = useState('');
8
9  const addTodo = () => {
10    if (input.trim()) {
11      setTodos([...todos, { id: Date.now(), text: input }]);
12      setInput('');
13    }
14  };
15
16  return (
17    <div className="space-y-4">
18      <div className="flex gap-2">
19        <Input
20          value={input}
21          onChange={(e) => setInput(e.target.value)}
22          onKeyDown={(e) => e.key === 'Enter' && addTodo()}
23        />
24        <Button onClick={addTodo}>&gt; ADD</Button>
25      </div>
26      <ul>
27        {todos.map((todo) => (
28          <li key={todo.id}>{todo.text}</li>
29        ))}
30      </ul>
31    </div>
32  );
33}