{"id":18374787,"url":"https://github.com/asasmith/whitebox-challenge-client-react","last_synced_at":"2026-04-19T19:32:26.490Z","repository":{"id":86699284,"uuid":"186088774","full_name":"asasmith/whitebox-challenge-client-react","owner":"asasmith","description":"Simple react front end for for the whitebox challenge","archived":false,"fork":false,"pushed_at":"2020-06-11T21:23:37.000Z","size":5381,"stargazers_count":1,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-11T03:58:44.069Z","etag":null,"topics":["es6","javascript","react","webpack"],"latest_commit_sha":null,"homepage":"https://whitebox-react-client.netlify.com/products","language":"CSS","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/asasmith.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,"zenodo":null}},"created_at":"2019-05-11T04:46:44.000Z","updated_at":"2023-03-09T01:54:20.000Z","dependencies_parsed_at":null,"dependency_job_id":"41e65f5e-8afc-4b51-8575-f4ef5899065d","html_url":"https://github.com/asasmith/whitebox-challenge-client-react","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/asasmith/whitebox-challenge-client-react","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/asasmith%2Fwhitebox-challenge-client-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/asasmith%2Fwhitebox-challenge-client-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/asasmith%2Fwhitebox-challenge-client-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/asasmith%2Fwhitebox-challenge-client-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/asasmith","download_url":"https://codeload.github.com/asasmith/whitebox-challenge-client-react/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/asasmith%2Fwhitebox-challenge-client-react/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32020517,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-18T20:23:30.271Z","status":"online","status_checked_at":"2026-04-19T02:00:07.110Z","response_time":55,"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":["es6","javascript","react","webpack"],"created_at":"2024-11-06T00:16:01.382Z","updated_at":"2026-04-19T19:32:26.484Z","avatar_url":"https://github.com/asasmith.png","language":"CSS","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Whitebox Challenge React Client\n[![Netlify Status](https://api.netlify.com/api/v1/badges/570c35dc-0ba8-47b7-9465-c0979a1f1dab/deploy-status)](https://app.netlify.com/sites/whitebox-react-client/deploys)\n\n## Instructions for client portion of challenge\n1. Create a SPA which wires up the static HTML given in the repo (You can use (or not) any framework you're comfortable with).\n2. Wire up includes any search, sort or filters you see\n3. The SPA should have 2 pages, a list all products, and an individual product page. Both HTML templates are provided.\n\nAll of the static html and css files were provided in this [repo](https://github.com/whitebox-co/code-challenge). I've focused on client/server javascript interaction and functionality so I have not updated any html structure unless it was necessary to convert it to a react component. I'm planning to refactor some of this html but that will require changing css as well. I've separated the client and server into individual repos so that I could use the same server to practice different client side frameworks in the future. The code for the server is in this [repo](https://github.com/asasmith/whitebox-challenge-server)\n\nI avoided using [create-react-app](https://github.com/facebook/create-react-app) for this project opting instead to use and learn more about webpack.\n\n### Install\n```\nnpm install\n```\n\n### Run dev enviroment (requires running [server](https://github.com/asasmith/whitebox-challenge-server) locally)\n```\nnpm run start\n```\n[http://localhost:8080/products](http://localhost:8080/products)\n\n### Todos\n- [X] project brief\n- [ ] add tests\n- [ ] fix css dependencies\n- [ ] check eslint a11y errors\n- [ ] add loading indicator\n- [ ] refactor webpack config","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fasasmith%2Fwhitebox-challenge-client-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fasasmith%2Fwhitebox-challenge-client-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fasasmith%2Fwhitebox-challenge-client-react/lists"}