laravel-from-zero-to-production

Todo Application - Laravel

A complete Todo application built with Laravel, demonstrating fundamental web development concepts.

πŸš€ Features

βœ… Todo Management

βœ… User Interface

βœ… Advanced Features

πŸ“ Project Structure

todo-app/
β”œβ”€β”€ app/
β”‚   β”œβ”€β”€ Http/Controllers/
β”‚   β”‚   └── TodoController.php      # Main controller
β”‚   └── Models/
β”‚       └── Todo.php               # Eloquent model
β”œβ”€β”€ database/
β”‚   └── migrations/
β”‚       └── create_todos_table.php # Database migration
β”œβ”€β”€ resources/
β”‚   └── views/
β”‚       β”œβ”€β”€ layouts/
β”‚       β”‚   └── app.blade.php      # Main layout
β”‚       └── todos/
β”‚           β”œβ”€β”€ index.blade.php    # Todo list
β”‚           └── create.blade.php   # Creation form
β”œβ”€β”€ routes/
β”‚   └── web.php                   # Application routes
└── README.md                     # This file

πŸ› οΈ Installation

1. Prerequisites

2. Installation

# Clone the project
git clone <repository-url>
cd todo-app

# Install dependencies
composer install

# Copy environment file
cp .env.example .env

# Generate application key
php artisan key:generate

# Configure database in .env
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=todo_app
DB_USERNAME=root
DB_PASSWORD=

# Run migrations
php artisan migrate

# Start server
php artisan serve

3. Access the application

πŸ“š Laravel Concepts Used

Eloquent Model

class Todo extends Model
{
    protected $fillable = [
        'title', 'description', 'completed', 'due_date', 'priority'
    ];

    // Scopes for filtering
    public function scopeCompleted($query)
    {
        return $query->where('completed', true);
    }

    public function scopePending($query)
    {
        return $query->where('completed', false);
    }
}

Resource Controller

class TodoController extends Controller
{
    public function index(): View
    {
        $todos = Todo::latest()->paginate(10);
        return view('todos.index', compact('todos'));
    }

    public function store(Request $request): RedirectResponse
    {
        $validated = $request->validate([
            'title' => 'required|string|max:255',
            'priority' => 'required|in:low,medium,high',
        ]);

        Todo::create($validated);
        return redirect()->route('todos.index');
    }
}

Resource Routes

Route::resource('todos', TodoController::class);
Route::patch('/todos/{todo}/toggle', [TodoController::class, 'toggle']);

Blade Views

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="card">
        <div class="card-header">
            <h2><i class="fas fa-tasks"></i> Todo List</h2>
        </div>
        <div class="card-body">
            @foreach($todos as $todo)
                <div class="todo-item">
                    <h5></h5>
                    <span class="badge bg-">
                        
                    </span>
                </div>
            @endforeach
        </div>
    </div>
</div>
@endsection

🎯 Detailed Features

Todo Management

Filtering and Sorting

Statistics

User Interface

πŸ”§ Customization

Add new fields

  1. Modify the migration create_todos_table.php
  2. Add the field to the model’s $fillable
  3. Update views and controller
  4. Run php artisan migrate:fresh

Modify styling

Edit the file resources/views/layouts/app.blade.php :

<style>
    .card {
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
        border-radius: 0.5rem;
    }
    
    .todo-item {
        border-left: 4px solid #007bff;
        padding-left: 1rem;
    }
</style>

Add new features

πŸ§ͺ Testing

Unit Tests

# Run tests
php artisan test

# Specific tests
php artisan test --filter=TodoTest

Feature Tests

class TodoTest extends TestCase
{
    public function test_can_create_todo()
    {
        $response = $this->post('/todos', [
            'title' => 'Test Todo',
            'priority' => 'medium'
        ]);

        $response->assertRedirect('/todos');
        $this->assertDatabaseHas('todos', ['title' => 'Test Todo']);
    }
}

πŸš€ Deployment

Heroku

# Create Heroku app
heroku create todo-app-laravel

# Configure environment variables
heroku config:set APP_KEY=base64:your-key
heroku config:set DB_CONNECTION=postgresql

# Deploy
git push heroku main

# Run migrations
heroku run php artisan migrate

VPS/Dedicated Server

# Clone the project
git clone <repository-url>
cd todo-app

# Install dependencies
composer install --optimize-autoloader --no-dev

# Configure environment
cp .env.example .env
php artisan key:generate

# Run migrations
php artisan migrate

# Configure web server (Nginx/Apache)
# Optimize for production
php artisan config:cache
php artisan route:cache
php artisan view:cache

πŸ“ API Endpoints

The application can be extended with a REST API:

// routes/api.php
Route::apiResource('todos', TodoApiController::class);
Route::patch('todos/{todo}/toggle', [TodoApiController::class, 'toggle']);

Available endpoints

🀝 Contributing

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

πŸ“„ License

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

πŸ†˜ Support

For any questions or issues:

  1. Check this README
  2. Consult Laravel documentation
  3. Open an issue on GitHub

Todo Application - Complete Laravel application for task management 🎯