{"id":18895141,"url":"https://github.com/coffezilla/react-bhx-auth","last_synced_at":"2025-04-15T01:13:44.346Z","repository":{"id":236564220,"uuid":"402598903","full_name":"coffezilla/react-bhx-auth","owner":"coffezilla","description":"ReactJS auth using JWT and (Apache) PHP as Backend. The project was made using create-react-app and Typescript","archived":false,"fork":false,"pushed_at":"2021-10-18T23:37:31.000Z","size":665,"stargazers_count":6,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-04-15T01:13:39.458Z","etag":null,"topics":["apache-login","auth","create-react-app","form-auth","jwt-auth","login-form","php-jwt","react","react-authentication","typescript"],"latest_commit_sha":null,"homepage":"https://react-bhx-auth.netlify.app","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/coffezilla.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":"2021-09-03T00:26:28.000Z","updated_at":"2022-01-19T10:33:35.000Z","dependencies_parsed_at":"2024-04-27T20:38:25.478Z","dependency_job_id":null,"html_url":"https://github.com/coffezilla/react-bhx-auth","commit_stats":null,"previous_names":["coffezilla/react-bhx-auth"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coffezilla%2Freact-bhx-auth","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coffezilla%2Freact-bhx-auth/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coffezilla%2Freact-bhx-auth/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/coffezilla%2Freact-bhx-auth/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/coffezilla","download_url":"https://codeload.github.com/coffezilla/react-bhx-auth/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248986315,"owners_count":21194025,"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":["apache-login","auth","create-react-app","form-auth","jwt-auth","login-form","php-jwt","react","react-authentication","typescript"],"created_at":"2024-11-08T08:26:46.553Z","updated_at":"2025-04-15T01:13:44.331Z","avatar_url":"https://github.com/coffezilla.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# react-bhx-auth\n\nAuthentication is one of the most time-consuming things to do when you have to deal with web projects. This projects is a ReactJS authentication using [JWT (json web token)](https://jwt.io/) with REST calls to a server. \n\nThere's a backend folder inside the project with PHP pages (Apache server) for login.\n\nThe token is saved locally using [local storage](https://developer.mozilla.org/pt-BR/docs/Web/API/Window/localStorage).\n\n## Dependencies\n- Axios\n\n## Feat\n\n- ReactJS with create-react-app\n- Typescript\n- JWT - Token\n- PHP backend\n- REST\n- [Axios](https://www.npmjs.com/package/axios)\n\n## How to use\n\nIn order to use this project get the component's folder (components/Auth) and the helper's folder. In components, the component Auth has two main functions:\n\n- serverLoginUser: to send a post request to login\n- getAuth: get the current status of the user.\n\n## Login form\n\nIn the example inside this project you can test one form login but you can pretty much use the form validator you like.\n\n## Local storage\n\nWhen the user loggin successfully, the component save a json inside the local storage.\n\n```json\n{\n  \"auth\": {\n    \"token\": \"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJiaHhzaXRlcyIsImVtYWlsIjoiZm9vQG1haWwuY29tIn0.Sk0VtWo_UNSaW-TfGjvMGpiOwxx4cz9SEDkjx70MZvE\",\n    \"email\": \"foo@mail.com\",\n    \"timestamp\": \"2020-09-02 21:14:13\"\n  }\n}\n```\n\n## Backend\n\nEven though is not the main purpose, inside this project you will find a backend folder with PHP files.\n\nYou can put this folder inside your [localhost](http://localhost) and change the endpoint inside the components folder. The default value for this is pointing to some BHX Sites path with the same file but you can do this locally or even try use NodeJS instead of PHP (Apache).\n\n### Htaccess\n\nPHP - Apache: In order to make the authorization call using apache, provide the htaccess configuration in the header:\n\n```\n\u003cIfModule mod_rewrite.c\u003e\n    RewriteEngine On\n    SetEnvIf Authorization .+ HTTP_AUTHORIZATION=$0\n\u003c/IfModule\u003e\n```\n\n### Fake data inside PHP\n\nFor testing purposes you will need to put **foo@mail.com** as e-mail and **123** as password.\n\nInside the PHP (login.php) page you will find the a simple checker to check if the login is correct.\n\n```php\n// fake database return\n$DATABASE_PASSWORD = md5('123');\n$DATABASE_EMAIL = 'foo@mail.com';\n```\n\n### JWT serverKey\n\nIn order to use JWT you have to define a key (string). Set this inside the PHP page (auth.php)\n\n```php\n// JWT config\n$JWTServerkey = '123123';\n```\n\n## Example\n\n![login.gif](react-bhx-auth%209006df9d7f2a492388f768486923f721/login.gif)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcoffezilla%2Freact-bhx-auth","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcoffezilla%2Freact-bhx-auth","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcoffezilla%2Freact-bhx-auth/lists"}