{"id":31693780,"url":"https://github.com/abdurrahman-akash/firebase-authentication-authorization","last_synced_at":"2026-04-17T12:35:04.484Z","repository":{"id":315634469,"uuid":"1059136623","full_name":"abdurrahman-akash/Firebase-Authentication-Authorization","owner":"abdurrahman-akash","description":"This is an initial level of authentication and authorization using Firebase Authentication","archived":false,"fork":false,"pushed_at":"2025-09-19T17:43:34.000Z","size":63,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-09-19T19:58:23.714Z","etag":null,"topics":["firebase-auth","react-router","reactjs"],"latest_commit_sha":null,"homepage":"","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/abdurrahman-akash.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":"2025-09-18T03:45:13.000Z","updated_at":"2025-09-18T04:14:59.000Z","dependencies_parsed_at":"2025-09-19T19:58:26.558Z","dependency_job_id":"86392a9e-e950-4e7f-8484-fa3a0b025402","html_url":"https://github.com/abdurrahman-akash/Firebase-Authentication-Authorization","commit_stats":null,"previous_names":["abdurrahman-akash/firebase-authentication-authorization"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/abdurrahman-akash/Firebase-Authentication-Authorization","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/abdurrahman-akash%2FFirebase-Authentication-Authorization","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/abdurrahman-akash%2FFirebase-Authentication-Authorization/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/abdurrahman-akash%2FFirebase-Authentication-Authorization/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/abdurrahman-akash%2FFirebase-Authentication-Authorization/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/abdurrahman-akash","download_url":"https://codeload.github.com/abdurrahman-akash/Firebase-Authentication-Authorization/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/abdurrahman-akash%2FFirebase-Authentication-Authorization/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278972328,"owners_count":26078017,"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","status":"online","status_checked_at":"2025-10-08T02:00:06.501Z","response_time":56,"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":["firebase-auth","react-router","reactjs"],"created_at":"2025-10-08T15:53:14.418Z","updated_at":"2025-10-08T15:53:16.383Z","avatar_url":"https://github.com/abdurrahman-akash.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Firebase Authentication Project\n\nI am starting to learn Firebase. This is an initial level of authentication and authorization using Firebase Authentication. I am adding Google and GitHub providers and also the login and registration form.\n\n## 🚀 Project Overview\n\nThis project is a modern React application built with Vite that implements Firebase Authentication. It features a complete authentication system with email/password login, registration, and social authentication providers (Google and GitHub).\n\n## ✨ Features\n\n- 🔐 **Email/Password Authentication**\n  - User registration with email verification\n  - Secure login system\n  - Password strength validation\n  - Form validation with real-time feedback\n\n- 🌐 **Social Authentication**\n  - Google OAuth integration\n  - GitHub OAuth integration\n  - One-click social sign-in\n\n- 🎨 **Modern UI/UX**\n  - Responsive design with Tailwind CSS\n  - Beautiful components with DaisyUI\n  - Smooth animations and transitions\n  - Dark/Light theme support\n\n- 🛡️ **Security Features**\n  - Client-side form validation\n  - Password strength indicator\n  - Error handling and user feedback\n  - Secure Firebase configuration\n\n## 🛠️ Tech Stack\n\n- **Frontend Framework**: React 19.1.1\n- **Build Tool**: Vite 7.1.2\n- **Styling**: Tailwind CSS 4.1.13 + DaisyUI 5.1.12\n- **Authentication**: Firebase 12.2.1\n- **Routing**: React Router 7.9.1\n- **Package Manager**: pnpm\n\n## 📁 Project Structure\n\n```\nauth-firebase/\n├── src/\n│   ├── components/\n│   │   ├── ErrorPage/\n│   │   ├── Home/\n│   │   ├── Login/\n│   │   ├── Register/\n│   │   ├── Navbar/\n│   │   ├── Toaster/\n│   ├── contexts/\n│   │   ├── AuthContext.jsx\n│   ├── providers/\n│   │   ├── AuthProviders.jsx\n│   ├── index.css\n│   ├── Root.jsx\n│   └── main.jsx\n├── Firebase/\n│   └── firebase.init.js\n├── public/\n└── package.json\n```\n\n## 🚀 Getting Started\n\n### Prerequisites\n\n- Node.js (v18 or higher)\n- pnpm package manager\n- Firebase project with Authentication enabled\n\n### Installation\n\n1. **Clone the repository**\n   ```bash\n   git clone \u003crepository-url\u003e\n   cd auth-firebase\n   ```\n\n2. **Install dependencies**\n   ```bash\n   pnpm install\n   ```\n\n3. **Firebase Setup**\n   - Create a Firebase project at [Firebase Console](https://console.firebase.google.com/)\n   - Enable Authentication and configure providers:\n     - Email/Password\n     - Google\n     - GitHub\n   - Copy your Firebase config and update `Firebase/firebase.init.js`\n\n4. **Environment Configuration**\n   ```bash\n   # Update Firebase/firebase.init.js with your config\n   const firebaseConfig = {\n     apiKey: \"your-api-key\",\n     authDomain: \"your-auth-domain\",\n     projectId: \"your-project-id\",\n     // ... other config\n   };\n   ```\n\n5. **Start the development server**\n   ```bash\n   pnpm dev\n   ```\n\n6. **Open your browser**\n   Navigate to `http://localhost:5173`\n\n## 📱 Available Scripts\n\n```bash\n# Start development server\npnpm dev\n\n# Build for production\npnpm build\n\n# Preview production build\npnpm preview\n\n# Run ESLint\npnpm lint\n```\n\n## 🔧 Firebase Configuration\n\n### Authentication Providers Setup\n\n1. **Google Provider**\n   - Go to Firebase Console → Authentication → Sign-in method\n   - Enable Google provider\n   - Add your domain to authorized domains\n\n2. **GitHub Provider**\n   - Enable GitHub provider in Firebase Console\n   - Create GitHub OAuth App\n   - Add Client ID and Client Secret to Firebase\n\n3. **Email/Password**\n   - Enable Email/Password provider\n   - Configure email verification settings\n\n### Security Rules\n\nEnsure your Firebase project has proper security rules configured for production use.\n\n## 🎯 Learning Objectives\n\nThis project helps learn:\n\n- Firebase Authentication setup and configuration\n- React functional components and hooks\n- Form validation and error handling\n- OAuth integration with social providers\n- Modern CSS frameworks (Tailwind CSS + DaisyUI)\n- React Router for navigation\n- State management in React\n- User experience best practices\n\n## 🔐 Authentication Flow\n\n1. **Registration**: Users can create accounts with email/password\n2. **Login**: Existing users can sign in with email/password or social providers\n3. **Validation**: Real-time form validation with password strength checking\n4. **Error Handling**: Comprehensive error messages for various scenarios\n5. **Navigation**: Protected routes and conditional rendering based on auth state\n\n## 🐛 Common Issues \u0026 Solutions\n\n### Firebase Configuration\n- Ensure all required Firebase services are enabled\n- Check that your domain is added to authorized domains\n- Verify API keys and project settings\n\n### Social Authentication\n- Make sure OAuth apps are properly configured\n- Check redirect URIs match your domain\n- Verify provider-specific settings in Firebase Console\n\n## 📚 Resources\n\n- [Firebase Documentation](https://firebase.google.com/docs)\n- [React Documentation](https://react.dev)\n- [Tailwind CSS](https://tailwindcss.com)\n- [DaisyUI Components](https://daisyui.com)\n- [Vite Documentation](https://vitejs.dev)\n\n## 🤝 Contributing\n\nThis is a learning project, but suggestions and improvements are welcome!\n\n## 📄 License\n\nThis project is for educational purposes.\n\n---\n\n**Happy Learning! 🎉**","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fabdurrahman-akash%2Ffirebase-authentication-authorization","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fabdurrahman-akash%2Ffirebase-authentication-authorization","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fabdurrahman-akash%2Ffirebase-authentication-authorization/lists"}