project virtual pet

研究好友

方向

• 请单击此链接，请导航到我们的应用程序。 （注意：DNS的传播需要很长时间，因此使用学校的Wi -Fi -TusecureWireless时，指向该网站的链接将无效。请从另一个网络连接）。到达那里后，您可以创建一个帐户，选择宠物并探索网站。
• 研究好友是一个渐进式网络应用程序（PWA）。这意味着您可以在浏览器中使用它，也可以将其下载到设备上并像应用一样使用。
  • 在iOS上：打开Safari并导航到该网站。按“共享”按钮，然后从弹出窗口中选择“添加到主屏幕”。最后，在右上角点击“添加”以完成安装PWA。现在将在您的主屏幕上。
  • 在Android上：打开Chrome并导航到该网站。在右上角按“三点”图标，以打开菜单。选择“添加到主屏幕”。按弹出窗口中的“添加”按钮。现在已安装PWA并在主屏幕上可用。
• 如果遇到任何错误或问题，请访问我们的文档网站，然后单击页面右侧的“报告错误”按钮。这将带您进入反馈表格，您可以在其中提供有关遇到的问题的详细信息。

关键字

第704节，Web应用程序，JavaScript，HTML，CSS，Python，Django，教育，学习，学习，目标，提醒，虚拟宠物

项目摘要

本文档提出了一个渐进式Web应用程序，该应用程序结合了游戏化和个人发展的好处，以增强研究经验。该应用程序允许用户照顾一个虚拟宠物，该虚拟宠物是学习伴侣和动力。用户可以设定每日或每周的目标，设置提醒，跟踪其进度并与其画布帐户联系以跟踪作业。这些目标的进展将直接影响虚拟宠物的外表和情绪，激发用户中的动机，陪伴，责任和团结感。通过使用此应用程序，用户将具有提高其学习成绩的引人入胜且有效的方法。

高级要求

该应用需要Internet连接才能函数，并且可以在使用现代Web浏览器的任何设备上访问。用户可以设定学习目标，跟踪其进度并与其画布帐户联系。通过点系统实现他们的学习目标，用户将获得奖励，在这种系统中，给定的点数将取决于完成的任务大小。达到一定数量的点后，用户的宠物将升级。该应用程序还与画布集成在一起，允许用户访问并跟踪其作业。用户可以命名他们的宠物并与之互动，并按照他们的时间表执行任务直接影响宠物的状况和情绪。宠物的心情和外观将受用户实现目标的能力的影响。

概念设计

应用程序的前端将使用JavaScript，React，HTML和CSS构建。 React将用于构建UI组件并管理应用程序的状态，JavaScript，HTML和CSS将用于创建用户界面并处理用户交互。后端将使用Python和Django构建，以处理用户身份验证和授权，数据存储以及确定虚拟宠物外观如何根据学生的学习习惯变化的算法。 SQLite将用于存储用户的数据，例如他们的学习目标，进度和奖励。该应用程序还将与画布集成，以使学生可以跟踪他们的作业和课程，并将其包括在个人学习目标中。

背景

类似的产品包括我的学习寿命和Quizlet。这些都是封闭式产品，旨在帮助学生提高学业表现。我的学习生活是在线学生计划者，它允许学生跟踪他们的截止日期和课程。 Quizlet允许学生创建抽认卡和测验来学习课程。学习Buddy应用与这些产品相似，因为目标是提供资源来帮助学生在学术上取得成功并掌握其课程。但是，该应用程序还结合了虚拟宠物同伴的独特方面，以帮助他们保持学习动力。研究好友应用程序将包含与Quizlet和我的学习生活相同的功能，例如设置提醒或创建和链接到学习材料。

另一个名为Finch的封闭源移动应用程序涉及照顾虚拟宠物以实现自我保健目标。 Habitica是一种开源Web应用程序，可以通过允许他们设定遵守个人习惯的目标来帮助用户游戏。将关心宠物的概念和游戏化的概念（如本应用程序）以及研究应用程序的功能一样，将使用户获得更个性化和有趣的体验，以取得成功的学术追求。

需要资源

将需要对完成该项目所需的各种软件资源进行研究，包括JavaScript，React，HTML/CSS，Django，Sqlite和Canvas API。 React将用于前端，后端的Django，以及将SQLite数据库与由Django定义和管理的模式和静态文件存储的模式的组合。所需的资源是Ubuntu服务器，它将使用旧笔记本电脑上运行，或者将使用托管服务。无需其他硬件资源。

本地构建说明

先决条件

• Python 3.8或更高

• PIP3 22或更高

• NPM 8或更高

在.env文件中，将需要一个秘密密钥和Gmail密码，以使项目正确运行。如果您是该项目的批准开发人员，请与您的团队负责人联系以获得必要的证书。为了发送有关用户注册的电子邮件验证，需要修改后端代码源代码。我们的团队很乐意帮助您完成此过程。

设置

1. 在版本中下载zip文件并打开。打开终端，然后导航到项目目录。

2. 将您的开发密钥插入~/sb/backend/.env

 SECRET_KEY=<YOUR-KEY>
GMAIL_PASSWORD=<YOUR-PASSWORD>

3. 导航到后端：

 cd < your-path > /sb/backend 

4. 激活Python虚拟环境并安装依赖性：

（MacOS/UNIX）

 source tutorial-env/bin/activate
pip3 install -r requirements.txt

视窗

tutorial-env S cripts a ctivate.bat
pip3 install -r requirements.txt

5. 通过以下说明激活后端：

python3 manage.py makemigrations
python3 manage.py migrate
python3 manage.py runserver

6. 现在，打开一个新的终端，从项目目录中，导航到前端：

 cd < your-path > /sb/frontend

7. 如下构建前端。依赖项将为您下载和编译：

npm install 
npm run build 
nmp start

8. 在您的浏览器中，在搜索栏中导航到http：// localhost：3000。

合作者

玛丽·克莱

克里斯汀·乔（Christine Cho）

亚历山大·鲁萨科夫（Alexander Russakoff）

卡特里娜·贾奇科（Katrina Janeczko）

哈里森·费多（Harrison Fedor）

杰伊·纽曼（Jay Newman）

伊恩·泰勒·阿普鲍姆（Ian Tyler Applebaum）