software-development-company-logo

Tag: Project 2: Contact Management System

  • Project 2: Contact Management System

    Section 1: Introduction to PHP
    Section 2: PHP Fundamentals
    Section 3: Working with Forms and User Input
    Section 4: Object-Oriented PHP
    Section 5: PHP and Databases
    Section 6: Advanced PHP Concepts
    Section 7: Real-World Projects
    Section 8: PHP Best Practices

    In this project, you will build a Contact Management System using Laravel. The application will allow users to manage their contacts, store them in a database, and upload profile pictures.

    Lesson Outline

    1. Setting Up the Environment
    2. Designing the Database
    3. Implementing CRUD for Contacts
    4. Handling File Uploads for Profile Pictures
    5. Styling and Validating the Application
    6. Enhancing Features and Best Practices

    Step 1: Setting Up the Environment

    1.1 Install Laravel

    Follow the steps from Lesson 19 to install Laravel:

    1. Install Laravel using Composer:
      bash
      composer create-project --prefer-dist laravel/laravel contact-management
    2. Navigate to the project directory:
      bash
      cd contact-management

    1.2 Configure the Database

    1. Create a MySQL database named contacts.
    2. Update the .env file with your database credentials:
      env
      DB_CONNECTION=mysql
      DB_HOST=127.0.0.1
      DB_PORT=3306
      DB_DATABASE=contacts
      DB_USERNAME=root
      DB_PASSWORD=yourpassword
    3. Run the migration command to ensure Laravel’s default migrations are applied:
      bash
      php artisan migrate

    Step 2: Designing the Database

    2.1 Create a Contacts Table

    1. Generate a migration file:
      bash
      php artisan make:migration create_contacts_table
    2. Open the migration file in database/migrations/ and define the schema:
      php
      public function up()
      {
      Schema::create('contacts', function (Blueprint $table) {
      $table->id();
      $table->string('name');
      $table->string('email')->unique();
      $table->string('phone');
      $table->string('profile_picture')->nullable();
      $table->timestamps();
      });
      }
    3. Run the migration:
      bash
      php artisan migrate

    2.2 Create a Contact Model

    Generate a model for contacts:

    bash
    php artisan make:model Contact

    Step 3: Implementing CRUD for Contacts

    3.1 Generate a Resource Controller

    Run the command to create a controller for managing contacts:

    bash
    php artisan make:controller ContactController --resource

    3.2 Define Routes

    Edit the routes/web.php file to include routes for the ContactController:

    php

    use App\Http\Controllers\ContactController;

    Route::resource(‘contacts’, ContactController::class);

    3.3 Add Methods in ContactController

    Index: List All Contacts

    php
    public function index()
    {
    $contacts = Contact::all();
    return view('contacts.index', compact('contacts'));
    }

    Create: Show Form to Add Contact

    php
    public function create()
    {
    return view('contacts.create');
    }

    Store: Save a New Contact

    php
    public function store(Request $request)
    {
    $request->validate([
    'name' => 'required|max:255',
    'email' => 'required|email|unique:contacts',
    'phone' => 'required',
    ]);    Contact::create($request->all());

    return redirect()->route(‘contacts.index’)->with(‘success’, ‘Contact added successfully.’);
    }

    Edit: Show Form to Edit Contact

    php
    public function edit(Contact $contact)
    {
    return view('contacts.edit', compact('contact'));
    }

    Update: Update a Contact

    php
    public function update(Request $request, Contact $contact)
    {
    $request->validate([
    'name' => 'required|max:255',
    'email' => 'required|email|unique:contacts,email,' . $contact->id,
    'phone' => 'required',
    ]);    $contact->update($request->all());

    return redirect()->route(‘contacts.index’)->with(‘success’, ‘Contact updated successfully.’);
    }

    Destroy: Delete a Contact

    php
    public function destroy(Contact $contact)
    {
    $contact->delete();
    return redirect()->route('contacts.index')->with('success', 'Contact deleted successfully.');
    }

    Step 4: Handling File Uploads for Profile Pictures

    4.1 Modify Store and Update Methods

    Update the store and update methods in the ContactController to handle file uploads.

    Store with Profile Picture Upload

    php
    public function store(Request $request)
    {
    $request->validate([
    'name' => 'required|max:255',
    'email' => 'required|email|unique:contacts',
    'phone' => 'required',
    'profile_picture' => 'nullable|image|mimes:jpg,png,jpeg|max:2048',
    ]);    $contactData = $request->all();

    if ($request->hasFile(‘profile_picture’)) {
    $contactData[‘profile_picture’] = $request->file(‘profile_picture’)->store(‘profile_pictures’, ‘public’);
    }

    Contact::create($contactData);

    return redirect()->route(‘contacts.index’)->with(‘success’, ‘Contact added successfully.’);
    }

    Update with Profile Picture Upload

    php
    public function update(Request $request, Contact $contact)
    {
    $request->validate([
    'name' => 'required|max:255',
    'email' => 'required|email|unique:contacts,email,' . $contact->id,
    'phone' => 'required',
    'profile_picture' => 'nullable|image|mimes:jpg,png,jpeg|max:2048',
    ]);    $contactData = $request->all();

    if ($request->hasFile(‘profile_picture’)) {
    if ($contact->profile_picture) {
    Storage::delete(‘public/’ . $contact->profile_picture);
    }
    $contactData[‘profile_picture’] = $request->file(‘profile_picture’)->store(‘profile_pictures’, ‘public’);
    }

    $contact->update($contactData);

    return redirect()->route(‘contacts.index’)->with(‘success’, ‘Contact updated successfully.’);
    }

    4.2 Display Profile Pictures

    Update the index and show views to display profile pictures.

    Display in Index View

    html
    @foreach ($contacts as $contact)
    <tr>
    <td>
    @if ($contact->profile_picture)
    <img src="{{ asset('storage/' . $contact->profile_picture) }}" width="50" height="50">
    @else
    No Picture
    @endif
    </td>
    <td>{{ $contact->name }}</td>
    <td>{{ $contact->email }}</td>
    <td>{{ $contact->phone }}</td>
    <td>
    <a href="{{ route('contacts.edit', $contact) }}">Edit</a>
    <form action="{{ route('contacts.destroy', $contact) }}" method="POST" style="display:inline;">
    @csrf
    @method('DELETE')
    <button type="submit">Delete</button>
    </form>
    </td>
    </tr>
    @endforeach

    Step 5: Styling and Validating the Application

    1. Use Bootstrap or Tailwind CSS for styling forms and tables.
    2. Add Validation Feedback:
      • Display error messages using $errors in views.

    Activities and Exercises

    1. Enhance the Contact Manager:
      • Add a “Notes” field to contacts.
      • Implement search functionality.
    2. Pagination:
      • Add pagination to the contacts list.
    3. Advanced Features:
      • Allow users to bulk upload contacts from a CSV file.

    Assignment

    1. Extend the Contact Management System to:
      • Allow users to group contacts into categories.
      • Generate a downloadable report (PDF) of all contacts.
    2. Test the application thoroughly:
      • Write validation test cases for adding and updating contacts.
      • Ensure file upload limits are enforced.

    Summary

    In this project, you:

    1. Built a Contact Management System with Laravel.
    2. Implemented CRUD operations for managing contacts.
    3. Handled file uploads for profile pictures.
    4. Enhanced the application with validation and file storage.

    This project showcases Laravel’s capabilities in building a feature-rich application. Let me know if you’d like further guidance or additional features!