React and Laravel Authentication: Forgot and Reset Password

Install Laravel by installing composer, choose between the global installer or a direct command, create a project named Laravel OAuth, and run php artisan serve to verify in the browser.

Set up the Laravel authentication database, configure env credentials, and run migrations to create users, password_resets, and jobs tables, while replacing email with first_name and last_name.

Create and test Laravel routes: remove the default route, add a hello route via a controller, wire it in API routes, and test with Postman after artisan serve.

Learn to implement a register endpoint that creates a user with first name, last name, email, and hashed password, and returns a 201 created response.

Create a custom register request to validate first name, last name, email, and password, with password confirmation and unique emails. Include the X-Requested-With header for ajax requests.

Install and configure Laravel Sanctum to manage API tokens, publish the provider and migrations, and update the user model, setting the stage for the login function.

Learn how to implement login authentication in Laravel, using the attempt method to verify credentials, return 401 unauthorized on failure, and issue a JWT token for subsequent requests.

Learn to retrieve the current authenticated user with a JWT in Laravel by using a user function and Sanctum middleware, and ensure proper headers for the request.

Learn to implement secure authentication with HttpOnly cookies in Laravel by issuing a JWT cookie and injecting it into request headers via middleware.

Implement a logout flow that sends a post request to invalidate the session, removes the JWT cookie from the client, and confirms success by returning an unauthenticated state.

Learn how to implement forgot password in a Laravel authentication system, generate a reset token, store it in password_resets, and send a reset email with a link using MailHog locally.

Implement the forgot and reset password flow by validating token, requiring password and password confirm, hashing the new password with bcrypt, updating the user, and returning a success response.

Install React properly, create a React project with Ampex create react up using a TypeScript template, then navigate to the folder and run ampm start to launch the app.

Implement a sign-in template for the forgot and reset password flow in a React and Laravel authentication setup, copying the form and cleaning up inputs.

Explore building a TypeScript authentication flow by installing routing support, creating login and register pages, and wiring routes with a browser router and exact path matching.

Add a navigation component to enable routing between login, register, and home pages using link components, with bootstrap styling and placement on every page.

Create a React register form with stateful inputs for first name, last name, email, password, and password confirm; submit with prevent default and post data via axios to /api/register.

After successful registration, redirect to the login page by toggling a redirect state and rendering a redirect to '/login'. The lecture also demonstrates configuring axios defaults for consistent front-end requests.

Build a login form with email and password inputs and on-change handlers. Submit an asynchronous axios login request with email and password, then redirect to the main page.

Demonstrates fetching the current authenticated user via a user hook and axios with credentials, handling success and failure, and updating UI to show the signed-in user.

Lift the user state to the app component, pass it to home and nav, and implement logout with axios to update the user interface after sign-out.

Explore how to use useEffect dependencies to refresh user data when login or logout occurs, update navigation and UI, and conditionally show login or logout options.

Build the forgot password flow by creating a forgot component, wiring the email input, handling form submission with axios, and notifying users of success or error.

Create reset password page component with a password and confirmation form, use the token from email, send data with axios, and redirect to login after success.

Structure the project by separating frontend and backend, install Docker, and configure Docker Compose with separate Dockerfiles for the React frontend and Lara API backend to enable inter-container communication.

Create a lightweight dockerfile for a Laravel backend and a React frontend, install composer, copy files, and expose ports 1000 and 3000, then run php artisan serve and npm start.

Create a docker compose file version 3.7 linking backend, frontend, and database on a bridge network, with builds, ports, volumes, and dependencies, then run up and prepare migrations.

Navigate docker containers to run Laravel migrations, map volumes and environment variables, and fix port and host mappings for the forgot and reset password flow.