Easy Prompt提示词导航站
代码能力代码进阶

传奇泄露 - 魔法书 2-9 第1部分:入门与设置

本章节介绍如何通过提示工程快速构建并部署静态网站,涵盖从经典项目(如 Hello World、Pong 游戏)到现代工具(Netlify、Replit)的使用,以及开发环境搭建和 Git 基础。

提示词正文

复制后可直接粘贴到模型或内部评测工具。

你正在学习如何通过提示工程创建并部署网页项目。请完成以下任务:

  1. 使用 HTML、CSS 和 JavaScript 创建一个“Hello World”网站,并使用 N 快捷键自动部署到 Netlify。
  2. 创建一个可玩的 Pong 游戏,支持触屏手势和键盘控制(箭头键或 WASD),同样使用 N 快捷键部署。
  3. 构建一个“链接树”风格的个人链接页面(link in bio),以虚构角色(如动物、巫师)为主题,包含多个可点击链接。允许用户自定义标题、链接列表和设计风格(颜色、布局等)。使用 N 或 REPL 快捷键快速部署。
  4. 实现“图片转代码”功能:上传任意图片或手绘草图,将其转化为具有视觉冲击力的网页 UI,添加动态效果和精美样式。支持通过 DALL·E 生成背景图,并确保图像正确嵌入代码和最终压缩包中。
  5. 掌握 Netlify 的一键部署(N 快捷键)和手动拖拽部署(Netlify Drop),了解如何更新网站和修改域名。
  6. 学习使用 Replit 进行代码托管与部署,掌握 REPL 快捷键导出、静态站点配置及自定义域名设置。
  7. 在手机上完成开发环境搭建:注册 Replit 和 GitHub 账号,安装 Replit 应用,创建项目并同步至 GitHub,演示如何通过手机完成全流程开发。
  8. 配置专业开发工具链:安装 Cursor.sh、Warp 终端、Git Tower 或 SourceTree,启用 GitHub Copilot,创建新项目并与 Git 仓库同步。
  9. 学习 Git 基础:理解版本控制概念,掌握 clone、pull、commit、push、merge 等核心命令,推荐使用图形化工具(如 Git Tower)管理分支与历史。
  10. 了解 Linear 项目管理工具,适用于团队协作,可将 issue 名称作为 Git 分支名实现自动化流程。

使用场景

初学者快速上手网页开发个人品牌建设(链接树页面)游戏原型开发(Pong)无代码/低代码部署实践手机端编程学习团队协作与版本管理入门

参考输出

一个完整的静态网站项目结构,包含 index.html、style.css 和 script.js 文件;支持通过 N 快捷键自动部署到 Netlify 并生成可访问的 .netlify.app 域名链接;提供 Git 初始化、提交和推送至 GitHub 的完整命令行或 GUI 操作示例。

评分维度

重点评估可执行性、事实准确性、边界控制和结构完整度。

用户评分

0 个评分
-

你的评分

登录后评分

评论

0

登录后评论

相关提示词

图片写作生成

产品营销 - 黑白先锋时尚人像

一个用于拍摄锐利人像的高级时尚黑白编辑提示词,包含戏剧性光影和未来感配饰,模仿奢侈品牌广告大片风格。

Nano Banana Pro图片提示词产品营销
Nano Banana Pro 图像生成
图片写作生成

社交媒体帖子 - 梦幻夜花园时尚人像

一个复杂且高质量的提示词,用于创作充满奇幻色彩的时尚大片,营造出闪烁的灯光与浪漫的氛围。

Nano Banana Pro图片提示词社交媒体帖子
Nano Banana Pro 图像生成
图片写作生成

社交媒体帖子 - 野花丛中梦幻般的女子

这是一个电影级、照片写实风格的提示词,用于创作一幅女子在雏菊丛中的宁静肖像,强调柔和的自然光和前景细节的清晰对焦。

Nano Banana Pro图片提示词社交媒体帖子
Nano Banana Pro 图像生成
图片写作生成

社交媒体帖子 - 地中海里维埃拉男装风格

一份全面的专业摄影提示词,旨在呈现以阳光普照的石质建筑为背景、对比鲜明且锐利的男装时尚大片。

Nano Banana Pro图片提示词社交媒体帖子
Nano Banana Pro 图像生成