豆包MarsCode上手开发【番茄时钟】 （Datawhale AI冬令营）

一 概览

任务：开发番茄时钟

语言：HTML/CSS/JS

AI辅助工具：豆包MarsCode工作台

难度：容易

二 具体步骤

1.注册登录

注册登录豆包MarsCode工作台

2.进入豆包MarsCode在线IDE

点击 "进入工作台" 打开在线IDE，打开网页立即体验

3.创建番茄时钟项目

点击左上角 “项目” 按钮新建项目，选择 “HTML / CSS / JS” 项目，点击 “创建” 按钮创建项目

4.编写番茄时钟

将如下指令粘贴复制

请你基于html、tailwind css和javascript，帮我设计一个“番茄时钟”。要求UI简洁美观大方，同时具有呼吸感，点击开始计时、点击暂停计时和重置计时的功能能够完美实现

5.运行番茄时钟

打开左侧 【文件浏览器】 的 index.html ， 全选代码 ，找到右侧对应的 html文件 ，点击 插入光标处 ：

打开左侧 【文件浏览器】 的 script.js ， 全选代码 ，找到右侧对应的 javascript文件 ，点击 插入光标处 ：

点击上方的运行，右方查看执行效果