{"id":15503230,"url":"https://github.com/johno/fc","last_synced_at":"2025-04-22T23:21:58.798Z","repository":{"id":151933051,"uuid":"66524938","full_name":"johno/fc","owner":"johno","description":"[WIP] A pleasurable snow tracking experience","archived":false,"fork":false,"pushed_at":"2016-10-04T20:46:04.000Z","size":256,"stargazers_count":8,"open_issues_count":3,"forks_count":0,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-29T19:51:10.735Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://fc.now.sh/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/johno.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-08-25T04:34:01.000Z","updated_at":"2016-10-07T21:50:50.000Z","dependencies_parsed_at":"2023-05-09T16:50:48.204Z","dependency_job_id":null,"html_url":"https://github.com/johno/fc","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johno%2Ffc","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johno%2Ffc/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johno%2Ffc/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/johno%2Ffc/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/johno","download_url":"https://codeload.github.com/johno/fc/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250338504,"owners_count":21414199,"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-10-02T09:12:33.534Z","updated_at":"2025-04-22T23:21:58.792Z","avatar_url":"https://github.com/johno.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# ≙ fc\n\n__Work in progress__\n\nFirst Chair is a quick and nimble snow tracking app for resorts and snotel sites.\nThis app is being built as an ongoing experiment with creating a performant and submersive app experience within a browser.\nIt is intended to use modern technology while still falling back gracefully for older browsers and others without js runtimes.\n\nDeveloping for the browser is a unique experience. We're not afforded the convenience of a single \"install\" like native apps are.\nAs a result, I've focused on keeping the initial download of this app to 5KB (gzipped).\nHypothetically, this ensures that the primary payload for this app fits within a single packet.\nIn practice, this requires progressively enhancing the page after load and inlining critical path css.\n\nFast. Minimal. Tiny. Accessible.\n\n#### a-k-apart\n\nThis proof of concept was submitted to [10k Apart](https://a-k-apart.com/).\nThough, the server code was slightly modified since their node build doesn't support `async`/`await` (see #23).\nThere's a branch that uses `http` directly rather than `micro` and is called [no-async](https://github.com/johnotander/fc/tree/no-async).\n\n#### Installation and usage\n\n###### Install dependencies\n\n```\nnpm i\n```\n\n###### Run production\n\n```\nnpm start\n```\n\n###### Run the dev server\n\n```\nnpm run serve:dev\n```\n\n###### Run uncss\n\nWhen you have the development server running, run the following command in another tab:\n\n```\nnpm i -g uncss\n./scripts/css.sh\n```\n\n#### Todo\n\n- [ ] a11y linting\n- [ ] aria attributes\n- [X] resort index page with state filtering\n- [X] design resort page\n- [ ] graph snowfall\n- [ ] resort search feature\n- [ ] resort favoriting\n- [X] lazy load js\n- [X] lazy load images\n- [X] uncss\n- [ ] transition between pages\n\n#### Key features to its minimal nature\n\n- choo (shoutout to yoshua and contributors)\n- yo-yo\n- tachyons\n- micro\n- uncss\n- html entity logo\n- server side rendering\n- rehydration (shoutout to [dat.land](https://github.com/datproject/dat.land/blob/master/client/js/models/app-rehydrator.js))\n- svgs\n- lazily loaded, async js (but not required)\n- async images (if js is supported)\n\n#### Optional, progressive assets and enhancements\n\nEverything that is needed for a great user experience is server rendered.\nThis allows a user to even use this application without javascript enabled.\nWhen clicking links, they're simply forwarded to the next server rendered page.\nAll the things are minified and gzipped, too.\n\n##### If javascript _is_ enabled, we turn it up a notch\n\nFirstly, a tiny javascript is executed to grab the single page application js that was used to render the app on the server.\nThat js is then appended to the dom and executed.\nThis takes over navigation, only updating parts of the dom that have changed and fetching api requests in the background.\nAdditionally, the js begins to lazy load images and pop them into place.\nThese images are only shown lazily and if js is available.\nThey greatly improve the ux of First Chair, but are heavy and unneeded for a satisfactory experience.\n\n#### Server\n\nCurrently the server handles rendering and returning html/json responses.\nThe data returned by the api is currently static as this is a poc for a-k-apart.\nIt will be tied into live data in the future.\n\nIt can be found at server.js.\n\n#### Client\n\nThe client is a choo/tachyons single page app with SSR.\nIt features mostly vanilla JS built by browserify.\nThe payload is ~20kB, so it is asynchronously loaded after render.o\n\nIt can be found at client.js.\n\n***\n\n\u003e Built with all the hearts by @4lpine\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjohno%2Ffc","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fjohno%2Ffc","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fjohno%2Ffc/lists"}