从0到1:我用AI三天做了一个完整的天气查询网站
我是一个产品经理,写代码的经验约等于零。三天前我决定挑战自己:用AI做一个天气查询网站。这是我的完整经历。
Day 1:从一句话开始
我跟Claude说:
帮我做一个天气查询网站,输入城市名就能看到天气
AI立刻给了我一个方案:用HTML + JavaScript,调用免费的天气API(OpenWeatherMap)。
踩坑1:API Key
天气API需要注册获取Key。AI教我去OpenWeatherMap注册,但新Key需要等2小时才能用。我一开始不知道,以为代码写错了,折腾了好久。
经验:问AI之前先说清楚你是新手。 我后来改成这样问:
我是完全的新手,从来没用过API。
请从注册账号开始,一步步教我怎么获取天气API的Key,
以及怎么测试Key是否生效。
这次AI给了详细到每个按钮的操作步骤。
Day 2:让它变好看
基础功能跑通后,界面很丑。我跟AI说:
现在能查天气了,但界面太简陋。
帮我改成这样:
背景根据天气变化(晴天蓝色、雨天灰色)
加上天气图标
显示未来3天预报
手机上也能用
AI一次性帮我改好了,效果比我预期好太多。
踩坑2:跨域问题
直接打开HTML文件调用API会报错(CORS),AI教我用一个简单的本地服务器解决:
npx serve .
一行命令就搞定了。
Day 3:部署上线 + 分享
最后一天把网站部署到Vercel:
然后我把链接发到朋友圈,收获了一堆点赞。有人问我"你什么时候学的编程",我说"没学过,AI帮我写的"。
最终成果
三天学到了什么?
给想尝试的人
如果你也想试试,我的建议: