Overview

This codelab walks you through creating a Vue 3 + Vite Todo app from scratch, wiring Vue Router, building reactive add/remove task flows, and styling a polished responsive table UI with global CSS. You also integrate Gemini to summarize todos with loading/error handling.

JavaScript

Gemini

Vue.js

Beginner

Vue Todo with Gemini

Build a Vue 3 Todo app with clean table UI, add/remove actions, and Gemini AI summaries using Vite, Router, global CSS, and env-based keys.

Published At: Apr 21, 2026

Last Updated At: Apr 21, 2026

1 Likes 48 min

Author

Vrijraj Singh

@vrijraj

Get Started with Stepwik

Join the Stepwik and create labs and courses to help developers grow, enhance their skills, and contribute to build a stronger developer ecosystem within your network.