mithril hackernews pwa

PWA - Micro Mithril 黑客新闻克隆

HackerNews 克隆使用 Micro、Mithril v1.1.1 和 Pure Material 构建。

这是一个最小且直接的开发。没有花哨的东西。它还有很多可以改进的地方。

Mithril 是一个小而强大的框架，可用于大型项目，但是，Pure Material 仍处于 alpha 状态，我不建议将其用于生产。

现场演示

清单

渐进式网页应用

• 网站现在通过 HTTPS 提供服务
• 使用 Pure Material 的页面可在平板电脑和移动设备上响应
• 为 PWA 提供元数据，例如主题颜色
• 无脚本环境的内容
• 使用 Web Manifest 添加到主屏幕
• 使用 Favicons 即时构建图标

国家水务管理局

• 浏览次数：黑客新闻热门故事、新内容、显示、询问、工作和线程评论
• 应用必须每页显示 30 个项目才能查看故事列表
• 应用程序必须是渐进式 Web 应用程序
• 使用 Lighthouse 时应用程序的得分必须超过 90/100
• 应用程序必须目标是在 3G 网络上的 Moto G4 上 5 秒内实现交互
• 应用程序必须使用应用程序外壳模式
• 应用程序必须尽力跨浏览器工作
• App支持HN数据离线缓存
• 应用程序可以使用服务器端渲染。
• 将 Hackernews 官方 firebase API 与 firebase-hackernews 一起使用

HNPWA 详细信息

• 框架/UI 库：Micro + Mithril + Pure Material
• 模块捆绑：Webpack
• Service Worker：应用程序外壳
• 服务端渲染：无
• API：黑客新闻 Firebase API
• 主办：现在
• 其他细节：任务运行器 Gulp。 CSS 预处理器手写笔。

入门

 # install dependencies
yarn install

# serve at localhost:8000 with browserSync
yarn dev

# build for production with minification
yarn build

合法的

作者：化装舞会马戏团。许可证 Apache-2.0