Groupd Mobile Application
1.0.0
使用Ionic 2框架开发的移动应用程序，它是GroupD的另一个前端 - 一种社交网络应用程序，可以找到启动项目的团队伴侣。第三年，软件开发。
作为一个学期的第三年项目的任务，进行了GroupD-Mobile-application。这项任务是由Imervin设计和开发的。跨平台移动应用程序GroupD-Mobile-Application是三个存储库之一。其他两个存储库包括groupd-backend，groupD API，并由双方贡献，以及由Imervin开发的Web应用程序GroupD-Frontend。有关GroupD的更多详细信息，请访问有关GroupD部分。
要考虑的要点：
GroupD是一个设计的社交网站，旨在帮助用户找到团队伴侣来研究他们可能拥有的项目想法。 GroupD是考虑到开发人员的设计，但是GroupD鼓励并欢迎所有专业的用户，并且需要使用此平台来寻找队友。我和Ervin一起开发了一个共享数据库（请参阅为什么用于数据库模式的GroupD）和Restful API来管理我们的数据库并管理我们的CRUD功能以帮助我们的两个前端（请参阅GroupD-Backend以获取完整文档）。我们希望GroupD允许用户发布所需的项目，与其他用户沟通并与其他用户一起从事项目。 GroupD可用于娱乐和/或获得经验，并最终从他们从事的项目中建立投资组合。 GroupD也可用于寻找启动业务的团队成员。
有关Web应用程序上的完整文档，请参见GroupD-Frontend。
在与最初的想法分离之后，我加入了同学的项目Imervin，他的项目对我来说似乎很友好。我们都渴望在小组中工作，以体验和实践Github合作。 Ervin欢迎与他的Web应用程序相当的移动应用程序的想法。加入组成一个组，我们可以添加额外的功能。我们一起设计了一个新的数据库架构，并在下面附上，并更新了API以与这些更改相对应。
我最初的想法是构建Windows桌面安全应用程序，加密守门员。
加密管理员将：
问题：
尽管我将这个想法放在了年底项目中，但我不想放弃实施该项目，也许不是作为Windows Store应用程序。我已经实现了面部识别的作业，我们必须在本学期创建Windows Universal Platform应用程序，可以在Github上找到此WUP应用程序：Safe Note，在Windows Store：Note Safe（Note Safe）（Note Safe Note（在提交时不可用）名称安全说明）。
主要功能：
其他功能
我用侧符设计了groupD-mobile-application，该sidemenu明智地知道数据何时更改。用户数据提供商被调用以记录用户进出，并触发登录以更改侧面菜单的登录。用户数据还通过将当前用户存储在本地存储中并触发事件以提醒更改的任何资源来设置用户。在每个页面加载并重新加载时，当前用户将从API中重新加载，用户数据提供商将警告任何更改的资源，其中资源将异步从存储中获取新数据。
已登录的菜单由两个部分组成：
菜单中登录的菜单由三个部分组成：
报名
注册页面由一组幻灯片组成，每张幻灯片中都有一个表格，以获取注册数据。我使用Angular 2的FormBuilder通过内置验证器和自定义验证器实时验证输入。不幸的是，由于验证器的方法是静态的，因此我无法使异步自定义用户名 - 可用性浏览器起作用，因此我无法弄清楚如何在验证器中使用HTTP调用。提交数据后，完成了用户名的可用性验证。如果已获取用户名，则用户将自动转到必要的幻灯片，并提醒您获取用户名。如果可用的用户名，则将数据保存为用户，则复位表格，并将用户提醒成功，并给出了直接转到登录页面的选项。
登录
登录页面是非常自我解释的，用户可以使用其用户名和密码登录。如果不存在用户名，则将未找到用户名称。如果存在用户名，并且密码无效，则还将对此提醒用户。如果用户名和密码是匹配的，则用户提供商将如上所述登录用户，并将用户重新定位到主页作为登录用户。状态中的日志将保存在存储中，以便除非用户注销，否则将在以下应用程序启动中登录用户。
教程
一组幻灯片解释了GroupD，并简要说明了如何使用它。
家
主页由单独卡中显示的所有项目的列表组成，每个项目卡都有项目名称，项目缩略图说明，创建的时间和可用位置的数量。每张卡也有两个按钮；一个是要添加或删除该项目访问或从用户的收藏夹/书签中添加或从项目页面中查看项目。
项目页面
项目页面将项目ID作为一个参数，从那里获取项目的数据和创建者的数据。此页面由两张卡组成，即项目卡和创建者卡。如果该项目的创建者删除了他们的帐户或未发现创建者卡。
创建者卡由由创作者的性别（男性或女性 - 默认为女性），创建者名称和按钮确定的占位符图标组成。如果查看器是创建者，则按钮将将查看器带到编辑项目页面。如果观看者不是创建者，则按钮将将用户带到创建者的个人资料。
项目卡由项目名称，项目缩略图说明，项目描述，最大位置，可用位置，标签和会员组成。如果单击项目成员，则GroupD将检查此成员是否仍然存在（该成员可能已删除其配置文件，然后另一个新用户可能已经以其名字命名）。如果成员确实存在，则将查看者移至会员的个人资料。该项目卡还在卡的页脚上有两个按钮。注释按钮显示并隐藏了评论部分，以及添加或从查看者项目中添加或删除项目的喜爱按钮。
评论部分由项目注释的列表组成，并带有一个输入框来添加下面的评论。
编辑项目
编辑项目页面只是一个表单，其先前输入/保存的数据已加载到输入框中。编辑项目页面的表单与项目页面的表单非常相似，在“编辑项目”页面中的差异，创建者可以添加成员。创建者只能添加存在数据库中的成员。为创建者提供了两个选项，保存更改或删除。单击时，都会收到两个选项。在保存更改上，更新了任何成员更改的用户文档，并且还更新了项目文档。在DELETE上，创建者中项目的任何实例和成员都将被删除，并将项目永久删除。
新项目
与“编辑项目”页面类似，新项目页面是带有实时载荷的表单。它有一个按钮添加新项目。
搜索
搜索是一个选项卡页面，标签为：搜索项目和搜索用户。
搜索项目使用自定义管道实时搜索项目名称或标签。这是寻找可以从事项目的用户的理想选择。项目列表的布局与主页相同。
搜索用户使用自定义管道实时搜索用户或技能。这是寻找用户从事其项目的用户的理想选择。显示的每个用户都显示在卡中，其中包含以下详细信息：性别图标，职业，电子邮件和标签。该卡还有一个按钮可以转到所选用户的页面。
轮廓
配置文件页面将用户名作为参数输入，然后获取用户文档并检查它是否是查看器的配置文件。该配置文件显示用户的用户名，位置，职业，电子邮件，评级和技能。如果是查看者配置文件，则显示查看器的编辑按钮，它将迁移到“编辑帐户”页面（如下所述）和一个节目评估者按钮，其中将弹出一个模式，并带有所有评分者及其费率的列表。观看者还可以单击评估者的用户名以搬迁到其配置文件中。如果不是观看者的配置文件，则将向查看器显示一个速率按钮。如果单击“速率”按钮，则将弹出一个警报，其中包含输入框以输入评分。如果观看者以前对此人进行了评分，则将覆盖他们的最后汇率。用户的项目，无论是成员还是创建者，也以与主页中的项目相同的格式显示。
最爱
最喜欢的页面将显示所有保存在用户收藏夹中的项目。项目列表的布局与主页相同。
编辑帐户
编辑帐户页面只是一个表单，其先前输入/保存的数据已加载到输入框中。给查看器提供了两个选项，保存更改或删除。单击时，都会收到两个选项。在保存更改上，用户文档已更新。在DELETE上，用户的评分将从任何其他用户的评分中删除（如果未删除评级，则如果其他用户在可用的情况下获取相同的用户名，则评级可能会成为问题），并且从数据库中删除了用户文档。
注销
登录页面具有一个按钮，该按钮调用用户数据提供商来敲击注销事件以更改菜单，清除本地存储并将其迁移到页面上的登录。
离子
离子框架可用于使用HTML，CSS和JavaScript（Angular）创建跨平台移动应用程序或Web应用程序。
离子1与离子2
离子1使用角1，HTML和CSS，而离子2使用角2，HTML和SCSS。
为什么要离子2？
由于Ervin已经开始使用Angular 1，因此使用离子1来构建我的移动应用程序可能更为明智，因为他已经完成了大部分工作。但是，我选择了Ionic 2，因为我宁愿我的作品完全尊严自己，而主要原因是Ionic 2提供了许多改进。乔什·莫尼（Josh Morony）在这里有效地描述了这些改进。我认为，Ionic 2是Ionic的新版本，将继续改善，并将成为Ionic团队的重点。在Angular 2的情况下，AngularJS团队也可以这样说。我也很渴望使用打字稿体验。
请按照GroupD-Backend的步骤进行操作：如何运行。
如果您没有安装离子2，请按照Ionic网站上的安装步骤操作。
克隆此存储库并运行命令：
npm install
一旦设置并运行所有其他内容。确保当前目录是：groupD-mobile-application（存储库的子目录）。然后运行以下命令：
ionic lab
总而言之，这个项目是一种有意义的经历。在小组中工作，并首次使用离子2是对此的重要贡献者。如果我要重新进行项目，我将从一开始就开始这个项目想法，而不是在其他项目想法尝试之后开始。我还将引用一个单独的评论文档，而不是将评论嵌入项目文档中，因为评论是与项目相关的数据，但是评论会随着项目数据的其余部分而有所不同。评论也可以很快增长到可能的无限量，并且不应以可能的规模来负担项目文件。最后，我将考虑在唯一用户名代替独特的ID，并且我肯定会添加类似于“休眠”的属性：true/false。该属性将用于实际删除用户文档的位置，将解决引用的用户名（或ID如果会更改的ID）的问题与旧用户混淆，并且有助于为旧用户提供恢复选项。
参考：
离子框架
http://stackoverflow.com/questions/13935733/mongoose-limit-offset-and-count-query
https://www.w3schools.com/jsref/jsref_indexof.asp
https://ionicframework.com/docs/storage/
http://ionicframework.com/docs/ionicons/
https://www.joshmorony.com/custom-pipes-in-ionic-2/
https://www.npmjs.com/package/ng2-search-filter
https://www.youtube.com/watch?v=-zw1zhqsdyc
https://www.youtube.com/watch?v=8gz-kbbddxm
http://stackoverflow.com/questions/32069388/repeatsy-background-task-ionic-framework
https://github.com/yannbf/ionic2-components
http://stackoverflow.com/questions/17616624/detect-if-string-contains-any空间
https://www.joshmorony.com/advanced-forms-validation-in-ionic-2/
http://stackoverflow.com/questions/35039610/angular2-manaly-set-value-for-formbuilder-control
https://ionicframework.com/docs/v2/cli/generate/
https://www.youtube.com/watch?v=-ynj-qrhvgc
https://ionicframework.com/docs/v2/resources/forms/
https://www.youtube.com/watch?v=-O_VGPJP-Q0
http://blog.ionic.io/10-minutes-with-ionic-2-adding-pages-and-navigation/
https://www.joshmorony.com/a-simple-guide-to-navigation-in-ionic-2/
http://reactivex.io/documentation/observable.html
https://www.youtube.com/watch?v=ei7fsoxkpl0
https://egghead.io/lessons/javascript-indroducing-the-observable
https://www.youtube.com/watch?v=_frphse2pzk
http://stackoverflow.com/questions/36655379/ionic-2-templates
https://github.com/driftyco/ionic2-starter-sidemenu
https://ionicframework.com/docs/v2/api/components/menu/menu/
https://blog.khophi.co/ionic-2-side-menu-tabs/
https://developer.mozilla.org/en/docs/web/javascript/reference/global_objects/string/trim
http://pointDeveloper.com/how-to-place-ionic-2-tabs-at-the-bottom-or-top-the-creen/
http://www.neilberry.com/how-to-run-your-ionic-ionic-app-on-real-devices/
Tara O'Kelly [email protected]
