Comics_app
展示漫画的应用
该应用向 ComicVine 漫画 api 发送一对请求 https://comicvine.gamespot.com/api/
此应用仅使用 Flutter Web(SDK 版本:3.0.1)
应用架构
该应用遵循 CLEAN 架构。我在设计项目时不仅考虑了当前功能,还考虑了未来应用扩展需要更多功能的可能性。
但是,它缺少一些我所知的最佳实践
- 将字符串文字放在一个文件中以供未来语言使用
- 设置自定义主题
- 完全缺乏单元测试
对应用架构的简要解释
-
数据:应用中所有数据源的层,在这种情况下,我们只有一个模块,即漫画数据源
-
领域:所有业务逻辑的层,在这种情况下,我们只有一个模块,即获取漫画的业务逻辑
-
表现:这里只有数据的表现及其状态,在这种情况下,我们有:漫画(漫画列表,基本上是主菜单)和 comics_list(显示所选漫画的详细信息)
重要提示:测试前
( 请务必也这样做,以使应用正常运行)。
A) 我在从 api 获取数据时遇到了 CORS 问题,所以我遇到的解决方法是这样做
- Go to your flutter\bin\cache and remove a file named: flutter_tools.stamp
- Go to flutter\packages\flutter_tools\lib\src\web and open the file chrome.dart
- Find '--disable-extensions'
- Add '--disable-web-security'
然后,应用程序应该正常进行请求。
B) 为了展示一些最佳实践,我将 api URL 放在一个 .env 文件中,所以请在 assets/ 中创建一个 .env 文件,并按此格式放置基本 URL
API_URL = https://comicvine.gamespot.com/api
然后,在运行项目时添加一个额外的运行参数,或在 Android Studio 中将其配置为额外的运行参数
--dart-define=API_KEY=your_api_key
C) 该应用使用 Injectable 包来展示 DI 知识,所以请在启动应用前运行以下命令
flutter packages pub run build_runner build