Mini Stack Overflow ب Laravel 8 Darija & Vuejs 2 Darija الجزء الثالت
فهاد الجزء الثالت من Mini Stack Overflow ب Laravel 8 Darija & Vuejs 2 Darija غادي نكملوا الجزء الخاص ب تعديل كلمة المرور وأيضا غادي نزيدو الإمكانية ديال إرسال email للمستخدم بعد التسجيل باش يدير تأكيد البريد الإلكتروني.
نظرة سريعة بالفيديو
1- إضافة طلب تعديل كلمة المرور
دائما فنفس dossier auth غادي تزيد fichier reset-password-link.blade.php هذا هو ل fichier لي قلنا ل fortify باش يخدم به لطلب تعديل كلمة المرور.
الكود ديال الملف هو :
//
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row justify-content-center my-5">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ __('Reset Password') }}</div>
<div class="card-body">
@if (session('status'))
<div class="alert alert-success" role="alert">
{{ session('status') }}
</div>
@endif
<form method="POST" action="{{ route('password.email') }}">
@csrf
<div class="form-group row mb-3">
<label for="email" class="col-md-4 col-form-label text-md-right">{{ __('E-Mail Address') }}</label>
<div class="col-md-6">
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email" autofocus>
@error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>
<div class="form-group row mb-0">
<div class="col-md-6 offset-md-4">
<button type="submit" class="btn btn-primary">
{{ __('Send Password Reset Link') }}
</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection
2- إضافة فورم تعديل كلمة المرور
دائما فنفس dossier auth غادي تزيد fichier reset-password.blade.php هذا هو ل fichier لي قلنا ل fortify باش يخدم به لتعديل كلمة المرور.
الكود ديال الملف هو :
//
@extends('layouts.app')
@section('content')
<div class="container">
<div class="row justify-content-center my-5">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ __('Reset Password') }}</div>
<div class="card-body">
<form method="POST" action="{{ route('password.update') }}">
@csrf
<input type="hidden" name="token" value="{{ request()->segment(2) }}">
<div class="form-group row mb-3">
<label for="email" class="col-md-4 col-form-label text-md-right">{{ __('E-Mail Address') }}</label>
<div class="col-md-6">
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ $email ?? old('email') }}" required autocomplete="email" autofocus>
@error('email')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>
<div class="form-group row mb-3">
<label for="password" class="col-md-4 col-form-label text-md-right">{{ __('Password') }}</label>
<div class="col-md-6">
<input id="password" type="password" class="form-control @error('password') is-invalid @enderror" name="password" required autocomplete="new-password">
@error('password')
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
</span>
@enderror
</div>
</div>
<div class="form-group row mb-3">
<label for="password-confirm" class="col-md-4 col-form-label text-md-right">{{ __('Confirm Password') }}</label>
<div class="col-md-6">
<input id="password-confirm" type="password" class="form-control" name="password_confirmation" required autocomplete="new-password">
</div>
</div>
<div class="form-group row mb-0">
<div class="col-md-6 offset-md-4">
<button type="submit" class="btn btn-primary">
{{ __('Reset Password') }}
</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection
3- إرسال البريد الإلكتروني بإستخدام Mailtrap
باش نمكنوا المستخدم فاش يتسجل يفعل الحساب ديالو غادي نخدموا بواد الموقع سميتو mailtrap لي كيمكن من إرسال رسائل مجانية فاش غادي تسجل غادي يعطيك هاد الصفحة :

من بعد غادي تختار Laravel من select box بحال هكا :

من بعد زيد ل username ول password فل env. كيف كتشوف لتحت وفاش يتسجل المستخدم غادي يجيه email بحال هذا :

//
MAIL_MAILER=smtp
MAIL_HOST=smtp.mailtrap.io
MAIL_PORT=1025
MAIL_USERNAME=your_username
MAIL_PASSWORD=your_password
MAIL_ENCRYPTION=tls