我过去的各个项目，游戏也好，工具也罢，基本上都是本地的应用程序开发。我想，是时候该走出我的舒适区，去探索未知的领域了。

0 背景概述🔍

在2023年下半学期平平无奇的一天，数据管理课的ISP1Independant Study Project如约而至，这次ISP的要求是设计一个简单的概率游戏，让全班同学玩，记录游戏结果并写出报告。因为没有限制游戏的形式，我的一道灵感迸射出来——为什么不做个网页游戏，让全班同学可以在自己的设备上玩，并且实时统计并分析结果呢？

这个想法一出现就在我的脑海里掀起了滔天的巨浪，我顿时意识到我自己原来终于走到了这一步，走到了自己舒适圈的边缘，再往前一步，就是未知的茫茫迷雾。我以前做的项目全部是本地的离线应用，即使有在线的交互也是简单的检查缺失组件，检查更新等。虽然我在Mapleaf大佬的启发和指导中有了对AWS2Amazon Web Service的初步探索，但是在全栈开发上还完全是一个蹒跚学步的婴儿。

1 开发历程📋

基础的框架建设

下定决心之后，我开始从网上学习相关的内容，边学边做。首先我面临的是前端框架的选择，我在反复对比和尝试后选择了Vue3+Vite的组合，并且使用了Element Plus和Tailwind辅助前端开发，大大地减少了工作量和难度。当然，这些不是一开始就决定下来的，而是随着开发慢慢加入的，此前的设计和代码也一次次被推倒重来。

2023年4月17号，看着我的网站框架第一次在局域网上运行，看着这个还没有任何功能的框架，我仿佛看到了无限的可能和指引我前行的点点星光。我感觉之前的付出也得到了些许回报和慰藉，劳累仿佛顿时消融了些许。

添加逻辑和内容，第一次部署

框架做完后，我准备向其中加入游戏的基础逻辑，让他可以运作起来，实现基础的功能。这段时期我遇到了些许阻碍，比如麦粒肿和刚开服的星穹铁道。总之，我在这个阶段耽搁了一些时间，死线也在慢慢地逼近，督促我加快我的进度。逻辑本身并不复杂，但是我要使用从没接触过的TypeScript语言，并且要将脚本，模板，样式三部分结合，对我来说是一种从未接触过的挑战。

2023年5月2号，我的网页源代码被我上传至GitHub，并且通过Amplify实现连续部署，也在我的域名上创建了记录，至此，它在互联网的无尽瀚宇中有了自己的小小的、不为人知的角落。当时，它的地址是dmisp.pitrick.link，后来则是改为了isp.pitrick.link，我开始把这个对我意味着很多的链接分享给我的好友们，请他们测试我这个青涩懵懂的作品。

最大难关——后端集成

前端基本完成之后，来到了对我来说更为陌生的后端开发部分。因为我在搭建博客和个人简历时对AWS有所了解，所以这次也选择了AWS的各种服务作为后端的框架。整体的前后端集成使用了Amplify，这个服务集成了许多实用的后端接口，使得后端开发对于我这个菜鸟也成为了现实。选定了大致的方向之后，就是一些漫长的

while(!done){try{code();}catch(error){google(error); stackOverflow(error); debug(error);}}

循环。在这个领域，许多东西对我都是不透明，未知的，我不得不在一次次的跌倒和摸索中才能感受到大致的形状。以下是我实现一些功能所使用的服务，希望可以起到一点点的参考作用：

  • 身份验证系统，如登录注册：Cognito
  • 数据接口，如游戏记录保存，设置保存：Appsync和DynamoDb
  • 定时函数和数据持久化，如全局统计和排行榜：Lambda, CloudFront EventBridge和S3 Bucket

2023年5月15号，我完成了最后的全局数据统计和排行榜的前后端，并且设置了每小时更新的触发器。点下推送的那一刻，它终于走完了了长达一个月的成长阶段，进化为了“完全体”，虽然还会有许多小的改动，但是大致的内容已经确定下来，不会再更改了。看着承载着我这段时间种种情绪的作品，我顿时感到五味杂陈，展望未来的斗志满怀，报错时的错愕和失落，无数次调试的纠结和暴躁，以及最后看着成功的兴奋和喜悦，都交织在一起。它作为我第一个走出舒适区的尝试，早已超出了程序本身的意义。

2 项目特色💡

加拿带首家线上堵厂上线啦！

更有帅哥荷官老陈线上发牌

这个小游戏网站可以做到：

  • 跨平台兼容，手机电脑平板都能玩
  • 游戏数据自动保存到后端，刷新不会丢失，并且通过账号可以不同平台共享
  • 可以查看自己过去的游戏记录和概率分布
  • 可以查看所有玩家的数据统计和分析，每小时刷新一次
  • 可以查看分数的排行榜，每小时刷新一次
  • 滚动播放的标语
  • 中英文双语言支持，可以随时切换并且保存当前语言设置

然而，它暂时还做不到：

  • 完全适应各个平台的不同分辨率
  • 实时的排行榜和统计数据刷新（受制于数据库读取的花销）
  • 每次操作都实时保存（现在是每进行5次游戏保存一下，受制于数据库写入的花销）总之就是马内的问题

3 游戏玩法介绍✏️

基础玩法

  1. 点击“重新开始游戏”解锁扑克选择器，同时随机生成一张扑克牌，玩家无法看到打开控制台可以看到
  2. 点击选择一张扑克牌之后根据选择的扑克和随机的扑克是否花色相同/点数相同得到奖励的分数。
  3. 点击“重新开始游戏”开始下一场游戏，并重复1-3，每次重新开始也要消耗一定的分数。

分数奖励/消耗及概率

事件分数奖励/消耗事件发生的概率数学期望
重新开始游戏（非随机事件）-10N/A-10
选中完全相同的扑克1000.01921.92
选中点数相同的扑克500.05774.62
选中花色相同的扑克200.23082.88
选中完全不同的扑克00.69230
总计N/A1-0.58
  • 1
    Independant Study Project
  • 2
    Amazon Web Service

Hello, world!