豆包MarsCode 蛇年编程大作战 | 高效开发“蛇年运势预测系统”

在这里插入图片描述

🌟 嗨，我是LucianaiB！

🌍 总有人间一两风，填我十万八千梦。

🚀 路漫漫其修远兮，吾将上下而求索。

豆包MarsCode 蛇年编程大作战 | 🐍 蛇年运势预测

在线体验地址：蛇年运势预测
可直接运行代码：

前提说明
- 1.1 豆包MarsCode介绍
- 1.2 背景说明
前期工作
- 2.1 创建Pycharm项目
- 2.2 安装插件
项目准备
- 3.1 开始一直的微调
作品效果展示
🐍 蛇年运势预测系统使用教程
- 5.1 系统要求
- 5.2 安装步骤
  - 5.2.1 环境准备
  - 5.2.2 文件准备
- 5.3 启动应用
  - 5.3.1 运行服务器
  - 5.3.2 访问应用
- 5.4 使用说明
  - 5.4.1 输入个人信息
  - 5.4.2 获取运势预测
  - 5.4.3 查看预测结果
- 5.5 注意事项
- 5.6 技术支持

前提说明

豆包MarsCode介绍

豆包 MarsCode 是一款由字节跳动推出的智能开发工具，基于豆包大模型开发，旨在通过 AI 技术提升开发者的编程效率和质量。它以插件形式集成到主流 IDE（如 Visual Studio Code 和 JetBrains IDEs）中，同时也提供云端 IDE 版本，支持多种主流编程语言。

背景说明

在当今快节奏的编程世界中，找到一款既高效又便捷的开发工具无疑是每个程序员的梦想。而豆包的 MarsCode 正是这样一款神器！它不仅极大地简化了开发流程，还让复杂的代码生成变得轻而易举。无论是初学者还是经验丰富的开发者，都能在MarsCode的帮助下快速搭建出令人惊叹的项目。

在最近参与的一个豆包文章项目中，我使用了MarsCode来搭建一个以“蛇年主题”为核心的个人项目——“蛇年运势预测系统”。这个系统不仅让我深刻体会到MarsCode的强大功能，还让我对编程的乐趣有了全新的认识。

MarsCode的智能代码生成功能让我能够轻松地创建项目大纲，快速搭建前端页面，并且在遇到问题时迅速定位并解决。它就像一个智能助手，时刻陪伴在我的身边，帮助我优化代码、美化界面，甚至自动修复一些常见的错误。这种高效、智能的开发体验，让我对编程充满了信心和热情。

接下来，就让我带你走进这个充满趣味的“蛇年运势预测系统”的开发之旅，看看MarsCode是如何让这一切变得如此简单而美好的！

前期工作

创建Pycharm项目

1.创建一个python项目，名为：蛇年运势预测，这里使用conda配置环境
在这里插入图片描述

2.安装插件

打开Pycharm,点击File(文件)，然后选择Settings，选择Plugins，输入“MarsCode”，并点击Install进行安装：
在这里插入图片描述
安装完成后，点击Restart IDE，重启Pycharm。

项目准备

开始一直的微调

开始多轮对话
在编程过程中，遇到大量的代码调试工作是很常见的。具体对话过程确实可能非常繁琐，就像你所说，可能需要反复多次调整，才能得到满意的代码结果。这个过程确实需要极大的耐心，要不断地去查找代码中的bug，对发现的问题进行调试，然后根据调试结果进行相应的修改。每一次修改后，都要重新运行代码，查看是否解决了问题，又是否引入了新的问题。如此反复循环，直到代码能够按照预期正常运行。这个过程虽然辛苦，但当最终看到代码成功运行，实现预期功能时，那种成就感是难以言喻的。

在这里插入图片描述

使用命令(目的：对整体项目有一个大概的了解)

我创建了一个python项目，蛇年运势预测，帮我对这个项目进行一个大纲的创建

可以发现他已经把我们大部分想要的已经创建成功了

在这里插入图片描述
使用命令(目的：使用MarsCode美化前端页面)

美化前端页面

在这里插入图片描述

相比较前面就是已经将前端美化的时间上已经差不多了

请添加图片描述
使用命令(目的：处理bug)

这个年的范围太广了，请帮我增加月日用来去判断运势预测，因为这个是关于蛇年的运势预测，请帮我加入蛇相关的元素

在这里插入图片描述

在这个时候我们突然发现他的月份无法正常使用，我们直接选择让他进行处理

在这里插入图片描述
使用命令(目的：处理bug)

他的月份无法正常选择，且年月日的布局不是很合理。请帮我修改这个问题，使其美观，且可以正确的处理问题

在这里插入图片描述

相比较前面就是已经将前端美化的时间上已经差不多了

在这里插入图片描述
使用命令(目的：加入背景，使其美观)

在同目录下有一个照片，请把它设置为整个前端的一个背景

在这里插入图片描述

此时已经将前端美化的时间上已经差不多了

在这里插入图片描述

使用命令(最后一次美观)

将整个前端的界面进行一个美观优化。例如框架或者格子之类的，使其变得高大上

在这里插入图片描述
这就是最后的成品！！！很不错的体验。

作品效果展示

我们在main函数中，右击然后运行主函数
在这里插入图片描述

我们可以看到运行成功，并且出现了本地可访问的网站
在这里插入图片描述

访问网站输入姓名以，出生年份，出生月份，出生日期，即可2025蛇年运势预测，可以看到整个运势预测
在这里插入图片描述

🐍 蛇年运势预测系统使用教程

系统要求

Python 3.x
Flask 框架
浏览器（支持现代浏览器如 Chrome、Firefox、Edge 等）

安装步骤

环境准备

# 安装必要的Python包
pip install flask

文件准备

将背景图片 蛇迎新春.png 放在项目根目录下
确保 main.py 文件存在

启动应用

运行服务器

python main.py

访问应用

打开浏览器
访问 http://localhost:5000

使用说明

1. 输入个人信息

在姓名输入框中输入您的姓名
在生辰信息区域填写：
- 出生年份（1920-2024）
- 出生月份（1-12）
- 出生日期（1-31）

2. 获取运势预测

点击"查看运势"按钮
系统将自动生成您的运势预测结果

3. 查看预测结果

预测结果包含以下信息：

您的生肖属相
总体运势
事业运势
感情运势
财运
健康运势
幸运数字
幸运颜色
开运方位

注意事项

请确保输入真实的出生日期以获得准确预测
系统会自动校验日期的有效性
运势预测仅供娱乐参考
页面支持响应式设计，可在各种设备上正常显示

技术支持

如遇到技术问题，请检查：

Python 和 Flask 是否正确安装
背景图片是否位于正确位置
服务器是否正常运行
浏览器控制台是否有错误信息

祝您使用愉快，新年吉祥！🎊

总结

本文介绍了使用豆包MarsCode开发“蛇年运势预测系统”的全过程。豆包MarsCode是一款基于AI技术的智能开发工具，能够显著提升开发效率，适用于多种主流编程语言和主流IDE。

开发过程

项目创建与环境搭建
使用PyCharm创建了一个名为“蛇年运势预测”的Python项目，并通过conda配置环境。随后安装了MarsCode插件，为后续开发提供了智能支持。
项目开发与优化
在开发过程中，MarsCode的智能代码生成功能发挥了重要作用。通过简单的命令，快速生成了项目大纲，并美化了前端页面。同时，MarsCode还帮助解决了代码中的bug，优化了布局和功能，例如增加了蛇年相关的元素和背景图片，提升了界面的美观度和用户体验。
功能实现与测试
系统实现了蛇年运势预测的核心功能，用户输入姓名和出生日期后，即可获取包括总体运势、事业、感情、财运、健康等多方面的预测结果。经过多轮调试和优化，系统最终能够稳定运行，并支持响应式设计，可在不同设备上正常显示。
使用教程与支持
文章详细介绍了系统的使用方法，包括环境准备、安装步骤、启动应用和使用说明。同时，还提供了技术支持指南，帮助用户解决可能遇到的问题。

项目特点

高效开发：借助MarsCode的智能生成功能，大幅减少了代码编写和调试的时间。
美观界面：通过MarsCode优化，前端页面美观且具有蛇年特色。
功能完善：系统不仅预测运势，还提供了幸运数字、颜色和开运方位等信息。
易用性高：界面简洁，操作方便，支持多种设备访问。

通过本次项目，作者深刻体会到MarsCode的强大功能和高效开发体验。它不仅简化了开发流程，还让编程变得更加有趣。未来，作者将继续探索MarsCode的更多功能，开发更多有趣的项目。

附录代码

from flask import Flask, render_template_string, request, jsonify, send_from_directory
import random
import osapp = Flask(__name__)# HTML模板（直接嵌入到Python文件中）
HTML_TEMPLATE = '''
<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><title>蛇年运势预测</title><style>body {font-family: 'Microsoft YaHei', sans-serif;max-width: 900px;margin: 20px auto;padding: 20px;min-height: 100vh;background: url('/static/蛇迎新春.png') center center fixed;background-size: cover;position: relative;color: #333;}/* 添加一个半透明遮罩层 */body::before {content: '';position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(255, 255, 255, 0.65);z-index: -1;}.container {background-color: rgba(255, 255, 255, 0.8);padding: 40px;border-radius: 20px;box-shadow: 0 15px 30px rgba(0,0,0,0.15);transition: all 0.3s ease;backdrop-filter: blur(3px);position: relative;z-index: 1;border: 2px solid #d81e06;background-image: linear-gradient(45deg, #d81e06 12px, transparent 0),linear-gradient(-45deg, #d81e06 12px, transparent 0);background-position: top left, top right;background-repeat: no-repeat;background-size: 30px 30px;}.container::before,.container::after {content: '';position: absolute;width: 30px;height: 30px;bottom: 0;border: 2px solid #d81e06;}.container::before {left: 0;border-width: 0 0 2px 2px;}.container::after {right: 0;border-width: 0 2px 2px 0;}h1 {color: #d81e06;text-align: center;font-size: 2.5em;margin-bottom: 30px;text-shadow: 2px 2px 4px rgba(0,0,0,0.1);position: relative;padding-bottom: 15px;}h1::after {content: '';position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);width: 100px;height: 3px;background: linear-gradient(90deg, transparent, #d81e06, transparent);}.input-section {text-align: center;margin: 30px 0;display: flex;flex-direction: column;align-items: center;gap: 25px;width: 100%;max-width: 600px;margin: 0 auto;}.name-input {position: relative;margin-bottom: 30px;width: 100%;max-width: 400px;margin: 0 auto 30px;}.name-input::after {content: '';position: absolute;bottom: -10px;left: 0;width: 100%;height: 1px;background: linear-gradient(90deg, transparent, rgba(216,30,6,0.2), transparent);}.name-input label {position: absolute;left: 15px;top: -10px;background: white;padding: 0 5px;color: #666;font-size: 14px;z-index: 1;}.name-input input {width: 100%;padding: 15px;border: 2px solid #eee;border-radius: 8px;font-size: 16px;transition: all 0.3s ease;}.date-inputs {display: grid;grid-template-columns: repeat(3, 1fr);gap: 30px;width: 100%;background: rgba(255, 255, 255, 0.9);padding: 30px;border-radius: 15px;box-shadow: 0 5px 15px rgba(0,0,0,0.05);margin: 20px 0;border: 1px solid rgba(216,30,6,0.3);position: relative;}.date-inputs::before {content: '生辰信息';position: absolute;top: -12px;left: 20px;background: white;padding: 0 10px;color: #d81e06;font-weight: bold;font-size: 14px;}.input-group {position: relative;padding: 5px;}.input-group label {font-size: 14px;color: #666;font-weight: 500;margin-bottom: 8px;display: block;}.input-group input {width: 100%;padding: 12px 15px;border: 2px solid rgba(216,30,6,0.2);border-radius: 8px;font-size: 16px;transition: all 0.3s ease;background-color: white;height: 45px;}.input-group input:focus {outline: none;border-color: #d81e06;box-shadow: 0 0 10px rgba(216,30,6,0.1);}input[type="number"] {-moz-appearance: textfield;appearance: textfield;width: 100%;}input[type="number"]::-webkit-outer-spin-button,input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none;margin: 0;}select {cursor: pointer;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23666' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");background-repeat: no-repeat;background-position: calc(100% - 12px) center;padding-right: 35px;}select:invalid {color: #999;}option {color: #333;}button {background: linear-gradient(45deg, #d81e06, #ff4b2b);color: white;border: none;border-radius: 25px;padding: 15px 50px;font-size: 18px;font-weight: bold;cursor: pointer;transition: all 0.3s ease;margin-top: 30px;min-width: 250px;text-shadow: 1px 1px 2px rgba(0,0,0,0.2);box-shadow: 0 5px 15px rgba(216,30,6,0.3);position: relative;overflow: hidden;}button::before {content: '';position: absolute;top: 0;left: -100%;width: 100%;height: 100%;background: linear-gradient(90deg,transparent,rgba(255,255,255,0.2),transparent);transition: 0.5s;}button:hover::before {left: 100%;}button:active {transform: translateY(1px);box-shadow: 0 3px 10px rgba(216,30,6,0.3);}button:disabled {background: #cccccc;cursor: not-allowed;transform: none;box-shadow: none;}.result {background-color: rgba(255, 255, 255, 0.85);backdrop-filter: blur(3px);padding: 30px;border-radius: 15px;margin-top: 30px;border: 1px solid rgba(216,30,6,0.2);position: relative;animation: fadeIn 0.5s ease;}@keyframes fadeIn {from { opacity: 0; transform: translateY(20px);}to { opacity: 1;transform: translateY(0);}}.result h2 {color: #d81e06;text-align: center;margin-bottom: 25px;font-size: 1.8em;}.result p {margin: 15px 0;padding: 12px;border-radius: 8px;background-color: rgba(255,255,255,0.7);border-left: 3px solid #d81e06;transition: all 0.3s ease;}.result p:hover {transform: translateX(5px);background-color: rgba(255,255,255,0.9);}.special-note {background: linear-gradient(45deg, rgba(216,30,6,0.1), rgba(255,75,43,0.1));border: 2px dashed #d81e06;padding: 20px;border-radius: 12px;text-align: center;margin-top: 25px;position: relative;overflow: hidden;}.special-note::before {content: '🎊';position: absolute;left: 20px;top: 50%;transform: translateY(-50%);font-size: 24px;}.special-note::after {content: '🎊';position: absolute;right: 20px;top: 50%;transform: translateY(-50%);font-size: 24px;}/* 新增样式 */.snake-border {position: relative;border: 2px solid #d81e06;padding: 40px;margin: 20px 0;border-radius: 15px;}.snake-border::before {content: "🐍";position: absolute;top: -15px;left: 20px;background: white;padding: 0 10px;font-size: 24px;}.snake-decoration {text-align: center;margin: 15px 0;font-size: 28px;background: linear-gradient(45deg, #d81e06, #ff4b2b);-webkit-background-clip: text;-webkit-text-fill-color: transparent;animation: slither 3s infinite ease-in-out;}@keyframes slither {0% { transform: translateX(-10px); }50% { transform: translateX(10px); }100% { transform: translateX(-10px); }}</style>
</head>
<body><div class="container"><h1>✨ 2025蛇年运势预测 ✨</h1><div class="snake-decoration">🐍 ~ ~ ~</div><div class="snake-border"><div class="input-section"><div class="name-input"><label>姓名</label><input type="text" id="name" placeholder="请输入您的姓名" autocomplete="off"></div><div class="date-inputs"><div class="input-group"><label>出生年份</label><input type="text" id="birth-year" placeholder="如：1990" maxlength="4"autocomplete="off"oninput="validateNumber(this, 1920, 2024, 4)"></div><div class="input-group"><label>出生月份</label><input type="text" id="birth-month" placeholder="如：1-12" maxlength="2"autocomplete="off"oninput="validateNumber(this, 1, 12, 2)"></div><div class="input-group"><label>出生日期</label><input type="text" id="birth-day" placeholder="如：1-31" maxlength="2"autocomplete="off"oninput="validateNumber(this, 1, 31, 2)"></div></div><button onclick="getFortune()">查看运势</button></div></div><div id="result" class="result"></div></div><script>function validateNumber(input, min, max, maxLength) {// 只允许输入数字input.value = input.value.replace(/[^\d]/g, '').slice(0, maxLength);let value = parseInt(input.value);if (input.value.length === maxLength || value > max) {if (value < min) {input.value = min.toString();} else if (value > max) {input.value = max.toString();}}validateDate();}function validateDate() {const year = parseInt(document.getElementById('birth-year').value);const month = parseInt(document.getElementById('birth-month').value);const dayInput = document.getElementById('birth-day');const day = parseInt(dayInput.value);if (isNaN(year) || isNaN(month) || isNaN(day)) return;let maxDays = 31;if ([4, 6, 9, 11].includes(month)) {maxDays = 30;} else if (month === 2) {maxDays = (year % 4 === 0 && (year % 100 !== 0 || year % 400 === 0)) ? 29 : 28;}if (day > maxDays) {dayInput.value = maxDays.toString();}}function getFortune() {const year = document.getElementById('birth-year').value;const month = document.getElementById('birth-month').value;const day = document.getElementById('birth-day').value;const name = document.getElementById('name').value;if (!year || !month || !day || !name) {alert('请填写完整信息！');return;}if (year.length !== 4 || parseInt(year) < 1920 || parseInt(year) > 2024) {alert('请输入有效的出生年份！');return;}const button = document.querySelector('button');button.disabled = true;button.innerHTML = '正在测算...';fetch('/get_fortune', {method: 'POST',headers: {'Content-Type': 'application/json',},body: JSON.stringify({name: name,birth_year: year,birth_month: month,birth_day: day})}).then(response => response.json()).then(data => {const resultDiv = document.getElementById('result');resultDiv.style.display = 'block';resultDiv.innerHTML = `<div class="snake-decoration">🐍 ~ ~ ~</div><h2>🌟 ${name}的蛇年运势预测 🌟</h2><div class="zodiac-info">${getZodiacInfo(data.zodiac_sign, data.is_snake_year)}</div><p>总体运势：${getEmoji(data.overall)} ${data.overall}</p><p>事业运：${getEmoji(data.career)} ${data.career}</p><p>感情运：${getEmoji(data.love)} ${data.love}</p><p>财运：${getEmoji(data.wealth)} ${data.wealth}</p><p>健康运：${getEmoji(data.health)} ${data.health}</p><p>🔮 幸运数字：${data.lucky_numbers.join('、')}</p><p>🎨 幸运颜色：${data.lucky_colors.join('、')}</p><p>🌿 开运方位：${data.lucky_directions.join('、')}</p>${data.is_snake_year ? '<p class="special-note">🐍 恭喜您！2024年是您的本命年！要记得戴红色饰品以旺运避凶！🎊</p>' : ''}`;button.disabled = false;button.innerHTML = '查看运势';}).catch(error => {console.error('Error:', error);alert('获取运势失败，请重试！');button.disabled = false;button.innerHTML = '查看运势';});}function getEmoji(fortune) {const emojis = {'大吉': '🐍','吉': '✨','中平': '⭐','小凶': '☁️','大凶': '⚡'};return emojis[fortune] || '🌟';}function getZodiacInfo(zodiacSign, isSnakeYear) {const baseInfo = `您的生肖属相：${zodiacSign}`;if (isSnakeYear) {return `${baseInfo}<br>🎊 2024年是您的本命年 🎊<br><span style="color: #d81e06">温馨提示：本命年要特别注意趋吉避凶，建议佩戴红色饰品，助您好运连连！</span>`;}return baseInfo;}</script>
</body>
</html>
'''def calculate_fortune(birth_year, birth_month, birth_day, name):# 定义运势等级luck_levels = ["大吉", "吉", "中平", "小凶", "大凶"]# 计算生肖zodiac_year = (int(birth_year) - 4) % 12zodiac_signs = ["鼠", "牛", "虎", "兔", "龙", "蛇", "马", "羊", "猴", "鸡", "狗", "猪"]zodiac_sign = zodiac_signs[zodiac_year]is_snake_year = (zodiac_year == 5)# 根据月日调整运势权重month_weight = (int(birth_month) * int(birth_day)) % 5# 生成运势fortune = {"zodiac_sign": zodiac_sign,"is_snake_year": is_snake_year,"overall": luck_levels[(month_weight + int(birth_day)) % 5],"career": luck_levels[(month_weight + int(birth_month)) % 5],"love": luck_levels[(month_weight + int(birth_year) % 5) % 5],"wealth": luck_levels[(month_weight + sum(map(int, str(birth_day)))) % 5],"health": luck_levels[(month_weight + sum(map(int, str(birth_month)))) % 5],"lucky_numbers": random.sample(range(1, 50), 3),"lucky_colors": random.sample(["红色", "黄色", "青色", "紫色", "金色", "银色"], 2),"lucky_directions": random.sample(["东", "南", "西", "北", "东南", "西南", "东北", "西北"], 2)}return fortune@app.route('/')
def index():return render_template_string(HTML_TEMPLATE)@app.route('/get_fortune', methods=['POST'])
def get_fortune():data = request.get_json()birth_year = data.get('birth_year')birth_month = data.get('birth_month')birth_day = data.get('birth_day')name = data.get('name')fortune_result = calculate_fortune(birth_year, birth_month, birth_day, name)return jsonify(fortune_result)# 添加静态文件路由
@app.route('/static/<path:filename>')
def serve_static(filename):return send_from_directory('static', filename)if __name__ == '__main__':# 确保static目录存在if not os.path.exists('static'):os.makedirs('static')# 如果图片不在static目录中，将其复制到static目录if not os.path.exists('static/蛇迎新春.png') and os.path.exists('蛇迎新春.png'):import shutilshutil.copy('蛇迎新春.png', 'static/蛇迎新春.png')app.run(debug=True)