README.md

metadata

title: Flask Login
emoji: 💻
colorFrom: green
colorTo: indigo
sdk: docker
pinned: true
license: mit
short_description: A simple yet comprehensive Flask-based user authentication.

Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

---

Flask Login System 🔐

A simple yet comprehensive Flask-based user authentication system with SQLite database integration, featuring user registration, login, session management, and "Remember Me" functionality.

Live Demo: https://rahul23232-flask-login.hf.space/

📋 Table of Contents

• Features
• Technologies Used
• Installation
• Usage
• Project Structure
• API Routes
• Database Schema
• Security Considerations
• Contributing
• License

✨ Features

• User Registration: Create new user accounts with unique usernames
• User Authentication: Secure login system with credential verification
• Session Management: Server-side session handling for user state
• Remember Me: Optional persistent login that survives browser restarts
• Cookie Management: Last visit tracking with customizable expiration
• SQLite Integration: Lightweight database for user storage
• Responsive Design: Clean, user-friendly interface
• Error Handling: Proper validation and error messages

🛠️ Technologies Used

• Backend: Python 3.x, Flask
• Database: SQLite3
• Frontend: HTML, CSS (Bootstrap-compatible)
• Session Management: Flask Sessions
• Deployment: Hugging Face Spaces

📦 Installation

Prerequisites

• Python 3.7 or higher
• pip (Python package installer)

Local Setup

1. Clone the repository

   git clone https://github.com/yourusername/flask-login-system.git
   cd flask-login-system
   

2. Install dependencies

   pip install flask
   

3. Run the application

   python app.py
   

4. Access the application

   • Open your browser and navigate to http://localhost:5000

Docker Setup (for Hugging Face Spaces)

The project includes Docker configuration for deployment on Hugging Face Spaces:

FROM python:3.9-slim

WORKDIR /app

COPY requirements.txt .
RUN pip install -r requirements.txt

COPY . .

EXPOSE 7860

CMD ["python", "app.py"]

🎯 Usage

Getting Started

1. Access the Application: Navigate to the home URL
2. Create Account: Click "Sign Up" to create a new user account
3. Login: Use your credentials to log in
4. Remember Me: Check the "Remember Me" option to stay logged in
5. Logout: Click "Logout" to end your session

User Flow

graph TD
    A[Visit Homepage] --> B{User Logged In?}
    B -->|No| C[Redirect to Login]
    B -->|Yes| D[Show Dashboard]
    C --> E[Login Form]
    E --> F[Submit Credentials]
    F --> G{Valid Credentials?}
    G -->|No| H[Show Error]
    G -->|Yes| I[Create Session]
    I --> J{Remember Me?}
    J -->|Yes| K[Set Permanent Session]
    J -->|No| L[Set Temporary Session]
    K --> D
    L --> D
    D --> M[Logout Option]
    M --> N[Clear Session & Cookies]
    N --> C

📁 Project Structure

flask-login-system/
├── app.py                 # Main Flask application
├── templates/            # HTML templates
│   ├── base.html        # Base template
│   ├── login.html       # Login page
│   ├── signup.html      # Registration page
│   └── home.html        # Dashboard/home page
├── static/              # Static files (CSS, JS, images)
│   └── style.css       # Custom styles
├── users.db            # SQLite database (created automatically)
├── requirements.txt    # Python dependencies
├── Dockerfile         # Docker configuration
├── README.md          # Project documentation
└── .gitignore         # Git ignore rules

🛣️ API Routes

Public Routes

Route	Method	Description	Parameters
/login	GET, POST	User login page	username, password, remember
/signup	GET, POST	User registration	username, password

Protected Routes

Route	Method	Description	Authentication Required
/	GET	Homepage/Dashboard	Yes
/logout	GET	User logout	Yes

Route Details

/ (Homepage)

• Method: GET
• Authentication: Required
• Description: Main dashboard showing welcome message and last visit info
• Response: Redirects to login if not authenticated

/signup (Registration)

• Methods: GET, POST
• Parameters:
  • username (string): Unique username
  • password (string): User password
• Validation: Username must be unique
• Response: Redirects to login on success

/login (Authentication)

• Methods: GET, POST
• Parameters:
  • username (string): User's username
  • password (string): User's password
  • remember (checkbox): Optional "Remember Me"
• Response: Redirects to homepage on success

/logout (Session Termination)

• Method: GET
• Description: Clears session and cookies
• Response: Redirects to login page

🗄️ Database Schema

Users Table

CREATE TABLE users (
    id INTEGER PRIMARY KEY AUTOINCREMENT,
    username TEXT UNIQUE NOT NULL,
    password TEXT NOT NULL
);

Column	Type	Constraints	Description
id	INTEGER	PRIMARY KEY, AUTOINCREMENT	Unique user identifier
username	TEXT	UNIQUE, NOT NULL	User's login name
password	TEXT	NOT NULL	User's password (plain text)

Database Operations

• Connection: SQLite3 with sqlite3.Row factory for dictionary-like access
• Initialization: Automatic table creation on first run
• Queries: Parameterized queries to prevent SQL injection

🔒 Security Considerations

Current Implementation

• ✅ SQL injection protection via parameterized queries
• ✅ Session-based authentication
• ✅ CSRF protection through Flask's secret key
• ✅ Input validation and error handling

Production Recommendations

• ⚠️ Password Hashing: Currently stores plain text passwords

  from werkzeug.security import generate_password_hash, check_password_hash
  
  # For registration
  hashed_password = generate_password_hash(password)
  
  # For login verification
  check_password_hash(stored_hash, provided_password)
  

• ⚠️ Environment Variables: Move secret key to environment variables

  import os
  app.secret_key = os.environ.get('SECRET_KEY', 'fallback-secret-key')
  

• ⚠️ HTTPS: Enable HTTPS in production

• ⚠️ Rate Limiting: Implement login attempt limits

• ⚠️ Input Validation: Add comprehensive input sanitization

• ⚠️ Session Security: Configure secure session cookies

Recommended Security Enhancements

# Enhanced security configuration
app.config.update(
    SESSION_COOKIE_SECURE=True,      # HTTPS only
    SESSION_COOKIE_HTTPONLY=True,    # No JS access
    SESSION_COOKIE_SAMESITE='Lax',   # CSRF protection
    PERMANENT_SESSION_LIFETIME=timedelta(hours=1)  # Shorter sessions
)

🎨 Frontend Templates

Template Structure

All templates extend base.html for consistent styling:

<!-- base.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% block title %}Flask Login System{% endblock %}</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <div class="container mt-4">
        {% block content %}{% endblock %}
    </div>
</body>
</html>

Form Examples

Login Form

<form method="POST">
    <div class="mb-3">
        <label for="username" class="form-label">Username</label>
        <input type="text" class="form-control" name="username" required>
    </div>
    <div class="mb-3">
        <label for="password" class="form-label">Password</label>
        <input type="password" class="form-control" name="password" required>
    </div>
    <div class="mb-3 form-check">
        <input type="checkbox" class="form-check-input" name="remember">
        <label class="form-check-label">Remember Me</label>
    </div>
    <button type="submit" class="btn btn-primary">Login</button>
</form>

🚀 Deployment

Hugging Face Spaces

The project is configured for deployment on Hugging Face Spaces:

1. Create Space: Create a new Space on Hugging Face
2. Upload Files: Push your code to the Space repository
3. Configuration: Ensure app.py runs on port 7860
4. Environment: The Space will automatically build and deploy

Local Development

# Development mode with auto-reload
export FLASK_ENV=development
export FLASK_DEBUG=1
python app.py

Production Deployment

# Use a production WSGI server
pip install gunicorn
gunicorn -w 4 -b 0.0.0.0:5000 app:app

🤝 Contributing

1. Fork the repository
2. Create a feature branch (git checkout -b feature/amazing-feature)
3. Commit your changes (git commit -m 'Add amazing feature')
4. Push to the branch (git push origin feature/amazing-feature)
5. Open a Pull Request

Development Guidelines

• Follow PEP 8 style guidelines
• Add comments for complex logic
• Update documentation for new features
• Test all functionality before submitting

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

🐛 Known Issues

• Plain text password storage (security concern)
• No password strength validation
• No account recovery mechanism
• Limited input sanitization

🔮 Future Enhancements

• Password hashing with bcrypt/scrypt
• Email verification system
• Password reset functionality
• User profile management
• Role-based access control
• OAuth integration (Google, GitHub)
• Rate limiting and brute force protection
• Advanced session management
• API endpoints for mobile apps
• Unit and integration tests

📞 Support

For questions, issues, or contributions:

• Repository: GitHub Repository
• Live Demo: Flask Login System
• Issues: Use GitHub Issues for bug reports and feature requests

---

Note: This is a demonstration project for educational purposes. For production use, implement proper security measures including password hashing, HTTPS, and comprehensive input validation.