Hello,

How to save coordinates as a point type ?

$table->geography('coordinates', subtype: 'point', srid: 4326)->nullable();

In the database there is only one field and I need to save the latitude and the longitude.

In a form, how to retrieve the coordinates ? Do I need 2 fields ? 1 field ? I really don't know how to do.

Do I have to cast the coordinates field as a JSON field with 2 properties : latitude and longitude ?

Thanks for your help.

V

I download the actual code no library:

That IS the library. It can have malware whether you install it via npm or manually.

In this case, attackers included a package install script to install the RAT. A direct download couldn't do that, but it could contain other malicious code.

Npm has an automatic audit for vulnerable versions, unlike direct downloads.

But how much damage was done, other servers could have been hit as well. Depending on how the malware was written.

That wasn't what I meant. This is a serious attack. My point was that there's nothing to wait for because the compromised versions were removed over 24 hours ago.

I have never even used NPM.

Ok, but the rest of the industry does. And you still use other package managers, such as Composer and, presumably, some Linux package manager. Those have suffered supply chain attacks just like this.

While these attacks are a nasty, in the real world you can't get away with a zero trust approach. You're relying on many layers of software just to run a web app. It takes vigilance.

The basic covered here is a solid start - https://laracasts.com/series/leveraging-ai-for-laravel-development

You are seeing something different for both examples, so I'm not sure where you got those examples.

@developer654079525 Yes, you can create additional files in the config directory.

Personally, I put any configuration for third-party services (like API keys etc) in the existing config/services.php file. But for opcodes, I would define an enum rather than putting it in a configuration file:

namespace App\Enumerations;

enum Opcode: int
{
    case Good = 0;
    case Bad = 1;
}

You could then reference the values using Opcode::Good or Opcode::Bad.

Use enums to define possible values like this.

Color theme for those looking to copy:

    --color-background: oklch(0.12 0 0);
    --color-foreground: oklch(0.95 0 0);
    --color-card: oklch(0.16 0 0);
    --color-primary: oklch(0.65 0.15 160);
    --color-primary-foreground: oklch(0.12 0 0);
    --color-border: oklch(0.24 0 0);
    --color-input: oklch(0.24 0 0);
    --color-muted-foreground: oklch(0.6 0 0);

Here are the full CSS component files for those looking to copy:

resources/css/components/btn.css

button {
    cursor: pointer;
}

.btn {
    background: var(--color-primary);
    border-radius: var(--radius-xl);
    color: var(--color-primary-foreground);
    padding-inline: calc(var(--spacing) * 3);
    font-size: var(--text-sm);
    font-weight: var(--font-weight-medium);
    cursor: pointer;
    height: calc(var(--spacing) * 8);
    line-height: calc(var(--spacing) * 8);
    display: inline-block;
}

.btn.btn-outlined {
    background: transparent;
    border: 1px solid var(--color-border);
    border-color: var(--color-border);
    color: var(--color-foreground);
}

.btn.btn-outlined:hover {
    background: color-mix(in srgb, black 25%, var(--color-input));
}

.btn.btn-ghost {
    background: transparent;
}

.btn:has(> svg) {
    display: flex;
    align-items: center;
    column-gap: calc(var(--spacing) * 2);
}

.btn:hover {
    background: color-mix(in srgb, black 10%, var(--color-primary));
    text-decoration: none;
}

resources/css/components/form.css

label {
    color: var(--color-foreground);
}

.input {
    border-radius: var(--radius-md);
    height: calc(var(--spacing) * 10);
    width: 100%;
    border-width: 1px;
    border-color: var(--color-border);
    padding: calc(var(--spacing) * 2) calc(var(--spacing) * 3);
    background-color: var(--color-card);
    color: var(--color-foreground);
    outline: 2px solid transparent;
    outline-offset: 2px;
}

.input::placeholder {
    color: var(--color-muted-foreground);
}

.input:focus-visible {
    outline: 0;
    box-shadow:
        0 0 0 calc(var(--spacing) * .5) var(--color-background)
        0 0 0 calc(var(--spacing) * 1) var(--color-primary);
}

@media (min-width: var(--breakpoint-md)) {
    .input {
        font-size: var(--text-sm);
    }
}

.textarea {
    border-radius: var(--radius-md);
    height: calc(var(--spacing) * 40);
    width: 100%;
    border-width: 1px;
    border-color: var(--color-border);
    padding: calc(var(--spacing) * 2) calc(var(--spacing) * 3);
    background-color: var(--color-card);
    color: var(--color-foreground);
    outline: 2px solid transparent;
    outline-offset: 2px;
}

.textarea::placeholder {
    color: var(--color-muted-foreground);
}

.textarea:focus-visible {
    outline: 0;
    box-shadow:
        0 0 0 calc(var(--spacing) * .5) var(--color-background)
        0 0 0 calc(var(--spacing) * 1) var(--color-primary);
}

.label {
    display: block;
    font-size: var(--text-sm);
}

input[type=file] {
    display: block;
    width: 100%;
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: var(--color-foreground);
}

input[type=file]::file-selector-button {
    margin-right: calc(var(--spacing) * 4);
    padding: calc(var(--spacing) * 2) calc(var(--spacing) * 4);
    border-radius: calc(var(--spacing) * 2);
    border-width: 0;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 500;
    background-color: var(--color-primary);
    color: rgb(var(--color-background));
}

input[type=file]::file-selector-button:hover {
    opacity: 0.9;
}

.error {
    font-size: var(--text-sm);
    color: var(--color-red-600);
}

.form-muted-icon {
    color: var(--color-muted-foreground);
}

.form-muted-icon:hover {
    color: var(--color-foreground);
}

@codeplumber Thank you!

The Laracast Watchlist does not show anything. I have Bookmarked ( Watchlisted ) bunch of videos yet there is nothing over here https://laracasts.com/series?watchlist=1

Is it a bug or I am doing something wrong.

Literally under video there is a button add to watchlist, which I have been using.

Love the simple actionable videos that are super beginner friendly. Just found a place where to use this in my code.

@sean2025 You're making lots of great points! I hope you enjoy your time on Laracasts. Lifetime license is an incredible value-for-money deal for sure. I was a Laracasts customer long time before I became an instructor :)

@kayschima Very glad to hear you're enjoying these! I'll gladly make more CSS-related videos, but I need to teach some Laravel as well! :)

@jlrdw, Do you remember which video?

Also notice how Jeffrey does refactoring in his videos, that has helped me a lot.

Looks like I need to find a different coder. Someone who can build a better version.

Why iframes? Why not render the components normally in the same document, so you don't have to do all that messy cross-window communication just to get the height right.

Speaking of which, this is pretty bad:

setTimeout(sendHeight, 10);
setTimeout(sendHeight, 50);
setTimeout(sendHeight, 100);
setTimeout(sendHeight, 200);

I'm guessing they resorted to hacks like this because they used the wrong observer and were getting poor results. They needed ResizeObserver, not MutationObserver.

Here is an example of component blade loaded via <iframe>

Here is the actual code for the blade

@props([
    'mainTitle' => 'Ready to Convert Your Garage?',
    'subtitle' => 'Get a quote from a local garage contractor.',
    'buttonText' => 'Get a Quote',
    'trust' => 'Licensed and Insured Specialist'
])

<div class="container cta-wrapper d-flex justify-content-center">
    <div class="cta-container position-relative">
        <div class="position-absolute cta-quote cta-quote-left">
            <x-icon-quote-left />
        </div>
        <div class="position-absolute cta-quote cta-quote-right">
            <x-icon-quote-right />
        </div>
        
        
        <div class="cta-inner text-center d-flex flex-column align-items-center">
            <h2 class="cta-main-title">{{ $mainTitle }}</h2>
            <p class="cta-subtitle">{{ $subtitle }}</p>
            
            <div class="cta-actions d-flex flex-column align-items-center">
                <a rel="nofollow" class="btn btn-border" href="#" data-toggle="modal" data-target="#enquireModal">{{ $buttonText ?? 'Get a Quote' }}</a>
                <p class="cta-trust">{{ $trust ?? 'Trusted by 100+ London homeowners.' }}</p>
            </div>
        </div>
    </div>
</div>

And here is a code that loads the iframe ( The coder might have used AI to generate this not sure )

@props([
    'title' => null,
    'description' => null,
    'path' => null,
    'defaultViewport' => 'desktop',
])

@php
    // Generate a unique ID for this preview
    $previewId = 'preview-' . uniqid();

    // Capture the slot content (already rendered HTML)
    $slotContent = $slot->toHtml();

    // Build the complete HTML document for the iframe
    $cssUrl = \Illuminate\Support\Facades\Vite::asset('resources/sass/app.scss');
    $jsUrl = \Illuminate\Support\Facades\Vite::asset('resources/js/app.js');

    $iframeHtml = <<<HTML
<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Component Preview</title>
    <link rel="stylesheet" href="{$cssUrl}">
    <style>
        body {
            margin: 0;
            padding: 0;
            background: #fff;
            overflow-x: hidden;
        }
        .container-fluid {
            padding-right: 0 !important;
            padding-left: 0 !important;
            max-width: none !important;
        }
        .container {
            max-width: none !important;
            width: 100% !important;
        }
    </style>
</head>
<body>
    {$slotContent}
    <script src="{$jsUrl}"></script>
    <script>
        let lastHeight = 0;
        function sendHeight() {
            const height = Math.max(
                document.body.scrollHeight,
                document.body.offsetHeight,
                document.documentElement.scrollHeight,
                document.documentElement.offsetHeight
            );
            if (height !== lastHeight && height > 0) {
                lastHeight = height;
                window.parent.postMessage({ type: 'resize', height: height }, '*');
            }
        }

        function forceRecalc() {
            lastHeight = 0;
            setTimeout(sendHeight, 10);
            setTimeout(sendHeight, 50);
            setTimeout(sendHeight, 100);
            setTimeout(sendHeight, 200);
        }

        window.addEventListener('load', forceRecalc);

        window.addEventListener('message', function(e) {
            if (e.data && e.data.type === 'recalcHeight') {
                forceRecalc();
            }
        });

        document.querySelectorAll('img').forEach(img => {
            if (!img.complete) {
                img.addEventListener('load', sendHeight);
            }
        });

        const observer = new MutationObserver(function() {
            setTimeout(sendHeight, 100);
        });

        observer.observe(document.body, {
            childList: true,
            subtree: true,
            attributes: true
        });

        setTimeout(sendHeight, 100);
        setTimeout(sendHeight, 300);
        setTimeout(sendHeight, 600);
        setTimeout(sendHeight, 1000);
        setTimeout(sendHeight, 2000);
    </script>
</body>
</html>
HTML;
@endphp

<div class="component-preview">
    <div class="component-preview__header">
        <div>
            @if($title)
                <h3 class="component-preview__title">{{ $title }}</h3>
            @endif
            @if($description)
                <p class="component-preview__description">{{ $description }}</p>
            @endif
            @if($path)
                <span class="component-preview__path">{{ $path }}</span>
            @endif
        </div>
        @include('docs.partials.viewport-switcher', ['default' => $defaultViewport])
    </div>
    <div class="component-preview__frame component-preview__frame--{{ $defaultViewport }}">
        <div class="component-preview__iframe-wrapper">
            <iframe id="{{ $previewId }}" class="component-preview__iframe" loading="lazy" srcdoc="{{ $iframeHtml }}"></iframe>
        </div>
    </div>
</div>

I remember when I started out these doc were super confusing hence probably why the question. I do follow them now and find super helpful just not convince it beginner friendly. There is certainly an art to read and understand those docs.

After all hence Laracasts exist.

We have numerous Blade Components e.g. Someone built a local Dashboard example.

• Trust Budges

• Logos section e.g. As seen in etc

• 5 Star Review

• Single Testimonial

• Multiple Testimonial

• Featured Project

• Latest Projects

• 5 Col block

• 4 Col block

• 2 Col image Block with 4 col text

I needed help so hired someone. Now I am not convince that the current attempt is the right direction/approach.

Each Blade component loads via iframe.

A general-purpose visual library might be difficult to implement. A dropdown menu is very different from a button, dashboard sidebar, or accordion. You could create a demo page, but it would have to be manually crafted based on what you want to showcase.

I'd probably just write UI design guidelines and include information about available components with visual examples.

P.S. Bootstrap 4 is quite old by now. I recommend migrating to version 5 at some point. Migration was pretty easy from what I remember: mostly just new features and some renamed classes.

AI generated summary is fine, but why are there zero links? Videos like this should have a description that includes all links mentioned in the video imho

• https://www.pinterest.com/
• https://muz.li/ (not muesli like the AI summary suggested)
• https://onepagelove.com/
• https://land-book.com/
• https://www.producthunt.com/
• https://dribbble.com/

What is the recommended approach to maintain custom built UI components and be able to show available UI components to the designer to build/ improve a page upon those available resources?

What are your approaches ?

Currently all features/component I construct from top of my head, non visual. I just find them in the app. ( Non scalable )

I am thinking of building a visual representation UI Library.

The website initially was built on HTML. Then a coder converted to Laravel. I took over and built upon it with my best understand as a Non Laravel developer. Soon realising without this visual library it get inconsistent design elements.

Each component is built on HTML using Bootstrap 4.

Essentially I want to build a brand guidelines along with UI Library so I can pass it to a coder / designer and they understand what we already have. Any suggestions?

I like to look after my will and excitement which helps to stay consistent with my learning.

One way you can prolong your excitement is to work on things that are useful to you in that given moment.

For example on Episode 4 in Laravel from Scratch I learned about @props. So naturally I went in my app and started to use them.

Once you start seeing evidence in your progress/results it helps with your morale.

If you're new to Laravel, then the best recommendation is to work through the Laravel from Scratch course here on Laracasts. Further tutorials are available on Laravel's own website.

Both will give you a guided introduction to the framework. For now, try to write code to make (and break) your application yourself - do not lean on AI - so that you understand how the code works.

Then you can level up by following the The Laravel Path available here on Laracasts also.

Good luck!

I already know about the validation.php that holds all the default error messages for form inputs. But I also noticed there are other files with validation.php; auth.php, pagination.php, and passwords.php. How can I make Laravel use these messages as defaults?

In case anyone watches this and gets confused — Claude have announced that Commands have been merged with Skills in version 2.1.3. https://code.claude.com/docs/en/changelog#213

What I don't seem to understand is, when you remove the hardcoded title from the html, and instead go for a more 'dynamic' approach - you just hard code it somewhere else. We still have to type the title in the x-layout parameter, so i don't see it being much different to have the title in the tag. If anyone could clear this up for me, that would be great!

This post is very old, the best is that you create your own post.

I have a similar question for my situation.

@bwata Then post your own question instead of bumping a 10-month old topic?

For anyone encountering the same issue, and for future reference:

I ran into this problem on an Ubuntu 24.04 server provisioned through Forge.

I was able to resolve it by loosening the AppArmor restrictions using the following commands:

sudo sysctl -w kernel.apparmor_restrict_unprivileged_userns=0
sudo sysctl -w kernel.apparmor_restrict_unprivileged_unconfined=0

No it's not possible.

By default a user needs to be authenticated to access a private channel.

https://laravel.com/docs/12.x/broadcasting#concept-overview

Events are broadcast over "channels", which may be specified as public or private. Any visitor to your application may subscribe to a public channel without any authentication or authorization; however, in order to subscribe to a private channel, a user must be authenticated and authorized to listen on that channel.

After watching this lessons and comparing it to countless similar tutorials on other platforms, I'm once again convinced that Jeffrey is undoubtedly the best presenter. Not only for his explanations, but also for his ability to blend the old and the new and truly demonstrate how the past and future complement each other. I'm amazed.

Thank you, thank you so much.

This is where I feel every penny of my subscription is worth it. 😄

Please be careful! I was attacked with a similar pattern and the attacker gained remote execution, the attacker used these CVEs

1. GHSA-29cq-5w36-x7w3
2. CVE-2024-47823 search them online to understand!

Please scan your files and your VPS for aunothorized access or files: do these immedietly:

1. scan for any directory with name: ALPHA_DATA
2. check your cron tab (under the user running the web server) for any payload.
3. check for access logs and current active connections from these bot IPs: 45.148.244.66,23.94.95.228,182.255.1.186,210.57.216.4
4. check for any process with name '[ksmd]' that is NOT running as 'root' user
5. check for processes with name 'defunc'

If you find anomalies i recommend you scrap the whole VPS and buy new one.

I wonder if commands are still relevant given that the official docs now state:

Custom slash commands have been merged into skills. A file at .claude/commands/review.md and a skill at .claude/skills/review/SKILL.md both create /review and work the same way. Your existing .claude/commands/ files keep working. Skills add optional features: a directory for supporting files, frontmatter to control whether you or Claude invokes them, and the ability for Claude to load them automatically when relevant.

@in4s Claude Code is simply installed as a CLI tool and usually is just executed by calling "claude". Anthropic provides a Beta Claude Code extension for IntelliJ based IDEs, but it doesn't come with the claude CLI itself. So installing it manually is a must.

I run a multiple thing. Some days I can’t find the joy in coding so I go and do Marketing or Operation / management side. The life is certainly more interesting when you find a way/path that allows you to choose what you like to do instead what you been given/told.

6 years as an employee and every single request I've made here has been denied. Just a number to them. The death of a passionate, dreamer programmer.

Nice one Lary! Thank you :)

Version 24.10 is no longer supported, and Ondřej's repository doesn't have packages for it.

I recommend always using LTS (Long-Term Support) versions of distributions. In this case it would be Ubuntu 24.04.

I have no understanding how PHP works. Neither Ubuntu.

Yet Laravel Boost helped me to updated from php 8.1 to 8.2.

You can start with a prompt like this:

Help me migrate from php 8.1 to php 8.4

I fed the Laravel Boost via Custom Guideline what are my server stack and the version of Ubuntu etc.

With the Laravel Boost + Custom Guideline I find it much better than ChatGPT I do not have to repeat my self the next day or month later.

The AI proceeded to advice me what I need to do before switching to php 8.2.

e.g. update this packages, do this otherwise it will break your app before switching. Many of that was done by Laravel Boost, I just clicked Yes, Yes, Yes. Crazy times.

Now we move to Server side.

AI gave me server codes. I run them. Got some server errors, fed them to Laravel Boost / AI ( inside VS code) . AI revised what are the next step to do.

We end up with installing php 8.2 for Laravel site and left 8.1 for Wordpress site on the same Server. All was only possible due AI . Again I have no clue how to do any of this without AI.

That deep, I have no clue if someone is attacking my app. In past I have hired someone to look into my app. I guest it time to review the security with some of the Laracast Courses

You don't see attacks doesn't mean there are no attacks :)

Try updating from time to time especially if you run your app on a shared hosting.

Quick PSA. Be very, very careful if you intend to install this on your primary machine.

Ideally, opt for a dedicated old laptop or VPS.

@jeffreyway If there would be a way that whiles I work in VS Code / Copilot / Laravel Boost / AI notices that I struggle to understand Variables. It a Perfect opportunity to suggest one of your Laracasts videos.

Whiles migrating to Laravel 12. I often highlight a code and ask what it is. Is it best practices etc... Literally, I am ready and want to learn about this thing so perfect opportunity to suggest one of your videos that address that exact thing.

Let say AI detect that I have outdated Forms. Somewhere perhaps inside VS Code AI assistant suggest to upgrade and here is how @jeffreyway does it. etc. Yes AI can do for you. Most of times you want to understand if what AI spits out is safe. Especially on client website. So for those who have no clue what AI does the video suggestion would be nice.

This is more of learning based on what you are currently building. So you solve your pressing problem as you are learning. That how I learned Python, HTML, CSS and now learning Laravel.

You don't see attacks doesn't mean there are no attacks :)

@timgavin Agreed. We're working on this now.

I think both, Laravel first then PHP, because they're many concept in Laravel I didn't get it until I learnt PHP, but Laravel is way better to learn and easy than PHP I think.

Not everyone learns the same way. Not everyone has the same goal.

Some linear start to end. Other learn bits that needed. E.g has an existing problem and need to solve it.

They learn the bit that requires at give moment. E.g I knew HTML and CSS. External developer built Laravel website. So I needed to migrate and able to work on it day one.

Whiles on Laravel most were still on HTML. Over months/years i gradualy converted to blades instaled new features as I learned something new.

There is always an option to hire a Developer to double check if everything is fine.

Y'es it's in my list above ;).

Just tested this one, it's really great ;).

whitecube/laravel-cookie-consent

If you have used one of the other packages, please shared your experience with them.

For the moment, I keep using the whitecube package, it's full customizable and really very very easy to use, to configure, to style, ...

And if I have a look at the code, it's a good example to develop my own cookie manager.