TiagoSilvaPereira

<div x-data="imageViewer()">
  <div class="mb-2">
    <!-- Show the image -->
    <template x-if="imageUrl">
      <img :src="imageUrl" 
           class="object-cover rounded border border-gray-200" 
           style="width: 100px; height: 100px;"
      >
    </template>
    

TiagoSilvaPereira

function imageViewer() {
  return {
    imageUrl: '',

    fileChosen(event) {
      this.fileToDataUrl(event, src => this.imageUrl = src)
    },

    fileToDataUrl(event, callback) {
      if (! event.target.files.length) return

TiagoSilvaPereira

<?php

// ...

public function up()
{
    Schema::create('recipes', function (Blueprint $table) {
        $table->bigIncrements('id');
        $table->string('name');

TiagoSilvaPereira

<?php

// ...

public function up()
{
    Schema::create('recipe_items', function (Blueprint $table) {
        $table->bigIncrements('id');
        $table->string('name');
        $table->integer('quantity');

TiagoSilvaPereira

<?php

namespace App\Exceptions;

use Illuminate\Foundation\Exceptions\Handler as ExceptionHandler;
use Illuminate\Http\JsonResponse;
use Illuminate\Support\Arr;
use Throwable;

class Handler extends ExceptionHandler