Build A TodoList Fast with Spring Boot, Java and Svelte

Choose IntelliJ, a JetBrains IDE, for faster Java development and access to database tools, using the early access program and free trial to speed workflows.

Create a Spring Boot project using Spring Initializer with Java and Gradle, naming the app API. Include Lombok, Spring Web, Spring Data JPA, Flyway migrations, and Postgres.

Configure the Spring Boot data source with a Postgres JDBC URL, localhost, port, username, and password, then test the connection and finalize the database driver setup.

Create a jpa entity for to-dos with jpa buddy, include id with identity strategy, title string, and completed boolean, and add lombok getters/setters before creating a jpa repository.

Generate flyway migrations by diffing models against the database to create a to-do table with id, title, and completed fields, then review the SQL and how migrations run on startup.

Create a Spring Boot to do controller in mx controllers, annotate as rest controller with post mapping, inject todo repository, and post todo with request body to save it.

Build get requests in Spring Boot by exposing an API to view all todos and fetch a single todo by its id, using path variables and Lombok for type inference.

update todo items in spring boot using a put mapping with a path variable id and a request body dto, then save the updated todo.

Create a delete endpoint in Spring Boot with a delete mapping and a path variable id to remove a to-do by id, using repository.deleteById.

Generate a Svelte project with Vite using npm create, install dependencies, explore app.svelte and project structure, and run npm run dev to launch the dev server.

Install the carbon Svelte UI library (minimum v3.48) as a dev dependency; create a to-do service and store.js, and add to-do form and list components for the app.

Create a todo service with a URL and RESTful API, load and manage todos using fetch with JSON payloads, and set up a Svelte writable store for the todo list.

Clean project code in a Svelte to-do app by simplifying structure, applying center alignment and max-width styles, and integrating a to-do list component before connecting to a restful API.

Learn to load todos from a serverless rest backend using the on mount lifecycle in a Svelte component, and manage create, update, and delete operations with a todo service.

Add a todo list UI by exporting and wiring data with carbon data table components, including headers, rows, and toggle actions to update or delete todos.

Debug carbon UI by selecting the correct CSS theme from the documentation and applying it in app.svelte. Observe persistent styling as you toggle options and refresh.

Add a to-do form that binds a title input to the to-do list service, disables submit until the title has three or more characters, and defaults completed to false.

Unlock unlimited access to code brains.io courses with a 30% lifetime discount using the new 30 code, plus monthly updates, weekly contact, early access, and a dedicated forum.