Build A TodoList with Swift, Vapor and Electron Vue

Install docker and a database connection id to get started. Install vapor, clone the vapor to-do template from github, and open it in vscode.

Review the todo list project structure, including docker compose setup, db migrations, environment variables, routes, and the todo model and controller for creating and fetching todos.

Modify the todo model to include a completed boolean, update migrations, and run docker compose to apply the schema, then verify the table has id, title, and completed.

Deploy Vapor API and access the app on port 8080; use Docker Compose down to stop services and -v to wipe data, then restart from the command line if needed.

Implement a show method to get a to do by id, decode the request, query the database with find, and abort if not found, while building and testing with docker.

Implement an update function for todos by fetching the todo ID from request parameters, decoding new content, and saving the updated item. Return not found if the ID is missing.

Delete a todo item by using its id, perform the delete action, and verify the list updates to show the remaining tasks, ending with an empty array.

Learn to build a todo app using Vue.js and Electron, scaffold an Electron project with a CLI, install electron-builder, and run and modify the app code.

Install and import Element Plus, apply a primary button, and begin building UI components. Run the dev server, reload modules, and integrate axios for HTTP requests in future steps.

Create a todo list component in a TypeScript Vue setup, load todos with Axios, and implement create and read actions to manage tasks.

Implement update and delete actions for to-dos, adding three related functions, and begin building the user interface, with the next video guiding how to assemble the list.

Build the ui with a row and column, center the layout, import the to do list component into the app file, and prepare to render the list with its interface.

Build a to-do table with a title column set to width 350, and use a template and v-model switch to update data, while noting there is no data yet.

Implement a security policy by inserting a metadata tag in index.html to block unwanted traffic, enabling http and https requests to be tested in the browser or Electron app.

Implement a delete to-do button with a confirmation dialog, offering yes and cancel options, and refresh the list after deletion.

Create a reactive to-do list form component using props, ref, and v-model to submit a to-do item with title and completed status, validate input, and reset after submission.

Make the submit todo prop a function to enable submitting, deleting, and editing todos in the list.