{"id":19545847,"url":"https://github.com/alex-ray/kit_gif","last_synced_at":"2026-06-04T23:31:26.951Z","repository":{"id":68552042,"uuid":"85143932","full_name":"Alex-ray/KIT_GIF","owner":"Alex-ray","description":null,"archived":false,"fork":false,"pushed_at":"2017-03-28T18:49:12.000Z","size":51,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-02-26T05:44:03.603Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"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/Alex-ray.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","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":"2017-03-16T02:35:22.000Z","updated_at":"2023-03-08T04:19:41.000Z","dependencies_parsed_at":null,"dependency_job_id":"ec2f58e9-c61c-45e5-baca-e006c5057a99","html_url":"https://github.com/Alex-ray/KIT_GIF","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Alex-ray/KIT_GIF","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Alex-ray%2FKIT_GIF","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Alex-ray%2FKIT_GIF/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Alex-ray%2FKIT_GIF/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Alex-ray%2FKIT_GIF/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Alex-ray","download_url":"https://codeload.github.com/Alex-ray/KIT_GIF/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Alex-ray%2FKIT_GIF/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33924832,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-04T02:00:06.755Z","response_time":64,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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-11T03:41:38.574Z","updated_at":"2026-06-04T23:31:26.935Z","avatar_url":"https://github.com/Alex-ray.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# GIFFITI 🎉\n\n## Architecture\n\nThe GIF application is being served from a Node.js server using the express\nframework. The Node.js server is setup to server assets using Hot Module Reloading for development\nand Server Side Rendering for production.\n\nThe Application also utilizes [code splitting](https://webpack.js.org/guides/code-splitting/)\nwhich is defined at each route. This helps separate out common code bundles that wont change\noften and can be cached on the client as well as making sure to only bundle code that the user\nneeds for that route. Webpack auto-magically optimizes for the best balance between\nnetwork requests and request load.\n\nThe App has three main folder sections\n- `client`: JS code that is only run on the client\n- `server`: JS code that is only run on the server\n- `universal`: JS code that is run on both the client _and_ the server.\n\nThe UI is built using the following technologies.\n\n- Webpack 2\n- React\n- React Router\n- Redux\n- Immutable\n- cssnext\n\n\n## Installation\nMake sure you are running on\n- Node v7 or higher, I recommend using [NVM](https://github.com/creationix/nvm)\n- NPM v4 or higher\n- Webpack v2 or higher\n\nNext run `npm install` in the root directory of this project.\n\n## Development\nTo run the developement environment run `npm run dev` and navigate to `http://localhost:3000`.\n\n## Production\nTo build for production run `npm run build`.\n\nTo start production run `npm run prod` and navigate to `http://localhost:3000`.\n\nTo deploy all one needs to do is replace the `webpack.config.prod.js` files `output.publicPath` configuration to the CDN host\nand upload all the build files to that CDN and run the application on a node server.\n\n## TODO:\n\nShuffle Animations and loading states. (I was going to user React)\n\nGif Image Loading States - Ideally we want to show a loading state for the preview\nimage of gif when it is being downloaded to the clients browser cache. This becomes\napparent when shuffling new GIFS that have not been downloaded to the client.\n\nRoute Animations.\n\nBetter breadcrumb design, not very intuitive, general navigation re-think.\n\nRethink Color Palette.\n\nScroll to the top when each route is loaded.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falex-ray%2Fkit_gif","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Falex-ray%2Fkit_gif","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Falex-ray%2Fkit_gif/lists"}