<main>
        <div id="app">
            <h1>Todo List</h1>
            <input type="text" v-model="newTodoText">
            <button @click="addTodo">Add Todo</button>
            <ul>
                <li v-for="todo in todos" :key="todo.id">
                    {{ todo.text }}
                </li>
            </ul>
        </div>
    </main>
    <footer>
        <p><small>This is an app for demo purposes, generated using AI. Do not enter any sensitive information. Do not rely on this for anything important.</small></p>
    </footer>

new Vue({
    el: '#app',
    data: {
        todos: [],
        newTodoText: ''
    },
    methods: {
        addTodo () {
            const newTodo = { id: Date.now(), text: this.newTodoText }
            this.todos.push(newTodo)
            this.newTodoText = ''
            localStorage.setItem('todos', JSON.stringify(this.todos))
        }
    },
    mounted () {
      const todos = localStorage.getItem('todos')
      if (todos) {
        this.todos = JSON.parse(todos)
      }
    }
});