{"id":17005242,"url":"https://github.com/adamj/rhd-frontend-react","last_synced_at":"2026-04-04T22:32:13.827Z","repository":{"id":76865354,"uuid":"221045378","full_name":"AdamJ/rhd-frontend-react","owner":"AdamJ","description":"A React version of the rhd-frontend repo using PatternFly-React (v4)","archived":false,"fork":false,"pushed_at":"2024-08-31T12:31:34.000Z","size":1095,"stargazers_count":0,"open_issues_count":1,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2026-01-03T17:24:06.311Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/AdamJ.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","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":"2019-11-11T18:35:18.000Z","updated_at":"2019-11-12T22:20:43.000Z","dependencies_parsed_at":null,"dependency_job_id":"f0a2fbf1-7f19-4a87-81af-038b58e9ead4","html_url":"https://github.com/AdamJ/rhd-frontend-react","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"purl":"pkg:github/AdamJ/rhd-frontend-react","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AdamJ%2Frhd-frontend-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AdamJ%2Frhd-frontend-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AdamJ%2Frhd-frontend-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AdamJ%2Frhd-frontend-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/AdamJ","download_url":"https://codeload.github.com/AdamJ/rhd-frontend-react/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/AdamJ%2Frhd-frontend-react/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31416770,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-04T20:09:54.854Z","status":"ssl_error","status_checked_at":"2026-04-04T20:09:44.350Z","response_time":60,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"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-10-14T04:45:44.407Z","updated_at":"2026-04-04T22:32:13.800Z","avatar_url":"https://github.com/AdamJ.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# RHD Frontend w/React\nThis is a demo repo of the RHD Frontend running on React. For demonstration purposes only.\n\nBased off of the [PatternFly Seed](https://github.com/patternfly/patternfly-react-seed) repository.\n\n----\n\n## Patternfly Seed\n\nPatternfly Seed is an open source build scaffolding utility for web apps. The primary purpose of this project is to give developers a jump start when creating new projects that will use patternfly. A secondary purpose of this project is to serve as a reference for how to configure various aspects of an application that uses patternfly, webpack, react, typescript, etc.\n\nOut of the box you'll get an app layout with chrome (header/sidebar), routing, build pipeline, test suite, and some code quality tools. Basically, all the essentials.\n\n\u003cimg width=\"1058\" alt=\"Out of box dashboard view of patternfly seed\" src=\"https://user-images.githubusercontent.com/5942899/62715686-fa954980-b9ce-11e9-9fc2-217b7a4d1d81.png\"\u003e\n\n### Quick-start\n```bash\nnpm install yarn -g # ensure you have yarn on your machine globally\ngit clone https://github.com/patternfly/patternfly-react-seed # clone the project\ncd patternfly-react-seed # navigate into the project directory\nyarn # install patternfly-react-seed dependencies\nyarn build # build the project\nyarn start # start the development server\n```\n### Development Scripts\n\nInstall development/build dependencies\n`yarn`\n\nStart the development server\n`yarn start`\n\nRun a production build\n`yarn build`\n\nRun the test suite\n`yarn test`\n\nRun the linter\n`yarn lint`\n\nRun the code formatter\n`yarn format`\n\nLaunch a tool to inspect the bundle size\n`yarn bundle-profile:analyze`\n\n### Configurations\n* [TypeScript Config](./tsconfig.json)\n* [Webpack Config](./webpack.common.js)\n* [Jest Config](./jest.config.js)\n* [Editor Config](./.editorconfig)\n\n### Raster Image Support\n\nTo use an image asset that's shipped with patternfly core, you'll prefix the paths with \"@assets\". `@assets` is an alias for the patternfly assets directory in node_modules.\n\nFor example:\n```js\nimport imgSrc from '@assets/images/g_sizing.png';\n\u003cimg src={imgSrc} alt=\"Some image\" /\u003e\n```\n\nYou can use a similar technique to import assets from your local app, just prefix the paths with \"@app\". `@app` is an alias for the main src/app directory.\n\n```js\nimport loader from '@app/assets/images/loader.gif';\n\u003cimg src={loader} alt=\"Content loading /\u003e\n```\n\n### Vector Image Support\nInlining SVG in the app's markup is also possible.\n\n```js\nimport logo from '@app/assets/images/logo.svg';\n\u003cspan dangerouslySetInnerHTML={{__html: logo}} /\u003e\n```\n\nYou can also use SVG when applying background images with CSS. To do this, your SVG's must live under a `bgimages` directory (this directory name is configurable in [webpack.common.js](./webpack.common.js#L5)). This is necessary because you may need to use SVG's in several other context (inline images, fonts, icons, etc.) and so we need to be able to differentiate between these usages so the appropriate loader is invoked.\n```css\nbody {\n  background: url(./assets/bgimages/img_avatar.svg);\n}\n```\n\n### Code Quality Tools\n* For accessibility compliance, we use [react-axe](https://github.com/dequelabs/react-axe)\n* To keep our bundle size in check, we use [webpack-bundle-analyzer](https://github.com/webpack-contrib/webpack-bundle-analyzer)\n* To keep our code formatting in check, we use [prettier](https://github.com/prettier/prettier)\n* To keep our code logic and test coverage in check, we use [jest](https://github.com/facebook/jest)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fadamj%2Frhd-frontend-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fadamj%2Frhd-frontend-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fadamj%2Frhd-frontend-react/lists"}