- 49
- 111 817
code with SJM
Tanzania
เข้าร่วมเมื่อ 20 ธ.ค. 2020
Hey there. Welcome to Code with SJM, Here we are going to learn how to code and do real life programming problem solving. Here we'll learn PHP, Laravel, Livewire, JavaScript(jQuery & Alpine Js), Databases(MySQL & PostgreSQL) and API's.
Build and Deploy Your First Laravel 11 API | Step-by-Step Beginner Guide
🌐 Get Hosting for Your Laravel Projects:
Use my referral link to get a discount: hostinger.com?REFERRALCODE=1SHADRACK05
In this tutorial, I'll walk you through building and deploying your very first Laravel 11 API from scratch. Whether you're a beginner or looking to refresh your skills, this step-by-step guide will help you understand the basics of setting up a Laravel API, creating endpoints, and deploying your project for real-world use. By the end of this video, you'll be equipped to build scalable APIs using Laravel 11 with confidence.
🔍 Topics Covered:
- Setting up a Laravel 11 project
- Configuring routes and controllers
- User Authentication and authorization
- Creating API endpoints
- Blog API Development
- Deploying your Laravel API
Timestamps:
0:00 introduction to API
9:32 Setting up development environment and project
19:33 User Authentication and authorization
1:13:25 Blog API Development
2:44:53 Deployment
💻 Related Videos:
- Hosting Your First Laravel 11 & TALL Stack Application
th-cam.com/video/SKGS0LhaNbQ/w-d-xo.html
🌐 Get Hosting for Your Laravel Projects:
Use my referral link to get a discount: hostinger.com?REFERRALCODE=1SHADRACK05
Don't forget to like, share, and subscribe for more coding tutorials!
Use my referral link to get a discount: hostinger.com?REFERRALCODE=1SHADRACK05
In this tutorial, I'll walk you through building and deploying your very first Laravel 11 API from scratch. Whether you're a beginner or looking to refresh your skills, this step-by-step guide will help you understand the basics of setting up a Laravel API, creating endpoints, and deploying your project for real-world use. By the end of this video, you'll be equipped to build scalable APIs using Laravel 11 with confidence.
🔍 Topics Covered:
- Setting up a Laravel 11 project
- Configuring routes and controllers
- User Authentication and authorization
- Creating API endpoints
- Blog API Development
- Deploying your Laravel API
Timestamps:
0:00 introduction to API
9:32 Setting up development environment and project
19:33 User Authentication and authorization
1:13:25 Blog API Development
2:44:53 Deployment
💻 Related Videos:
- Hosting Your First Laravel 11 & TALL Stack Application
th-cam.com/video/SKGS0LhaNbQ/w-d-xo.html
🌐 Get Hosting for Your Laravel Projects:
Use my referral link to get a discount: hostinger.com?REFERRALCODE=1SHADRACK05
Don't forget to like, share, and subscribe for more coding tutorials!
มุมมอง: 3 410
วีดีโอ
Build and deploy your first Laravel 11 & TALL stack application | 2024 guide
มุมมอง 827หลายเดือนก่อน
Use this link to buy your first Hosting plan from Hostinger to get a 20% discount hostinger.com?REFERRALCODE=1SHADRACK05 In this tutorial, we'll walk you through the step-by-step process of deploying a TALL stack application (Laravel, Alpine.js, Livewire, and Tailwind CSS) on a shared hosting platform like Hostinger. You'll learn how to set up your hosting environment, configure your database, ...
Building a CRUD App with Laravel 11 and React JS & Authentication
มุมมอง 2.7K3 หลายเดือนก่อน
In this comprehensive tutorial, we'll guide you through building a full-stack web application using Laravel 11, React.js, and Inertia.js. You'll learn how to seamlessly integrate Laravel's powerful backend with React's dynamic frontend using Inertia.js, enabling you to create a single-page application (SPA) without the complexity of managing a separate frontend. We'll cover everything from sett...
Build a Full stack Minimal E-commerce Application with Laravel 11 and Livewire 3 | TALL Stack
มุมมอง 10K3 หลายเดือนก่อน
🖐🖐Source code, Here you"ll find two branches in my repo so I recommend to use the auth-breeze branch (link #1). Since it resolves the issue of slowness of the application which was caused by devdojo auth package: 1. github.com/shadrackjm/minimal-ecommerce-tall-stack 2. github.com/shadrackjm/minimal-ecommerce-tall-stack/tree/auth-breeze Use this link to buy your first Hosting plan from Hostinger...
Laravel Authentication Made Easy: DevDojo Auth Package Explained | Multi Role authentication
มุมมอง 5854 หลายเดือนก่อน
Struggling to create a secure and user-friendly login, registration, and password reset experience for your Laravel application? Look no further than the DevDojo Auth package! DevDojo Auth is an open-source package that makes adding authentication to your Laravel app a breeze. In this video, we'll explore what DevDojo Auth is and dive into its 3 most important features: Easy Installation & Cust...
Build a Doctor - Patient Live Consultation App | ZEGOCLOUD Video Call | Ready-Made UI Kits
มุมมอง 1684 หลายเดือนก่อน
· Get 10000 free mins with UIKits: bit.ly/3LbzGzO · Learn more about ZEGOCLOUD: bit.ly/3XKO2P9 · 100% customized video call SDK: bit.ly/45P9FzO · How to build a video call App: bit.ly/45K4d1n #zegocloud #videocall #webrtc #sdk #api Welcome back to my channel! In this video, I'll show you how to easily integrate ZEGOCLOUD's Video Call Service into your app using their ready-made UI kits. ZEGOCLO...
Build a full stack Doctor Appointment Booking App | TALL stack | part 2
มุมมอง 1.9K4 หลายเดือนก่อน
Welcome to "Creating a Doctor Appointment Booking System using Laravel 11, Livewire 3, Breeze, and Preline UI." This comprehensive course is designed for web developers who want to build a dynamic and responsive doctor appointment booking system from scratch. Leveraging the powerful Laravel 11 framework, the interactive capabilities of Livewire 3, the streamlined authentication provided by Bree...
Build a full stack Doctor Appointment Booking App | TALL stack | part 1
มุมมอง 6K5 หลายเดือนก่อน
Welcome to "Creating a Doctor Appointment Booking System using Laravel 11, Livewire 3, Breeze, and Preline UI." This comprehensive course is designed for web developers who want to build a dynamic and responsive doctor appointment booking system from scratch. Leveraging the powerful Laravel 11 framework, the interactive capabilities of Livewire 3, the streamlined authentication provided by Bree...
Build a DataTable from Scratch! in Laravel 11 & Livewire 3 | EASY | DON'T USE A PACKAGE FOR THIS😎
มุมมอง 1K5 หลายเดือนก่อน
Welcome to our step-by-step tutorial on creating a dynamic data table using Laravel 11 and Livewire 3! In this video, we'll guide you through the entire process of setting up a powerful, interactive data table that will enhance your web applications. 📌 *What You'll Learn*: Introduction to Laravel 11 and Livewire 3. Setting up your development environment. Creating a Livewire component. Building...
Laravel 11 CRUD with Image Upload | Complete beginners Guide.
มุมมอง 1.7K5 หลายเดือนก่อน
Welcome to the comprehensive guide on mastering CRUD operations with image uploads in Laravel 11! In this video, Iwill take you through a step-by-step process to build a full-featured CRUD application, including the ability to upload images, all within the Laravel 11 framework. Whether you're a beginner or an experienced developer, this tutorial is designed to provide you with the knowledge and...
Creating a Blog Application With Laravel 11 and Livewire 3 | Show number of followers | final
มุมมอง 9836 หลายเดือนก่อน
Welcome to the ultimate Laravel 11 & Livewire 3 tutorial series! In this comprehensive video tutorial, we'll guide you step-by-step through building a powerful Blog Application from scratch. Whether you're a seasoned developer looking to enhance your Laravel skills or a newcomer eager to dive into the world of web development, this tutorial is perfect for you. Throughout this series, we'll cove...
Creating a Blog Application With Laravel 11 and Livewire 3 | Show more posts from author | part 10
มุมมอง 4716 หลายเดือนก่อน
Welcome to the ultimate Laravel 11 & Livewire 3 tutorial series! In this comprehensive video tutorial, we'll guide you step-by-step through building a powerful Blog Application from scratch. Whether you're a seasoned developer looking to enhance your Laravel skills or a newcomer eager to dive into the world of web development, this tutorial is perfect for you. Throughout this series, we'll cove...
Creating a Blog Application With Laravel 11 and Livewire 3 | Show user Profile on a post | part 9
มุมมอง 3966 หลายเดือนก่อน
Welcome to the ultimate Laravel 11 & Livewire 3 tutorial series! In this comprehensive video tutorial, we'll guide you step-by-step through building a powerful Blog Application from scratch. Whether you're a seasoned developer looking to enhance your Laravel skills or a newcomer eager to dive into the world of web development, this tutorial is perfect for you. Throughout this series, we'll cove...
Creating a Realtime Chat App in Laravel 11 | Messages Publishing & Receiving using Ably | part 4
มุมมอง 5426 หลายเดือนก่อน
Creating a Realtime Chat App in Laravel 11 | Messages Publishing & Receiving using Ably | part 4
Laravel 11 CRUD Tutorial: Master Create, Read, Update, Delete Operations - 2024 beginners guide.
มุมมอง 19K6 หลายเดือนก่อน
Laravel 11 CRUD Tutorial: Master Create, Read, Update, Delete Operations - 2024 beginners guide.
Creating a Blog Application With Laravel 11 and Livewire 3 | User Profile management | part 8
มุมมอง 4486 หลายเดือนก่อน
Creating a Blog Application With Laravel 11 and Livewire 3 | User Profile management | part 8
Implement Email Verification in Laravel 11
มุมมอง 1.3K6 หลายเดือนก่อน
Implement Email Verification in Laravel 11
Creating a Blog Application With Laravel 11 and Livewire 3 | Follow & unfollow module | part 7
มุมมอง 3056 หลายเดือนก่อน
Creating a Blog Application With Laravel 11 and Livewire 3 | Follow & unfollow module | part 7
Creating a Realtime Chat App in Laravel 11 & Ably | Creating Private Channels | part 3
มุมมอง 3K6 หลายเดือนก่อน
Creating a Realtime Chat App in Laravel 11 & Ably | Creating Private Channels | part 3
Creating a Blog Application With Laravel 11 and Livewire 3 | Comment module | part 6
มุมมอง 3786 หลายเดือนก่อน
Creating a Blog Application With Laravel 11 and Livewire 3 | Comment module | part 6
Creating a Realtime Chat App in Laravel 11 & Ably | Chatting UI setup | Preline UI | part 2
มุมมอง 4916 หลายเดือนก่อน
Creating a Realtime Chat App in Laravel 11 & Ably | Chatting UI setup | Preline UI | part 2
Creating a Blog Application With Laravel 11 and Livewire 3 | Like & Unlike posts | part 5
มุมมอง 4596 หลายเดือนก่อน
Creating a Blog Application With Laravel 11 and Livewire 3 | Like & Unlike posts | part 5
Creating a Blog Application With Laravel 11 and Livewire 3 | Post viewing by other users | part 4
มุมมอง 5426 หลายเดือนก่อน
Creating a Blog Application With Laravel 11 and Livewire 3 | Post viewing by other users | part 4
Creating a Realtime Chat App in Laravel 11 & Ably | Breeze auth | project setup | part 1
มุมมอง 5696 หลายเดือนก่อน
Creating a Realtime Chat App in Laravel 11 & Ably | Breeze auth | project setup | part 1
Creating a Realtime Chat App in Laravel 11 & Ably | Breeze | Intermediate Level | Demo
มุมมอง 7216 หลายเดือนก่อน
Creating a Realtime Chat App in Laravel 11 & Ably | Breeze | Intermediate Level | Demo
Creating a Blog Application With Laravel 11 and Livewire 3 | CRUD on Post | Post Management | part 3
มุมมอง 6306 หลายเดือนก่อน
Creating a Blog Application With Laravel 11 and Livewire 3 | CRUD on Post | Post Management | part 3
Creating a Blog Application With Laravel 11 and Livewire 3 | Dashboard | Post Management | part 2
มุมมอง 1.3K6 หลายเดือนก่อน
Creating a Blog Application With Laravel 11 and Livewire 3 | Dashboard | Post Management | part 2
Creating a Blog Application With Laravel 11 and Livewire 3 | Multiauth | Role Based auth | part 1
มุมมอง 3.2K7 หลายเดือนก่อน
Creating a Blog Application With Laravel 11 and Livewire 3 | Multiauth | Role Based auth | part 1
Build a Blog Application With Laravel 11 and Livewire 3 | Demo | Beginners
มุมมอง 7K7 หลายเดือนก่อน
Build a Blog Application With Laravel 11 and Livewire 3 | Demo | Beginners
Sending Messages Notification (SMS) from your Laravel 11 using Infobip SMS gateway
มุมมอง 2.3K7 หลายเดือนก่อน
Sending Messages Notification (SMS) from your Laravel 11 using Infobip SMS gateway
why this doesnt work in mine? :( <?php namespace App\Http\Livewire; use App\Models\User; use Livewire\Component; class UsersTable extends Component { public function render() { return view('livewire.users-table',[ 'users' => User::all() ]); } } <tbody class="divide-y divide-gray-200 dark:divide-neutral-700"> <div> <div> @foreach ($users as $user) {{ $user->complete_name }} @endforeach </div> </div> </tbody> here's the error Undefined variable $users
hoping to get some answers
Hi, from the code you provided it looks good, but have you tried to use a public property? instead of passing the list of users directly you can just use mount function to assign it to the public property and then see if still get an error. Please if still get the same error we can communicate so we can have a session to check it together.
@@codewithSJM good day, yes I tried the mount function but it still didn't work. I'm working with my capstone and studying this at the same time. I would really appreciate any help, thank you 🙏😊
@@EmmaChavez-l8t can you check me on whatsapp or email? Both found in my channel description. Thanks
Undefined method 'layout'.intelephense(P1013) Undefined method 'user'.intelephense(P1013) i have these undefined error in AdminDashboard.php and AdminMiddleware.php whats the problem here?
If I'm not mistaken these are just errors shown by intelphese extension and they have nothing to stop code from running. So by saying so, Is your project running with these errors? if so no problem, if project breaks please we can have a session to have a look on that.
hello good day, how can I find that @csrf. there is no @csrf choices when I type cs. please help❤
Hello, You need to install the extension for laravel snippets. I will give you all my extensions I am using in my vscode editor - Laravel Blade snippets - Laravel go to - PHP (all in one) these may help to boost Laravel development
How to secure api endpoint anyone can access that using postman or curl how can we secure it make a video on that
Good question, I will create another one advanced one that will cover all these features. Thanks for the query.
@codewithSJM 😊 thank you sir ❤️
hello, I'm stuck about pagination and multiselect can you help me a bit
@@xdd2k3 yeah sure can we arrange a meeting to do so? Check me whatsapp 255624748387
@@codewithSJM I just sent you a message and got banned right after, how can I contact you
Ooh sorry for that, just send me an email through this email address shadrackmballah80@gmail.com
But why got banned??🤔
@@codewithSJM idk, i just send a mess and got ban 24hs
do u have a tutorial on how to add product using Modal?
sorry what do you mean please?
@codewithSJM sir do u have video on how to use Modal from bootsrap in laravel11 crud?
No! I do not have at the moment may be later on. But you can try using jquery and bootstrap you can achieve this and it is very straight forward if you never used jquery please see this videos here Laravel 10 CRUD Tutorial - AJAX with full validations: th-cam.com/play/PLdj_kazFZvywr0hAKESmAVjPRwJGQ_Z_c.html
the tutorial is great..its much better if you have voice.. thanks
Sorry for that, now all my tutorials have voice!
can you laravel passport for auth in laravel11 please
Yeah, sure. I'll share when ready.
@@codewithSJM awesome looking forward to it
help me! img is saved in storage/app/private/public when I create and I cant show img.
Yeah, that can only be resolved by going to your .env file and change this variable value FILESYSTEM_DISK=public from local to public and then you should be able to store files in public directory where you can access them easily. then you can use either asset() function or Storage::url()
@@codewithSJM tkanks a lot, it's work
Glad to hear it helps!😊 Thanks too for asking.
Hey, when i was done fill my pasword and confirm password, a pop up show that "Class "Illuminate\Support\Facedes\Hash" not found" But i copy your code, but it still wrong, how to fix it 😭
Can you make sure that you imported the right class and basically make sure the path is correctly referenced. I can see on your comment you wrote "Illuminate\Support\Facedes..." which is wrong it is Facades not Facedes. Can you please have a look on that and if it fails again, You can check me on WhatsApp and we can see a way to resolve this issue. Thank you
jazakallah hu khoiron
Thanks man
Why didnt you use SPA with livewire?
I have used it in most of the pages by adding the 'wire:navigate' attribute in my links
@@codewithSJM Is it count as SPA? As far as I know you didnt need route and the page didnt reload, because its single page. I havent finished watching your video yet thoug
@HilmiN In livewire routes is needed and you just need to add livewire components directly in your routes. By adding wire:navigate it bring the SPA functionality as the page will not fully refreshed just the updated part of the page. This is explained in livewire official website.
@@codewithSJM Ok, thanks bro..
@@codewithSJM I see.. thanks man
hi. I already downloaded your project from source code. but after I php artisan serve, it shows 404 Not Found. why?
After that you need to run this command in your terminal 1.composer install 2.php artisan key:generate Then copy your .env.example file data and create a new .env file in your project root directory, then paste the data you copied from .env.example Now you can run php artisan serve
speak while coding
Just check my latest videos that I speak 👍
Thanks for sharing this very insightful video please I have a question How can i make use of swagger for my API documentation in this project
You can use this article as a starting point my friend : medium.com/@mark.tabletpc/set-up-laravel-with-swagger-for-comprehensive-api-documentation-step-by-step-instructions-d30552ca8051
what extension you used for your vscode?
I used Thunder Client for API testing but you can also install postman for vscode extension, it is also available!
@@codewithSJM i mean for developing laravel ♥ im using postman and and thunder also
Ooh Great I have couple of them, as listed below 1.IntelliPHP 2.Laravel blade snippets 3.Laravel goto view 4. Laravel intelphese 5.PHP (all in one) 6.Composer 7.vscode icons But you may not want to intall all of them you can opt to leave the ones that do the same thing like intelliPHP , you can opt just to use PHP all in one
@@codewithSJM thank you very much +1 subs
Thanks!🙏
Thanks for sharing such valuable information! I have a quick question: I have a SafePal wallet with USDT, and I have the seed phrase. (alarm fetch churn bridge exercise tape speak race clerk couch crater letter). How can I transfer them to Binance?
I'm sorry! not sure! if I know any of what you are asking my friend! it'll be good if you'll seek assistance from someone who has used safePal before!🙏
como se sube un proyecto laravel 11 y livewire 3 en un hosting compartido?
Here is the video I shared recently showing how to upload it to shared hosting: th-cam.com/video/SKGS0LhaNbQ/w-d-xo.html
I am lost about AUTHENTICATION. Do you use Breeze or DevDojo ?
Both that's why I provided the repo with two branches, one for devdojo and other one for breeze
Do you have videos on how to code with Alpinejs tutorial for beginners? share link. Thanks.
Not yet! But I will do ASAP
Thanks
Welcome
no github repository error
what do you mean ? what are you trying to access? if it is the gituhb repo use the link github.com/shadrackjm/Laravel-React-app-crud-auth
Please sir, I have a code that can't display photos, when I check it the photos should go to the public storage folder then photos, but when I check it turns out it goes to private photos storage, is there a solution? I need a solution as soon as possible.
Yeah a solution is you need to specify the disk you need to put your file which should be public in your case. So go to filesystem.php and see the two disks. Here is how you'll store it in public disk --> Storage::disk('public')->put($filename); Remember to create a symlink first. If by any chance you fail to do it please check me on whatsapp my number on channel description.
@@codewithSJM thank you very much for the solution
please upload course Laravel with flutter project
Thanks for the query. I will do that. And when the video will be uploaded I will let you know here in comment section. I'll pin the video link
@@codewithSJM That flutter tutorial should be using this Doctor Appointment Booking App built with laravel but now for flutter (multiplatform app using Laravel and Flutter)
Terima kasih bro form Indonesia🇮🇩
@@nasrulwalid2603 thanks your welcome!
please record course laravel 11 and livewire and alpine js . for single dashboard ecommerc .please record ❤❤❤❤❤
@mehdi_abik i think you can see this video here th-cam.com/video/NDwPC78LUJc/w-d-xo.html it is for ecommerce also, but if it will not fit what you expect I'll look on it and do the one you suggest.
please make a sms receiving video 🙁
Sorry! that is not a normal way a SMS notification feature works, though if you want to send and receive messages you can implement a chat system as done in this video of mine: th-cam.com/play/PLdj_kazFZvyy_sOgfBwzIfPLWKhYStqpT.html I bet you wanted something like that. but you can ask me for anything if you feel this explanation is not enough.
hi, I cannot get the storage location correct using storage:link I used the config/filesystem.php from the source code. recreated the symlink several times The location for uploaded photos is storage/app/public/storage Images do not show up when using 'my-posts.blade: <td><img height="40px" width="40px" src="{{ asset("anything I use here does not work?)}}" /' .$item->photo) }}" alt="post image"></td> not sure how t dd() blade file so I can see value of asset() location? Thanks
Hi Thanks for the question! can we have a meeting to resolve this? check me on my WhatsApp so we can schedule the meeting! this way we can do it quickly
I got it to work!
That's great!
Thank you brother
Thank you too
Can you make a video on how we can deploy TALL stack in production to internet.
Yeah I will. I was lacking fund to do that. But I will do it for sure.
I have uploaded video on how to deploy the TALL stack app on internet here is the link: th-cam.com/video/SKGS0LhaNbQ/w-d-xo.html
in dashboard it delivery rate is 0 percent and failed 2 total trafic shows 2
@@fitNdedicated sorry can we do a meeting to see the issue?
@@codewithSJM ok when you have time ?
@@fitNdedicated can we communicate in WhatsApp 255624748387 check me here please
message is not received but success message shows please reply
where is sms receiving video please share
Otherwise, can please share mobile number or zoom link, google meet, like, Skype id. i want to connect and this issue
Yeah sure here is my WhatApp number 255624748387
@@domainsculptors7063 now I'm busy can we schedule a meeting just check the WhatsApp I shared
it'svery urgent i am using in live project
How can i store the data in database
@@domainsculptors7063 I will share the link to my repo that has the way to add data to database
I had a problem with some of my codes. I messaged video uploader on whatsapp and he scheduled a meeting with me and solved my problems for me. Very humble guy. Thank you so much for your kind help. May God make things easy for you as you have made things easy for me.
@@minthantoo3509 Thanks brother 🙏. God bless you too. Feel free to ask for anything next time too.
Thank you....
You're welcome!
Why didn't you run the 3rd publish command? Explaining these things goes a long way to providing clarity
Thank you for the video. Could you please help me? I have set the available date and time as doctor. but I couldn't see the available time when I selected the date as a patient. I have checked your repo and I couldn't find out what I did wrong. Could you please take a look at my code below? It is in BookingComponent.php and booking-component.blade.php. Thank you. BookingComponent.php <?php namespace App\Livewire; use App\Models\Appointment; use App\Models\Doctor; use App\Models\DoctorSchedule; use Illuminate\Support\Carbon; use Illuminate\Support\Facades\DB; use Livewire\Attributes\Layout; use Livewire\Attributes\Title; use Livewire\Component; class BookingComponent extends Component { #[Title('Appointment Booking')] #[Layout('layouts.app')] public $doctor_details; public $selectedDate; public $availableDates = []; public $timeSlots = []; public function mount($id) { $this->doctor_details = Doctor::with('speciality', 'doctorUser')->where('id', $id)->first(); $this->fetchAvailableDates($this->doctor_details); } public function fetchAvailableDates($doctor) { $schedules = DoctorSchedule::where('doctor_id', $doctor->id)->get(); $availability = []; foreach($schedules as $schedule) { $dayofWeek = $schedule->available_day; // 0-Sunday 1-Monday 6-Friday $fromTime = Carbon::createFromFormat('H:i:s', $schedule->from); $toTime = Carbon::createFromFormat('H:i:s', $schedule->to); $availability[$dayofWeek] = [ 'from' => $fromTime, 'to' => $toTime, ]; } $dates = []; $today = Carbon::today(); for ($i = 0; $i < 365; $i++) { $date = $today->copy()->addDays($i); $dayofWeek = $date->dayOfWeek; if(isset($availability[$dayofWeek])) { $dates[] = $date->format('Y-m-d'); } } $this->availableDates = $dates; } public function selectDate($date) { $this->selectedDate = $date; $this->fetchTimeSlots($date, $this->doctor_details); } public function fetchTimeSlots($date, $doctor) { $dayofWeek = Carbon::parse($date)->dayOfWeek; $carbonDate = Carbon::parse($date)->format('Y-m-d'); $schedule = DoctorSchedule::where('doctor_id', $doctor->id) ->where('available_day', $dayofWeek) ->first(); if($schedule) { $fromTime = Carbon::createFromFormat('H:i:s', $schedule->from); $toTime = Carbon::createFromFormat('H:i:s', $schedule->to); $slots = []; while($fromTime->lessThan($toTime)) { $timeSlot = $fromTime->format('H:i:s'); $appointmentExists = Appointment::where('doctor_id', $doctor->id) ->where('appointment_date', $carbonDate) ->where('appointment_time', $timeSlot) ->exists(); if (!$appointmentExists) { $slots[] = $timeSlot; } $fromTime -> addHour(); } $this->timeSlots = $slots; } else { $this->timeSlots = []; } } public function render() { return view('livewire.booking-component', [ 'availableDates' => $this->availableDates, ]); } } booking-component.blade.php <div> <x-slot name="header"> <h2 class="text-xl font-medium leading-tight text-gray-800"> {{ __('You are now making an appointment with') }} <span class="font-semibold">Dr {{ $doctor_details->doctorUser->name }}</span> </h2> </x-slot> <div> <div wire:loading> <div class="animate-spin inline-block size-6 border-[3px] border-current border-t-transparent text-blue-600 rounded-full dark:text-blue-500" role="status" aria-label="loading"> <span class="sr-only">Loading...</span> </div> Processing.. </div> <!-- Card Blog --> <div class="max-w-[85rem] px-4 py-10 sm:px-6 lg:px-8 lg:py-14 mx-10 bg-white border my-2 shadow-md"> <!-- Grid --> <div class="grid grid-cols-2 md:grid-cols-3 gap-8 md:gap-12"> <div class="text-center"> {{-- <livewire:profile-image :user_id="$doctor_details->doctorUser->id"/> --}} <div class="mt-2 sm:mt-4"> <h3 class="text-sm font-medium text-gray-800 sm:text-base lg:text-lg dark:text-neutral-200"> {{$doctor_details->doctorUser->name}} </h3> <p class="text-xs text-gray-600 sm:text-sm lg:text-base dark:text-neutral-400"> {{$doctor_details->speciality->speciality_name}} / {{$doctor_details->hospital_name}} </p> </div> </div> <!-- End Col --> <div class="text-center"> <h3>Select an Available Date</h3> <input placeholder="Select Available date" type="text" id="datepicker" autocomplete="off" class="py-3 px-4 block w-full border-gray-200 rounded-lg text-sm focus:border-blue-500 focus:ring-blue-500 disabled:opacity-50 disabled:pointer-events-none bg-gray-100" > @if($selectedDate) <div> <h4>Selected Date: {{ $selectedDate }}</h4> </div> @endif <div> <h2 class="text-xl font-bold mb-2">Available Time Slots</h2> <div class="flex flex-wrap"> @foreach ($timeSlots as $slot) @dd('hsit') <button class="m-2 p-2 bg-blue-500 text-white rounded hover:bg-blue-700" type="button" wire:click="bookAppointment('{{$slot}}')" wire:confirm="Book appointment on {{ $selectedDate }}, {{ $slot }} ?" > {{ date('H:i',strtotime($slot)) }} </button> @endforeach </div> </div> </div> <!-- End Col --> </div> <!-- End Grid --> </div> <!-- End Card Blog --> <script src="cdn.jsdelivr.net/npm/pikaday/pikaday.js"></script> <script src="cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script> <script> document.addEventListener('DOMContentLoaded', function() { // Ensure Livewire can trigger when a date is selected var availableDates = @json($availableDates); var picker = new Pikaday({ field: document.getElementById('datepicker'), format: 'YYYY-MM-DD', onSelect: function(date) { var selectedDate = picker.toString(); @this.set('selectedDate', selectedDate); }, disableDayFn: function(date) { var formattedDate = moment(date).format('YYYY-MM-DD'); return !availableDates.includes(formattedDate); } }); }); </script> </div> </div>
What a great video, but I am currently stuck with the quickstart in Livewire Documentation. The button I click when doing the counters does not change the count by increasing or decreasing it. May I know if there's any setup needs to be done after the command 'composer require livewire/livewire'?
Have you created the component with function that you can call in on an event of onClick of your button in your button you should call the increment or decrement of your count and make sure they exist in your component
@@codewithSJM I did, in Controller.php is the function increment and decrement, in the controller.blade.php is the button with wire:click="functionName".
Now it is hard to guess where did it goes wrong, can we have a way I can see your code like a meeting or something?
nice one ❤❤❤
@@mballahtechs thanks🙏
Thank you for this video. Could you please tell me why you create blade files manually and livewire files using command prompt. Then you wrap livewire component with blade component. Could you please help me understand?
It's just a way I used to wrap my livewire components in order to allow me access the data and anything from my controllers, But it is not must to use controllers in a livewire app, you can just call compnents direct this convention I have used it in my latest video with this link: th-cam.com/video/NDwPC78LUJc/w-d-xo.html no need to use controllers and actually no need to create manual blade files
@@codewithSJM Thank you for your quick response and explanation. Thank you for the videos too.
@@minthantoo3509 thanks too for your question.
what is extension u use?
@@muhammadjauharisaealal3180 for react it is ES7+ React