URL Shortener ب Laravel 9 Darija & Vuejs 3 Darija الجزء الخامس والأخير

imadbelasri Laravel
LA

فهاد الجزء الخامس والأخير من URL Shortener ب Laravel 9 Darija & Vuejs 3 Darija غادي نزيدوا les routes ديالنا ول validation بالنسبة للفورم ديال الإضافة وأخيرا الصفحة الرئيسية.


نظرة سريعة بالفيديو


1- إضافة ل validation للفورم الجزء الأول

باش نزيدوا ل validation للفورم فاش يزيد المستخدم شي رابط غادي تزيد request جديدة سميها StoreUrlRequest.

الكود ديال الملف هو :

                                                    
                                                        //
<?php

namespace App\Http\Requests;

use Illuminate\Foundation\Http\FormRequest;

class StoreUrlRequest extends FormRequest
{
    /**
     * Determine if the user is authorized to make this request.
     *
     * @return bool
     */
    public function authorize()
    {
        return true;
    }

    /**
     * Get the validation rules that apply to the request.
     *
     * @return array<string, mixed>
     */
    public function rules()
    {
        return [
            'full_url' => 'required|url|unique:urls',
            'url_desc' => 'required|max:1000',
            'user_id' => 'required'
        ];
    }
}
                                                    
                                                

2- إضافة ل validation للفورم الجزء الثاني

باش نزيدوا ل validation للفورم فاش يعدل المستخدم شي رابط غادي تزيد request جديدة سميها UpdateUrlRequest.

الكود ديال الملف هو :

                                                        
                                                            //
<?php

namespace App\Http\Requests;

use Illuminate\Foundation\Http\FormRequest;

class UpdateUrlRequest extends FormRequest
{
    /**
     * Determine if the user is authorized to make this request.
     *
     * @return bool
     */
    public function authorize()
    {
        return true;
    }

    /**
     * Get the validation rules that apply to the request.
     *
     * @return array<string, mixed>
     */
    public function rules()
    {
        return [
            'full_url' =>'required|max:255|unique:urls,id,'.$this->id,
            'url_desc' => 'required|max:1000',
            'user_id' => 'required'
        ];
    }
}
                                                        
                                                    

3- إضافة ل API routes

ف dossier routes غادي نزيدو les routes الخاصين بل api فل fichier api.php الكود ديال الملف هو :

                                                        
                                                            //
<?php

use App\Http\Controllers\UrlController;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Route;

/*
|--------------------------------------------------------------------------
| API Routes
|--------------------------------------------------------------------------
|
| Here is where you can register API routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| is assigned the "api" middleware group. Enjoy building your API!
|
*/

Route::middleware('auth:sanctum')->get('/user', function (Request $request) {
    return $request->user();
});

Route::post('add/url',[UrlController::class, 'store']);
Route::get('user/urls/{user_id}',[UrlController::class, 'index']);
Route::delete('url/delete/{url_id}',[UrlController::class, 'destroy']);
Route::put('urls/{shorten_url}',[UrlController::class, 'update']);
                                                        
                                                    

4- إضافة ل web routes

ف dossier routes غادي نزيدو les routes الخاصين بل web فل fichier web.php الكود ديال الملف هو :

                                                        
                                                            //
<?php

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\UrlController;
use App\Http\Controllers\UserController;

/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
|
*/

Route::middleware('auth')->group(function(){
    Route::get('/', function () {
        return view('home');
    });
    Route::post('user/logout', [UserController::class, 'logout'])
    ->name('logout');
});

Route::get('user/register', [UserController::class, 'registerForm'])
    ->name('register');

Route::post('user/register', [UserController::class, 'store'])
    ->name('register');

Route::get('user/login', [UserController::class, 'loginForm'])
    ->name('login');

Route::post('user/login', [UserController::class, 'auth'])
    ->name('login');

Route::get('visit/{shorten_url}',[UrlController::class, 'show']);
                                                        
                                                    

5- إضافة الصفحة الرئيسية

من بعد دير تعديل على ل welcome page سميها home وزيد فيها هاد الكود :

                                                        
                                                            //
@extends('layouts.app')

@section('content')
<div class="row my-5">
    <div class="col-md-12">
        <home-component :user_id="{{auth()->user()->id}}"></home-component>
    </div>
</div>
@endsection