# Filament in laravel

<div class="Y3BBE" data-hveid="CAEIABAC" data-sfc-cp="" id="bkmrk-filament-is%C2%A0a-full-s" jsaction="rcuQ6b:&TVxFr_5|npT2md" jscontroller="zcfIf" jsuid="TVxFr_5" style="font-family: 'Google Sans', Roboto, Arial, sans-serif; font-size: 16px; line-height: 24px; overflow-wrap: break-word; margin: 0px 0px 20px; color: rgb(10, 10, 10); font-weight: 400; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">Filament is <mark class="HxTRcb" style="color: rgb(0, 29, 53); border-radius: 4px; background: linear-gradient(90deg, rgb(211, 227, 253) 50%, rgba(0, 0, 0, 0) 50%) 75% 0px / 200% 100% no-repeat scroll padding-box border-box rgba(0, 0, 0, 0); padding: 0px 2px; font-weight: 500; animation: 0.75s cubic-bezier(0.05, 0.7, 0.1, 1) 0.25s 1 normal forwards running highlight-animation;">a full-stack framework for Laravel that allows developers to build modern admin panels and public-facing applications quickly</mark>. It is a Server-Driven UI (SDUI) framework, built on the TALL stack ([Tailwind CSS](https://www.google.com/search?q=Tailwind+CSS&oq=what+is+filament&gs_lcrp=EgZjaHJvbWUqBwgBEAAYgAQyCQgAEEUYORiABDIHCAEQABiABDIHCAIQABiABDIHCAMQABiABDIHCAQQABiABDIHCAUQABiABDIHCAYQABiABDIHCAcQABiABDIHCAgQABiABDIHCAkQABiABNIBCDU1NDJqMGo3qAIAsAIA&sourceid=chrome&ie=UTF-8&ved=2ahUKEwjh6_Sn_6KRAxVz-jgGHcmWKcYQgK4QegYIAQgAEAY), [Alpine.js](https://www.google.com/search?q=Alpine.js&oq=what+is+filament&gs_lcrp=EgZjaHJvbWUqBwgBEAAYgAQyCQgAEEUYORiABDIHCAEQABiABDIHCAIQABiABDIHCAMQABiABDIHCAQQABiABDIHCAUQABiABDIHCAYQABiABDIHCAcQABiABDIHCAgQABiABDIHCAkQABiABNIBCDU1NDJqMGo3qAIAsAIA&sourceid=chrome&ie=UTF-8&ved=2ahUKEwjh6_Sn_6KRAxVz-jgGHcmWKcYQgK4QegYIAQgAEAc), [Laravel Livewire](https://www.google.com/search?q=Laravel+Livewire&oq=what+is+filament&gs_lcrp=EgZjaHJvbWUqBwgBEAAYgAQyCQgAEEUYORiABDIHCAEQABiABDIHCAIQABiABDIHCAMQABiABDIHCAQQABiABDIHCAUQABiABDIHCAYQABiABDIHCAcQABiABDIHCAgQABiABDIHCAkQABiABNIBCDU1NDJqMGo3qAIAsAIA&sourceid=chrome&ie=UTF-8&ved=2ahUKEwjh6_Sn_6KRAxVz-jgGHcmWKcYQgK4QegYIAQgAEAg), [Blade](https://www.google.com/search?q=Blade&oq=what+is+filament&gs_lcrp=EgZjaHJvbWUqBwgBEAAYgAQyCQgAEEUYORiABDIHCAEQABiABDIHCAIQABiABDIHCAMQABiABDIHCAQQABiABDIHCAUQABiABDIHCAYQABiABDIHCAcQABiABDIHCAgQABiABDIHCAkQABiABNIBCDU1NDJqMGo3qAIAsAIA&sourceid=chrome&ie=UTF-8&ved=2ahUKEwjh6_Sn_6KRAxVz-jgGHcmWKcYQgK4QegYIAQgAEAk)), and provides a collection of components for tasks like creating tables, forms, and notifications, often without requiring custom JavaScript or frontend code.<span class="uJ19be notranslate" data-wiz-uids="TVxFr_g,TVxFr_h,TVxFr_i"><span class="vKEkVd" data-animation-atomic="" style="white-space: nowrap; position: relative;"> <button aria-label="View related links" class="rBl3me" data-amic="true" data-icl-uuid="12862dfd-9539-42ba-8c95-6975176e7dfc" data-ved="2ahUKEwjh6_Sn_6KRAxVz-jgGHcmWKcYQye0OegYIAQgAEAo" data-wiz-attrbind="disabled=TVxFr_g_C5gNJc;class=TVxFr_g_UpSNec;" style="margin: 0px 6px 0px 0px; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(229, 237, 255); border: none; border-radius: 10px; height: 20px; padding: 0px; width: 28px; position: relative; outline: 0px; cursor: pointer;" tabindex="0"><span class="wiMplc ofC0Ud" style="color: rgb(0, 29, 53); display: inline-block; transform: rotate(135deg);"><svg fill="currentColor" focusable="false" height="12px" style="margin-top: 3px;" viewbox="0 0 24 24" width="12px" xmlns="http://www.w3.org/2000/svg"><path d="M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z"></path></svg></span></button></span></span></div><span id="bkmrk--1" style="color: rgb(10, 10, 10); font-family: 'Google Sans', Roboto, Arial, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"></span><span id="bkmrk--2" style="color: rgb(10, 10, 10); font-family: 'Google Sans', Roboto, Arial, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"></span><span id="bkmrk--3" style="color: rgb(10, 10, 10); font-family: 'Google Sans', Roboto, Arial, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"></span><span id="bkmrk--4" style="color: rgb(10, 10, 10); font-family: 'Google Sans', Roboto, Arial, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"></span><span id="bkmrk--5" style="color: rgb(10, 10, 10); font-family: 'Google Sans', Roboto, Arial, sans-serif; font-size: 16px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;"></span>

<div class="Y3BBE" data-hveid="CAEIABAM" data-sfc-cp="" id="bkmrk-this-video-explains-" jsaction="rcuQ6b:&TVxFr_o|npT2md" jscontroller="zcfIf" jsuid="TVxFr_o" style="font-family: 'Google Sans', Roboto, Arial, sans-serif; font-size: 16px; line-height: 24px; overflow-wrap: break-word; margin: 10px 0px 20px; color: rgb(10, 10, 10); font-weight: 400; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: start; text-indent: 0px; text-transform: none; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; white-space: normal; background-color: rgb(255, 255, 255); text-decoration-thickness: initial; text-decoration-style: initial; text-decoration-color: initial;">This video explains how to use Filament to build powerful admin panels for your Laravel applications: <div class="" data-wiz-uids="TVxFr_q,TVxFr_r" jscontroller="uDeH3" jsuid="TVxFr_p"><div data-hveid="CAEIABAN" data-ved="2ahUKEwjh6_Sn_6KRAxVz-jgGHcmWKcYQ-bUQegYIAQgAEA0"><div><div class="Q2WBBe" jsuid="TVxFr_r" style="container-type: inline-size; display: flex; flex-direction: column; background-color: rgb(243, 245, 246); margin-top: 12px; border-radius: 16px;"><div aria-label="" class="r0hyfc" data-animation-nesting="" data-ved="2ahUKEwjh6_Sn_6KRAxVz-jgGHcmWKcYQypYSegYIAQgAEA4" jsuid="TVxFr_q" style="overflow: hidden; position: relative; border-radius: 16px 16px 0px 0px; width: 631.987px; height: 353.906px; outline: 0px;" tabindex="-1"><div class="RtAO3b" data-sfc-cp="" data-wiz-uids="TVxFr_t" jsaction="rcuQ6b:&TVxFr_s|npT2md" jscallback="gfNXHe:&TVxFr_p:U8wGUb" jscontroller="wMmv4c" jsuid="TVxFr_s" style="width: 631.987px; height: 353.906px;"><div class="nrdPJf" data-ved="2ahUKEwjh6_Sn_6KRAxVz-jgGHcmWKcYQtbEQegYIAQgAEA8" jsaction="click:&TVxFr_s|T2P31d" jsuid="TVxFr_t" role="button" style="cursor: pointer; width: 631.987px; height: 353.906px; outline: 0px;" tabindex="0"><div class="n7j80c YkW4Kb" jscontroller="ItMuwb" jsuid="TVxFr_u" style="z-index: 2; border-radius: 100px; bottom: 12px; height: 4px; left: 12px; position: absolute; width: calc(100% - 24px); --segment-bar-offset: 12px;"><div class="llCCib" style="transform: translateX(-50%); width: fit-content; align-items: center; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255); opacity: 0.85; border-radius: 100px; color: rgb(31, 31, 31); display: flex; flex-direction: row; font-size: 12px; gap: 4px; line-height: 1.33; padding: 2px 8px; position: absolute; top: -27px; white-space: nowrap; left: 42.5437px;"><svg fill="currentColor" height="12" viewbox="0 0 12 12" width="12" xmlns="http://www.w3.org/2000/svg"><path d="M3.5 2.7611V9.2386C3.5 9.77772 4.10085 10.0993 4.54942 9.80023L9.40755 6.56148C9.80832 6.2943 9.80832 5.70539 9.40755 5.43821L4.54942 2.19946C4.10085 1.90041 3.5 2.22198 3.5 2.7611Z"></path></svg>50s</div><div class="s3ITrd" style="background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255); opacity: 0.85; display: flex; height: 3.99375px; justify-content: center; position: absolute; z-index: 1; left: 36.4688px; width: 12.15px;"><div class="PoLW7d" style="position: absolute; border-left: 3.5px solid transparent; border-right: 3.5px solid transparent; border-top: 2.4px solid rgb(255, 255, 255); top: -7px;">  
</div></div></div><div class="dumoDb YkW4Kb" style="z-index: 2; background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0.6); border-radius: 100px; cursor: pointer; position: absolute; right: 14px; top: 12px;"><div class="CaQWce" jscontroller="sRLmTc" jsuid="TVxFr_v" style="align-items: center; color: rgb(255, 255, 255); display: flex; height: 20px; justify-content: center; transform: rotate(45deg); width: 20px;"><svg fill="currentColor" height="18px" viewbox="0 -960 960 960" width="18px" xmlns="http://www.w3.org/2000/svg"><path d="M480-120 300-300l58-58 122 122 122-122 58 58-180 180ZM358-598l-58-58 180-180 180 180-58 58-122-122-122 122Z" fill="currentColor"></path></svg></div></div></div></div></div><div>[<div class="RhEuY" style="display: flex; padding: 16px 12px 12px; gap: 8px; align-items: center;"><div class="SWvopd" jscontroller="aNJZAb" jsuid="TVxFr_w" style="height: fit-content; width: fit-content; margin-bottom: 2px; position: relative;"><div class="Lki2rc" style="width: 20px; height: 20px; line-height: 20px;"><div aria-hidden="true" class="U9BD8 Wsaimf QyEYne" jscontroller="Cky8Oc" jsuid="TVxFr_x" style="width: 19.9875px; height: 19.9875px; line-height: 16px; display: flex; flex-shrink: 0; align-items: center; justify-content: center; overflow: hidden; background-color: rgb(255, 255, 255); border-radius: 50%;">  
</div></div><div class="JccCTc xG6cCf" style="position: absolute; bottom: -4px; right: -4px; border-radius: 50%; line-height: 10px; padding: 2px; background-color: rgb(255, 255, 255); width: 10px; height: 10px;"><div aria-hidden="true" class="U9BD8 Wsaimf QyEYne" jscontroller="Cky8Oc" jsuid="TVxFr_y" style="width: 9.99375px; height: 9.99375px; line-height: 16px; display: flex; flex-shrink: 0; align-items: center; justify-content: center; overflow: hidden; background-color: rgb(255, 255, 255); border-radius: 50%;">  
</div></div></div><div><div class="SrjfCd" style="color: rgb(31, 31, 31); font-size: 12px; line-height: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">Tony Xhepa</div><div class="Pcl3Vd" style="color: rgb(31, 31, 31); letter-spacing: 0px; font-size: 11px; line-height: 13px;">YouTube • 29 Sept 2023</div></div></div>](https://www.youtube.com/watch?v=6c4jVLWmDYU&t=837)</div></div></div></div></div></div>- **<span style="font-variant: normal;"><span style="color: #0a0a0a;"><span style="font-family: Google Sans, Roboto, Arial, sans-serif;"><span style="font-size: medium;"><span style="letter-spacing: normal;"><span style="font-style: normal;">Accelerated development:</span></span></span></span></span></span>**<span style="font-variant: normal;"><span style="color: #0a0a0a;"><span style="font-family: Google Sans, Roboto, Arial, sans-serif;"><span style="font-size: medium;"><span style="letter-spacing: normal;"><span style="font-style: normal;"><span style="font-weight: normal;"> Filament provides a rapid way to build interfaces by handling much of the front-end development, including a modern and responsive user interface.</span></span></span></span></span></span></span>
- <a name="icQAxaaHvA_P04-EPya2msQw_8"></a>**<span style="font-variant: normal;"><span style="color: #0a0a0a;"><span style="font-family: Google Sans, Roboto, Arial, sans-serif;"><span style="font-size: medium;"><span style="letter-spacing: normal;"><span style="font-style: normal;">Comprehensive component library</span></span></span></span></span></span>**<span style="font-variant: normal;"><span style="color: #0a0a0a;"><span style="font-family: Google Sans, Roboto, Arial, sans-serif;"><span style="font-size: medium;"><span style="letter-spacing: normal;"><span style="font-style: normal;"><span style="font-weight: normal;">: It comes with a rich set of pre-built components for common needs like rendering tables with filters, creating forms, displaying dashboards, and sending notifications.</span></span></span></span></span></span></span>
- <a name="icQAxaaHvA_P04-EPya2msQw_9"></a> **<span style="font-variant: normal;"><span style="color: #0a0a0a;"><span style="font-family: Google Sans, Roboto, Arial, sans-serif;"><span style="font-size: medium;"><span style="letter-spacing: normal;"><span style="font-style: normal;">TALL stack foundation</span></span></span></span></span></span>**<span style="font-variant: normal;"><span style="color: #0a0a0a;"><span style="font-family: Google Sans, Roboto, Arial, sans-serif;"><span style="font-size: medium;"><span style="letter-spacing: normal;"><span style="font-style: normal;"><span style="font-weight: normal;">: Filament leverages the TALL stack, using Livewire for dynamic, reactive interfaces without custom JavaScript, Alpine.js for interactivity, and Tailwind CSS for styling.</span></span></span></span></span></span></span>
- <a name="icQAxaaHvA_P04-EPya2msQw_10"></a> **<span style="font-variant: normal;"><span style="color: #0a0a0a;"><span style="font-family: Google Sans, Roboto, Arial, sans-serif;"><span style="font-size: medium;"><span style="letter-spacing: normal;"><span style="font-style: normal;">Server-Driven UI (SDUI)</span></span></span></span></span></span>**<span style="font-variant: normal;"><span style="color: #0a0a0a;"><span style="font-family: Google Sans, Roboto, Arial, sans-serif;"><span style="font-size: medium;"><span style="letter-spacing: normal;"><span style="font-style: normal;"><span style="font-weight: normal;">: This approach means the UI is generated and driven by the server, allowing developers to build complex interfaces using PHP classes and configurations without writing a lot of custom HTML or JavaScript.</span></span></span></span></span></span></span>
- <a name="icQAxaaHvA_P04-EPya2msQw_11"></a> **<span style="font-variant: normal;"><span style="color: #0a0a0a;"><span style="font-family: Google Sans, Roboto, Arial, sans-serif;"><span style="font-size: medium;"><span style="letter-spacing: normal;"><span style="font-style: normal;">Resource-based approach</span></span></span></span></span></span>**<span style="font-variant: normal;"><span style="color: #0a0a0a;"><span style="font-family: Google Sans, Roboto, Arial, sans-serif;"><span style="font-size: medium;"><span style="letter-spacing: normal;"><span style="font-style: normal;"><span style="font-weight: normal;">: Filament uses a resource-based system, where each resource (like "Customer" or "Product") can have a corresponding admin interface for managing its data, which can be generated with a single command.</span></span></span></span></span></span></span>
- **<span style="font-variant: normal;"><span style="color: #0a0a0a;"><span style="font-family: Google Sans, Roboto, Arial, sans-serif;"><span style="font-size: medium;"><span style="letter-spacing: normal;"><span style="font-style: normal;">Extensive ecosystem</span></span></span></span></span></span>**<span style="font-variant: normal;"><span style="color: #0a0a0a;"><span style="font-family: Google Sans, Roboto, Arial, sans-serif;"><span style="font-size: medium;"><span style="letter-spacing: normal;"><span style="font-style: normal;"><span style="font-weight: normal;">: An ecosystem of official and third-party plugins is available to add extra functionality, such as media managers, relation managers, and user impersonation. </span></span></span></span></span></span></span>

<div class="Y3BBE" data-hveid="CAEIABAZ" data-sfc-cp="" id="bkmrk-this-video-provides-" jsaction="rcuQ6b:&TVxFr_1w|npT2md" jscontroller="zcfIf" jsuid="TVxFr_1w" style="font-family: 'Google Sans', Roboto, Arial, sans-serif; font-size: 16px; line-height: 24px; overflow-wrap: break-word; margin: 10px 0px 20px; color: rgb(10, 10, 10); font-weight: 400;">This video provides a quick 5-minute demo of Filament's features and capabilities: <div class="" data-wiz-uids="TVxFr_1y,TVxFr_1z" jscontroller="uDeH3" jsuid="TVxFr_1x"><div data-hveid="CAEIABAa" data-ved="2ahUKEwjh6_Sn_6KRAxVz-jgGHcmWKcYQ-bUQegYIAQgAEBo"><div><div class="Q2WBBe" jsuid="TVxFr_1z" style="container-type: inline-size; display: flex; flex-direction: column; background-color: rgb(243, 245, 246); margin-top: 12px; border-radius: 16px;"><div aria-label="" class="r0hyfc" data-animation-nesting="" data-ved="2ahUKEwjh6_Sn_6KRAxVz-jgGHcmWKcYQypYSegYIAQgAEBs" jsuid="TVxFr_1y" style="overflow: hidden; position: relative; border-radius: 16px 16px 0px 0px; width: 631.987px; height: 353.906px; outline: 0px;" tabindex="-1"><div class="RtAO3b" data-sfc-cp="" data-wiz-uids="TVxFr_21" jsaction="rcuQ6b:&TVxFr_20|npT2md" jscallback="gfNXHe:&TVxFr_1x:U8wGUb" jscontroller="wMmv4c" jsuid="TVxFr_20" style="width: 631.987px; height: 353.906px;"><div class="nrdPJf" data-ved="2ahUKEwjh6_Sn_6KRAxVz-jgGHcmWKcYQtbEQegYIAQgAEBw" jsaction="click:&TVxFr_20|T2P31d" jsuid="TVxFr_21" role="button" style="cursor: pointer; width: 631.987px; height: 353.906px; outline: 0px;" tabindex="0">![Related video thumbnail](https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcSIk_tJhgG5D9ooLKw4O7C2LOOqrgRu8lT0t9UfMwTEKYztlzJg)<div class="n7j80c YkW4Kb" jscontroller="ItMuwb" jsuid="TVxFr_23" style="z-index: 2; border-radius: 100px; bottom: 12px; height: 4px; left: 12px; position: absolute; width: calc(100% - 24px); --segment-bar-offset: 12px;"><div class="llCCib" style="transform: translateX(-50%); width: fit-content; align-items: center; background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255); opacity: 0.85; border-radius: 100px; color: rgb(31, 31, 31); display: flex; flex-direction: row; font-size: 12px; gap: 4px; line-height: 1.33; padding: 2px 8px; position: absolute; top: -27px; white-space: nowrap; left: 507.656px;"><svg fill="currentColor" height="12" viewbox="0 0 12 12" width="12" xmlns="http://www.w3.org/2000/svg"><path d="M3.5 2.7611V9.2386C3.5 9.77772 4.10085 10.0993 4.54942 9.80023L9.40755 6.56148C9.80832 6.2943 9.80832 5.70539 9.40755 5.43821L4.54942 2.19946C4.10085 1.90041 3.5 2.22198 3.5 2.7611Z"></path></svg>58s</div><div class="s3ITrd" style="background: none 0% 0% / auto repeat scroll padding-box border-box rgb(255, 255, 255); opacity: 0.85; display: flex; height: 3.99375px; justify-content: center; position: absolute; z-index: 1; left: 468.15px; width: 79.0312px;"><div class="PoLW7d" style="position: absolute; border-left: 3.5px solid transparent; border-right: 3.5px solid transparent; border-top: 2.4px solid rgb(255, 255, 255); top: -7px;">  
</div></div></div><div class="dumoDb YkW4Kb" style="z-index: 2; background: none 0% 0% / auto repeat scroll padding-box border-box rgba(0, 0, 0, 0.6); border-radius: 100px; cursor: pointer; position: absolute; right: 14px; top: 12px;"><div class="CaQWce" jscontroller="sRLmTc" jsuid="TVxFr_24" style="align-items: center; color: rgb(255, 255, 255); display: flex; height: 20px; justify-content: center; transform: rotate(45deg); width: 20px;"><svg fill="currentColor" height="18px" viewbox="0 -960 960 960" width="18px" xmlns="http://www.w3.org/2000/svg"><path d="M480-120 300-300l58-58 122 122 122-122 58 58-180 180ZM358-598l-58-58 180-180 180 180-58 58-122-122-122 122Z" fill="currentColor"></path></svg></div></div></div></div></div><div>[<div class="RhEuY" style="display: flex; padding: 16px 12px 12px; gap: 8px; align-items: center;"><div class="SWvopd" jscontroller="aNJZAb" jsuid="TVxFr_25" style="height: fit-content; width: fit-content; margin-bottom: 2px; position: relative;"><div class="Lki2rc" style="width: 20px; height: 20px; line-height: 20px;"><div aria-hidden="true" class="U9BD8 Wsaimf QyEYne" jscontroller="Cky8Oc" jsuid="TVxFr_26" style="width: 19.9875px; height: 19.9875px; line-height: 16px; display: flex; flex-shrink: 0; align-items: center; justify-content: center; overflow: hidden; background-color: rgb(255, 255, 255); border-radius: 50%;">  
</div></div><div class="JccCTc xG6cCf" style="position: absolute; bottom: -4px; right: -4px; border-radius: 50%; line-height: 10px; padding: 2px; background-color: rgb(255, 255, 255); width: 10px; height: 10px;"><div aria-hidden="true" class="U9BD8 Wsaimf QyEYne" jscontroller="Cky8Oc" jsuid="TVxFr_27" style="width: 9.99375px; height: 9.99375px; line-height: 16px; display: flex; flex-shrink: 0; align-items: center; justify-content: center; overflow: hidden; background-color: rgb(255, 255, 255); border-radius: 50%;">  
</div></div></div><div><div class="SrjfCd" style="color: rgb(31, 31, 31); font-size: 12px; line-height: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;">Laravel Daily</div><div class="Pcl3Vd" style="color: rgb(31, 31, 31); letter-spacing: 0px; font-size: 11px; line-height: 13px;">YouTube • 28 May 2024</div></div></div>](https://www.youtube.com/watch?v=tznw7lTblbY&t=363)</div></div></div></div></div></div>