{"id":22009699,"url":"https://github.com/zitadel/zitadel-react","last_synced_at":"2025-05-06T18:15:37.928Z","repository":{"id":218926095,"uuid":"747718335","full_name":"zitadel/zitadel-react","owner":"zitadel","description":"Authenticate your ZITADEL users within your react applications","archived":false,"fork":false,"pushed_at":"2024-04-29T21:42:31.000Z","size":812,"stargazers_count":3,"open_issues_count":3,"forks_count":4,"subscribers_count":2,"default_branch":"main","last_synced_at":"2024-04-30T13:54:28.805Z","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":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/zitadel.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":"2024-01-24T14:02:09.000Z","updated_at":"2024-08-02T14:17:59.428Z","dependencies_parsed_at":"2024-08-02T14:28:14.870Z","dependency_job_id":null,"html_url":"https://github.com/zitadel/zitadel-react","commit_stats":null,"previous_names":["zitadel/zitadel-react"],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zitadel%2Fzitadel-react","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zitadel%2Fzitadel-react/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zitadel%2Fzitadel-react/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zitadel%2Fzitadel-react/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zitadel","download_url":"https://codeload.github.com/zitadel/zitadel-react/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252741475,"owners_count":21797027,"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-30T02:10:29.417Z","updated_at":"2025-05-06T18:15:37.919Z","avatar_url":"https://github.com/zitadel.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# @zitadel/react Example\n\nAuthenticate your [ZITADEL](https://zitadel.com) users within your React applications.\n\n\u003e [!IMPORTANT]\n\u003e If you want to try out [@zitadel/react](https://www.npmjs.com/package/@zitadel/react), read the [ZITADEL step-by-step guide for React](https://zitadel.com/docs/examples/login/react).\n\u003e It shows how to get the _authority_ and _client_id_ from ZITADEL and how to wire everything up in React.\n\n## Project Structure\n\nThis project is a default React application created with [Create React App](https://create-react-app.dev/) that contains the ZITADEL React SDK to handle OIDC. The library is located in `/lib` folder and published as `@zitadel/react`.\n\n![NPM Version](https://img.shields.io/npm/v/@zitadel/react)\n![NPM License](https://img.shields.io/npm/l/@zitadel/react)\n[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](https://makeapullrequest.com)\n\nThe following pages are added to the scaffolded example application:\n\n- _src/components/Login.tsx_: The login page shows a button if no user is authenticated and redirects the user to /callback if authenticated.\n- _src/components/Callback.tsx_: This page completes the auth flow and renders the retrieved information from the user info endpoint.\n\n## Run\n\nTo run the example, navigate to the `/lib` folder and run `yarn build`.\n\n```bash\ncd ./lib\nyarn install\nyarn build\n```\n\nthen navigate back and install the dependencies of the example application\n\n```bash\ncd ..\nyarn install\n```\n\nNext follow the guide for React applications in our [docs](https://zitadel.com/docs/examples/login/react)\nand set `authority` as well as `client_id` in the `App.tsx` file.\nFinally you can start the application with\n\n```bash\nyarn start\n```\n\nYour application will then run on `http://localhost:3000`.\n\n## Available scripts\n\n### `yarn start`\n\nRuns the app in the development mode.\\\nOpen [http://localhost:3000](http://localhost:3000) to view it in the browser.\n\nThe page will reload if you make edits.\\\nYou will also see any lint errors in the console.\n\n### `yarn build`\n\nBuilds the app for production to the `build` folder.\\\nIt correctly bundles React in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.\\\nYour app is ready to be deployed!\n\nSee the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.\n\n## Learn More\n\nYou can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).\n\nTo learn React, check out the [React documentation](https://reactjs.org/).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzitadel%2Fzitadel-react","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzitadel%2Fzitadel-react","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzitadel%2Fzitadel-react/lists"}