{"id":30122108,"url":"https://github.com/ahmed-maher77/slideauth___sliding-authentication-system","last_synced_at":"2025-08-10T13:41:00.463Z","repository":{"id":306816730,"uuid":"1027295545","full_name":"Ahmed-Maher77/SlideAuth___Sliding-Authentication-System","owner":"Ahmed-Maher77","description":"A sleek, responsive authentication system featuring animated transitions, real-time form validation, and secure session management—all built using pure HTML, CSS, and JavaScript.","archived":false,"fork":false,"pushed_at":"2025-07-27T20:50:51.000Z","size":23,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-07-27T20:54:29.026Z","etag":null,"topics":["authentication-system","fontawesome","form-validation","front-end-development","git","github-pages","html-css-javascript","login-page","signup-form","web-development"],"latest_commit_sha":null,"homepage":"https://ahmed-maher77.github.io/SlideAuth___Sliding-Authentication-System/","language":"HTML","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/Ahmed-Maher77.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}},"created_at":"2025-07-27T18:13:00.000Z","updated_at":"2025-07-27T20:50:55.000Z","dependencies_parsed_at":"2025-07-27T20:54:31.458Z","dependency_job_id":"a8e2f4b1-72db-4055-9b74-411bd2a8a006","html_url":"https://github.com/Ahmed-Maher77/SlideAuth___Sliding-Authentication-System","commit_stats":null,"previous_names":["ahmed-maher77/slideauth___sliding-authentication-system"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/Ahmed-Maher77/SlideAuth___Sliding-Authentication-System","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ahmed-Maher77%2FSlideAuth___Sliding-Authentication-System","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ahmed-Maher77%2FSlideAuth___Sliding-Authentication-System/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ahmed-Maher77%2FSlideAuth___Sliding-Authentication-System/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ahmed-Maher77%2FSlideAuth___Sliding-Authentication-System/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Ahmed-Maher77","download_url":"https://codeload.github.com/Ahmed-Maher77/SlideAuth___Sliding-Authentication-System/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Ahmed-Maher77%2FSlideAuth___Sliding-Authentication-System/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":269734007,"owners_count":24466541,"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-08-10T02:00:08.965Z","response_time":71,"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":["authentication-system","fontawesome","form-validation","front-end-development","git","github-pages","html-css-javascript","login-page","signup-form","web-development"],"created_at":"2025-08-10T13:40:58.705Z","updated_at":"2025-08-10T13:41:00.422Z","avatar_url":"https://github.com/Ahmed-Maher77.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🔐 SlideAuth - Sliding Authentication System\n\nA sleek, responsive authentication system featuring animated transitions between Sign In and Sign Up forms. Built entirely with HTML, CSS, and JavaScript, this app includes real-time validation, localStorage-based session management, secure form handling, and beautiful UI/UX elements.\n\n---\n\n## 💻 Used Technologies\n\n- **HTML5** – Semantic structure and form elements  \n- **CSS3** – Flexbox, Grid, Animations, Media Queries, CSS Variables  \n- **JavaScript (ES6+)** – DOM manipulation, event handling, localStorage API, regex validation  \n- **FontAwesome** – Icon library  \n- **Git** – Version control\n- **github-pages** - hosting the website\n\n---\n\n## 🌐 Live Preview\n\n**🔗 View the Demo:** [https://ahmed-maher77.github.io/SlideAuth___Sliding-Authentication-System/](https://ahmed-maher77.github.io/SlideAuth___Sliding-Authentication-System/)\n\n---\n\n## ✨ Key Features\n\n- 🔐 **Authentication System**\n  - User registration \u0026 login with real-time validation\n  - Session persistence with localStorage\n  - Auto-redirect based on login state\n- ✅ **Form Validation**\n  - Regex-based input validation (username, email, password)\n  - Duplicate check and real-time feedback\n- 🎨 **Interactive UI/UX**\n  - Smooth sliding transitions between forms\n  - Responsive design with modern color schemes\n  - Toast notifications \u0026 loading states\n- 👤 **User Dashboard**\n  - Personalized greeting and user avatar\n  - Logout and session management\n- 🔗 **Social \u0026 Developer Links**\n  - LinkedIn, GitHub, Portfolio integrations\n- 🔒 **Security Features**\n  - Input sanitization and error handling\n  - Protected routes and redirects\n\n---\n\n## 🎥 Watch the Demo on LinkedIn\n\n**🔗 Watch on LinkedIn:** []()\n\n---\n\n## 👀 Website Preview\n\u003ca href=\"https://ahmed-maher77.github.io/SlideAuth___Sliding-Authentication-System/\" title=\"demo\"\u003e\n  \u003cimg src=\"https://github.com/user-attachments/assets/5e7340f9-cc67-49ad-86de-11a2f1e40f29\" alt=\"website preview - UI Mockup\" width=\"400\"\u003e\n\u003c/a\u003e\n\n---\n\n## Test Accounts\n\nYou can use these pre-configured accounts to test the login functionality:\n\n| Username | Email | Password |\n|----------|-------|----------|\n| john_doe | john@example.com | Password123 |\n| jane_smith | jane@example.com | Secure456 |\n| admin | admin@example.com | Admin123 |\n| demo | demo@example.com | Demo123 |\n\n---\n\n## 📥 Installation Instructions for Local Setup\n\n```bash\n# 1. Clone the Repository\ngit clone https://github.com/Ahmed-Maher77/SlideAuth___Sliding-Authentication-System.git\n\n# 2. Navigate to the Project Directory\ncd SlideAuth___Sliding-Authentication-System\n\n# 3. Open index.html in your browser\n```\n✅ No build tools or dependencies required. Just open the HTML file!\n\n---\n\n## Browser Compatibility\n\n-   Chrome (recommended)\n-   Firefox\n-   Safari\n-   Edge\n\n---\n\n## Security Notes\n\n⚠️ **This is a demo application** - In a production environment:\n\n-   Passwords should be hashed\n-   Use HTTPS\n-   Implement proper session management\n-   Add CSRF protection\n-   Use a real database instead of localStorage\n\n---\n\n## 📬 Contact \u0026 Contribution\nFeel free to reach out, collaborate, or fork the project!\n- 🧑‍💻 **Portfolio:** \u003ca href=\"https://ahmedmaher-portfolio.vercel.app/\" title=\"See My Portfolio\"\u003ehttps://ahmedmaher-portfolio.vercel.app/\u003c/a\u003e\n- 🔗 **LinkedIn:** \u003ca href=\"https://www.linkedin.com/in/ahmed-maher-algohary\" title=\"Contact via LinkedIn\"\u003ehttps://www.linkedin.com/in/ahmed-maher-algohary\u003c/a\u003e\n- 📧 **Email:** \u003ca href=\"mailto:ahmedmaher.dev1@gmail.com\" title=\"Contact via Email\"\u003eahmedmaher.dev1@gmail.com\u003c/a\u003e\n\n\u003e Contributions, feedback, and suggestions are welcome!\n\n---\n\n## ⭐ Support\n\nIf you found this project helpful or inspiring, please consider giving it a ⭐. Your support helps me grow and share more open-source projects like this!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fahmed-maher77%2Fslideauth___sliding-authentication-system","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fahmed-maher77%2Fslideauth___sliding-authentication-system","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fahmed-maher77%2Fslideauth___sliding-authentication-system/lists"}