{"id":20000662,"url":"https://github.com/devopsmariocom/elm-hn-pwa","last_synced_at":"2025-05-04T15:32:32.033Z","repository":{"id":66824859,"uuid":"109396937","full_name":"devopsmariocom/elm-hn-pwa","owner":"devopsmariocom","description":"Hacker News as a PWA built with Elm","archived":false,"fork":false,"pushed_at":"2017-10-21T12:01:08.000Z","size":1544,"stargazers_count":1,"open_issues_count":0,"forks_count":5,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-26T23:08:03.471Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://hnpwa.skingrapher.com","language":"Elm","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/devopsmariocom.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null}},"created_at":"2017-11-03T13:10:07.000Z","updated_at":"2024-03-11T13:25:32.000Z","dependencies_parsed_at":null,"dependency_job_id":"cff59615-42ad-4609-a376-db63e1e6fb36","html_url":"https://github.com/devopsmariocom/elm-hn-pwa","commit_stats":null,"previous_names":["devopsmariocom/elm-hn-pwa"],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devopsmariocom%2Felm-hn-pwa","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devopsmariocom%2Felm-hn-pwa/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devopsmariocom%2Felm-hn-pwa/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/devopsmariocom%2Felm-hn-pwa/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/devopsmariocom","download_url":"https://codeload.github.com/devopsmariocom/elm-hn-pwa/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252356198,"owners_count":21734898,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-13T05:15:31.453Z","updated_at":"2025-05-04T15:32:31.313Z","avatar_url":"https://github.com/devopsmariocom.png","language":"Elm","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Elm Hacker News Progressive Web App\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"256\" height=\"256\" src=\"https://github.com/skrypte/elm-hn-pwa/raw/master/dist/ico/hn_256.png\"\u003e\n\u003c/p\u003e\n\nSample of [HNPWA](http://hnpwa.com) built with [Elm](http://elm-lang.org) version 0.18, using the official [Hacker-News API](https://github.com/HackerNews/API)\n\nAvailable on [hnpwa.skingrapher.com](https://hnpwa.skingrapher.com)\n\n## Progressive\n\n- **100** on [lighthouse](https://hnpwa.skingrapher.com/lighthouse.html)\n- **91** on [webpagetest](https://www.webpagetest.org/result/171012_1D_2e14b74f9e034fb5d5f2e88891be0791/) for a slow 3G connection\n- service worker partially generated by [workbox](https://workboxjs.org) for static files precache\n- offline caching of HN data\n- no server-side rendering actually\n \n## Reliable \n\n- interactive under 5 seconds on a Moto 4G over 3G (see webpagetest below)\n- first interactive (emerging markets): 4.8s\n- first interactive (faster 3G): 3.2s\n\n## Responsive\n\nCSS file:\n- built with [Sass](https://sass-guidelin.es/)\n- inspired from [Material Design Lite](https://getmdl.io/components/index.html)\n- less than 4kb\n- inlined in index.html for better performance\n- style supported by all devices (smartphones, tablets and larger screens)\n\n## Accessible\n\n- **100** on lighthouse (see link to report below)\n- valid accessibility according to WCAG 2.0 (level AAA) guidelines\n- contrast level AAA between background and text for all colors\n- new ARIA **feed** role with **aria-posinset** and **aria-setsize** attributes exists in [WAI-ARIA 1.1](https://www.w3.org/TR/wai-aria-1.1/#feed) \n- no error according to [a11y.css](https://ffoodd.github.io/a11y.css/)\n- no bitmap pictures\n- added **noopener** and **noreferrer** relations to links to prevent from target=\"_blank\" vulnerability abuse\n\n## Versions\n\n### 0.11\n\nstable release without pagination\n\n## TODO\n\n- testing background sync\n- lazy loading for very extensive comments\n\n## Build elm.js howto\n\n    elm make Hnpwa.elm --output elm.js \n\nthen the js file is minified and its code is incorporated as a part of the script in index.html\n\n## Resources\n \n- about PWA: read on [Google](https://developers.google.com/web/progressive-web-apps/) page for developers\n- check the [awesome PWA](https://github.com/hemanth/awesome-pwa) list \n- elm tutorials for SPA: [client elm](https://github.com/foxdonut/adventures-reactive-web-dev/tree/elm-010-todolist-feature/client-elm) by Fred Daoud, [elm spa example](https://github.com/rtfeldman/elm-spa-example) by Richard Feldman, [elmstagram](https://github.com/bkbooth/Elmstagram) by Ben Booth\n- about service workers API: read on [MDN](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API)\n\n## Credits\n \n- github icon from [Entypo](https://entypo.com)\n- original elm SVG logo [here](https://upload.wikimedia.org/wikipedia/commons/f/f3/Elm_logo.svg)\n- SVG loader by [Sam Herbert](http://samherbert.net/svg-loaders/)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevopsmariocom%2Felm-hn-pwa","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdevopsmariocom%2Felm-hn-pwa","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdevopsmariocom%2Felm-hn-pwa/lists"}