{"id":26255109,"url":"https://github.com/patlux/react-workshop-cegeka","last_synced_at":"2026-05-01T20:31:14.069Z","repository":{"id":79837021,"uuid":"191933485","full_name":"patlux/react-workshop-cegeka","owner":"patlux","description":"React Basics Workshop for Cegeka","archived":false,"fork":false,"pushed_at":"2022-01-26T10:10:01.000Z","size":1556,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"master","last_synced_at":"2026-02-28T19:27:37.538Z","etag":null,"topics":["babel","basics","javascript","react","workshop"],"latest_commit_sha":null,"homepage":"https://react-cegeka-workshop.patwoz.dev/","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/patlux.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,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2019-06-14T11:41:09.000Z","updated_at":"2022-01-26T10:12:35.000Z","dependencies_parsed_at":"2023-09-15T05:48:01.294Z","dependency_job_id":null,"html_url":"https://github.com/patlux/react-workshop-cegeka","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/patlux/react-workshop-cegeka","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patlux%2Freact-workshop-cegeka","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patlux%2Freact-workshop-cegeka/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patlux%2Freact-workshop-cegeka/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patlux%2Freact-workshop-cegeka/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/patlux","download_url":"https://codeload.github.com/patlux/react-workshop-cegeka/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/patlux%2Freact-workshop-cegeka/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32512662,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-30T13:12:12.517Z","status":"online","status_checked_at":"2026-05-01T02:00:05.856Z","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":["babel","basics","javascript","react","workshop"],"created_at":"2025-03-13T19:17:31.913Z","updated_at":"2026-05-01T20:31:14.054Z","avatar_url":"https://github.com/patlux.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React Basics Cegeka Workshop ![Node CI](https://github.com/patlux/react-workshop-cegeka/workflows/Node%20CI/badge.svg)\n\n[Live Demo](https://react-demo-api.herokuapp.com/)\n\n## Willkommen\n\nIn diesem Workshop werden wir folgendes zusammen lernen:\n\n- Projekt aufsetzen mit [create-react-app](https://github.com/facebook/create-react-app)\n- Grundlegende [React](https://reactjs.org/)-Kenntnisse:\n- - Components\n- - JSX\n- - Props\n- - State \u0026 Hooks\n- - Event-Handling\n- - Hooks\n- Anbindung einer REST-Schnittstelle\n- Testing\n\n## System Requirements\n\n- [git](https://git-scm.com/)\n- [Nodejs-Laufzeitumgebung](https://nodejs.org/)\n\nDie o.g. Abhängigkeiten müssen alle in der `PATH` Variable eures Systems vorhanden sein.\nUm zu überprüfen, ob dass der Fall ist, führe folgende Befehle auf deiner Konsole aus:\n\n```bash\ngit --version\nnode --version\nnpm --version\n```\n\nWenn du Probleme damit hast, dann schau dir am besten an, wie neue Einträge zur `PATH` hinzugefügt werden können für [Windows](https://www.howtogeek.com/118594/how-to-edit-your-system-path-for-easy-command-line-access/) oder [MacOS/Linux](http://stackoverflow.com/a/24322978/971592).\n\n## Project\n\n#### Abhängigkeiten installieren:\n\n```bash\nnpm install\n```\n\n#### Entwicklungsmodus starten:\n\n```bash\nnpm run dev\n```\n\n\u003e Falls sich der Browser nicht automatisch öffnet, kannst du die Adresse http://localhost:3000 manuell aufrufen\n\n#### Anwendung kompilieren:\n\n```bash\nnpm run build\n```\n\n#### Server für die kompilierte Anwendung starten:\n\n\u003e Die Anwendung muss vorher mittels `npm run build` kompiliert werden\n\n```bash\nnpm start\n```\n\n## Environment variables\n\nSiehe [hier](https://create-react-app.dev/docs/adding-custom-environment-variables).\n\n##### REACT_APP_API_URL\n\nDie Anwendung akzeptiert (optional) die Umgebungsvariable `REACT_APP_API_URL`. Diese definiert, an welchen Endpunkt die REST-Schnittstelle aufgerufen wird.\n\n```bash\nREACT_APP_API_URL=http://localhost:8080 npm run dev\n```\n\n\u003e Ohne Angabe von `REACT_APP_API_URL` laufen die API-Anfragen über den gleichen Host wie die Frontend-Anwendung. =\u003e `http://localhost:3000/api`\n\n## Troubleshooting\n\n#### CORS\n\n```\nAccess to fetch at 'http://localhost:8080/api/time/timezones' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.\n```\n\nWenn die Umgebungsvariable `REACT_APP_API_URL` angegeben wurde, muss die REST-Schnittstelle die `CORS`-Header setzen, um Anfragen anderer Domains zu akzeptieren.\n\n#### API-Anfragen weiterleiten (Proxy)\n\nOhne Angabe von `REACT_APP_API_URL` laufen die API-Anfragen über den gleichen Host wie die Frontend-Anwendung. =\u003e `http://localhost:3000/api`.\n\nUm alle Anfragen die an `/api` gehen, an einen anderen Endpunkt weiterzuleiten, kann ein Eintrag in die `package.json` hinzugefügt werden. Hierzu einfach wie folgt vorgehen:\n\n```diff\n+  \"proxy\": \"https://api.example.com\",\n```\n\nMit dem o.g. Eintrag werden alle Anfragen an `/api` nach `https://api.example.com` weitergeleitet.\n\nSiehe [hier](https://create-react-app.dev/docs/proxying-api-requests-in-development).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpatlux%2Freact-workshop-cegeka","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpatlux%2Freact-workshop-cegeka","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpatlux%2Freact-workshop-cegeka/lists"}