🙋‍♂️ سلام دوستان ...

دوره باز تولید شده از راه رسید.

فصل اول فرانت اند رایگان خواهد بود.
فصل دوم بک اند (ووکامرس) پولی خواهد بود.

این دوره در تاپلرن منتشر و فصل اول هم رایگان در کانال هم منتشر میشه...

@TheRaymondDev

🔶ایجاد breadcrumb در صفحات لاراول :

سلام 🙋‍♂️

بخش breadcrumb یک راهنمای ناوبری در واسطه‌های کاربری است و به کاربران کمک می‌کند تا مکان فعلی خود را پیگیری کنند.

در صفحه اصلی یا ادمین:

<ol class="breadcrumb">
    <li class="ms-2"><a href="{{ route('admin.index') }}" class="text-decoration-none text-dark">پیشخوان</a></li> /
    {{ $breadcrumb ?? '' }}
</ol>

در دیگر صفحات :

<x-slot name="breadcrumb">
        <li class="ms-2"><a href="{{ route('category.index') }}" class="text-decoration-none text-dark">دسته بندی</a></li> /
</x-slot>

@TheRaymondDev

#موزیک مناسب زمان برنامه نویسی

🎧 لیست پخش
► 00:00 Rainy Nights - Azaleh
► 03:46 In A Cabin By The Lake - Lazarus Moment
► 09:47 Hollow - Ecepta
► 11:44 For The Sky - Himalia
► 17:16 Disconnect - Victoriya
► 21:11 Horizon - Almost Vanished
► 25:50 Forget Me Not - Oscuro Official
► 29:59 Radiance - Menual
► 33:51 Dawn - Kazukii
► 37:36 No One Is Forever - Moon
► 41:44 But You Never Told Me - Groundfold
► 44:56 God Will Let Me Know - Dakun
► 48:06 Asylum - Eyeri
► 52:50 Tension - Kazukii
► 57:19 Your Reflection - Lux Natura
► 1:01:38 Frustration - Brimstone
► 1:06:22 Wanderer - Fyze
► 1:11:09 Hypnos - 4lienetic
► 1:14:52 We Are Blind - RIT & LuQus
► 1:19:04 Asterism - Ecepta
► 1:22:48 Cosmo Pollen - Brombaer & Noahs Boat
► 1:27:22 One Too Many - Exist Strategy
► 1:31:23 Somewhere - F3edo
► 1:37:10 Ilia - Kisnou
► 1:39:56 Tea - Quok
► 1:44:33 Quenching - Margari's Kid

@TheRaymondDev

چه خوبه 😍

🔶 ابزارهای هوش مصنوعی :

_ copy.ai : برات ایمیل می‌نویسه
_ loora.ai : کوچ اسپیکینگ
_ summarize.tek : متن خلاصه می‌کنه
_ murf.ai : تبدیل متن به گفتار
_ poe.com : هر سوالی بپرسی جواب میده
_ beautiful.ai : برات پاورپوینت میسازه
_ wordtune.ai :رایتینگ می‌نویسه
_ smalltalk2.me : پارتنر اسپیکینگ

@TheRaymondDev

سلام 🙋‍♂️

دوستان عزیز ...

سوال اینه چرا ما از چارچوب بوت استرپ در دوره طراحی و کد نویسی پوسته فروشگاهی ووکامرس استفاده می کنیم؟

1- بوت استرپ چارچوب سی اس اس هست که دارای المان های آماده برای توسعه سریع صفحات وب هست.
2- اگر ریز تا درشت طراحی صفحات بدون چارچوب بوت استرپ پیش ببریم باعث طولانی شدن طول دوره آموزشی خواهد شد که مطمئنا دانشجویان از آن خوش نخواهد آمد و دوره را ول می کند.

پس ما در دوره از بوت استرپ استفاده می کنیم که سریع تر صفحات وب را توسعه دهیم و زمان توسعه آن کاهش دهیم .

و در آخر بوت استرپ قابل شخصی سازی است.


@TheRaymondDev

سلام 🙋‍♂️

🔶 آپلود عکس ویرایشگر CKEditor 5 در لاراول

کنترلر EditorController را ایجاد کنید:

php artisan make:controller EditorController

مسیر روت با متد post برای EditorController ایجاد کنید:

Route::post('editor', [EditorController::class, 'upload'])->name('editor.upload');

کد زیر را در کنترلر وارد کنید:

public function upload(Request $request)
{
   if ($request->hasFile('upload')) {
       $originName = $request->file('upload')->getClientOriginalName();
       $fileName = pathinfo($originName, PATHINFO_FILENAME);
       $extension = $request->file('upload')->getClientOriginalExtension();
       $fileName = $fileName . '_' . time() . '.' . $extension;
       $request->file('upload')->move(public_path('media'), $fileName);

       $url = asset('media/' . $fileName);
       return response()->json(['fileName' => $fileName, 'uploaded'=> 1, 'url' => $url]);
   }
}

کد بالا هنگامی آپلود عکس انجام می شود, پوشه media در پوشه public لاراول ایجاد می شود و نیازی نیست دستی ایجاد کنید.

فایل جاوا اسکریپت ویرایشگر CKEditor 5 به لاراول منتقل کنید:

<noscript src="https://cdn.ckeditor.com/ckeditor5/36.0.1/classic/ckeditor.js"></noscript>

می توانید روی این پیوند لینک کنید و فایل را دانلود کنید.
ویرایشگر متنی CKEditor را فعال سازی می کنیم:

<textarea class="form-control" id="editor" rows="10"></textarea>
<noscript>
    ClassicEditor
    .create( document.querySelector( '#editor' ), {
        ckfinder: {
            uploadUrl: '{{route('editor.upload').'?_token='.csrf_token()}}'
        },
        language: {
            content: 'ar'
        }
    })
   .then( editor => {
         console.log( editor );
   })
   .catch( error => {
        console.error( error );
   })
</noscript>

@TheRaymondDev

🙋‍♂️ سلام دوستان ...

آزمونی برای کارفرما شدن ..

کار سختی پیش رو دارم.

@TheRaymondDev

سلام 🙋‍♂️

🔶 کد تغییر ساختار آدرس دسته بندی های وردپرس

به طور پیش فرض در دسته بندی های وردپرس کلمه Category در آدرس دسته بندی سایت شما وجود دارد و اگر تمایل به حذف آن کلمه را دارید می توانید با تابع زیر ساختار آدرس دسته بندی های سایت وردپرسی خود را حذف کنید.

function remove_category( $string, $type )
{
  if ( $type != 'single' && $type == 'category' && ( strpos( $string, 'category' ) !== false ) )
  {
    $url_without_category = str_replace( "/category/", "/", $string );
    return trailingslashit( $url_without_category );
  }
  return $string;
}
 
add_filter( 'user_trailingslashit', 'remove_category', 100, 2);

پیوند زیر:

https://B2n.ir/h83750

@TheRaymondDev

🙋‍♂️ سلام

اولین ویدئو ضبط شده آموزشی مال پارسال اسفند ماه هست.

🔶 آموزش ویدئویی ایجاد فهرست محتوا با کد نویسی بدون افزونه وردپرس

@TheRaymondDev

🔶 چهار راه برای محدود کردن راست کلیک, کپی و پیست و کات با جاوا اسکریپت

1- غیر فعال سازی راست کلیک

document.addEventListener("contextmenu", evt => evt.preventDefault(), false);

2- غیر فعال سازی کپی کلیپ بورد

document.addEventListener("copy", evt => {
  // (B1) CHANGE THE COPIED TEXT IF YOU WANT
  evt.clipboardData.setData("text/plain", "Copying is not allowed on this webpage");
 
  // (B2) PREVENT THE DEFAULT COPY ACTION
  evt.preventDefault();
}, false);

3- غیر فعال سازی انتخاب متن با CSS

<!DOCTYPE html>
<html>
  <head>
    <noscript>Title of the document</noscript>
    <style>
      .unselectable {
        -webkit-user-select: none;
        -webkit-touch-callout: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        color: #cc0000;
      }
    </style>
  </head>
  <body>
    <p>I am a selectable text. You can select me.</p>
    <div class="unselectable">I am an unselectable text. My text selection is disabled.</div>
  </body>
</html>

4- فقط یک بخش خاص غیر فعال شود

<noscript>
window.addEventListener("load", () => {
  var target = document.getElementById("no-copy");
  target.addEventListener("contextmenu", evt => evt.preventDefault(), false);
  target.addEventListener("copy", evt => {
    evt.clipboardData.setData("text/plain", "Copying is not allowed on this webpage");
    evt.preventDefault();
  }, false);
});
</noscript>
 
<style>
#no-copy { user-select: none; }
#no-copy::selection { background: none; }
#no-copy::-moz-selection { background: none; }
</style>
 
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<p id="no-copy">This section cannot be copied.</p>

@TheRaymondDev

🔶 هوش مصنوعی های جدید و پرکاربرد!


1. YouTube Summaries
👉 eightify.app
2. Photo Editor
👉 picwish.ai
3. Website Builder
👉 mixo.io
4. Voice Notes
👉 vribble.ai
5. Text Notes
👉 albus.org
6. Text-to-Video
👉 pika.art
7. Viral Clips
👉 opus.pro
8. Music Production
👉 wavtool.com

@TheRaymondDev

🔶 معرفی Cursor اولین ویرایشگر مبتنی بر AI

ویرایشگر Cursor یه فورک از وی اس کد هست که با هوش مصنوعی ادغام شده، به دلیل اینکه فورک وی اس کد هست شما می توانید خیلی راحت از وی اس کد به این ویرایشگر مهاجرت کنید.

ویژگی های cursor:

- ویژگی Command K:
با استفاده از این ویژگی بعد از اینکه بخشی از کد را که میخواستید تغییر کند رو انتخاب کردید، نحوه تغییر کد را به Ai توضیح می دهید و کد را براتون عوض می کند.

- چت
بر اساس کد بیس پروژه می توانید با Ai چت کنید و بدون نیاز به توضیح خط کد و لاجیک پروژه جواب مناسب دریافت کنید

- دیباگ اتوماتیک
به کمک این ویژگی با کمک AI کد را رو دیباگ کنید

- و ....

ویرایشگر Cursor برای سه سیستم عامل مک و ویندوز و لینوکس در دسترس است ولی استفاده از مدل های GPT-4 و GPT-3.5 در پلن رایگان محدودیت دارد که شما می توانید با وارد کردن OpenAI Key این محدودیت رو برطرف کنید.

وب سایت پروژه:
https://www.cursor.so/

گیت هاب پروژه:
https://github.com/getcursor/cursor

@TheRaymondDev

سلام 🙋‍♂️

🔶 کد نمایش نوشته های مرتبط در وردپرس

<?php
    $post_tags = wp_get_post_tags( $post->ID );
    
    $args = array(
        'tag__in'         => array( $post_tags[0]->term_id ),
        'post__not_in'    => array( $post->ID ),
        'posts_per_page'  =>3,
        'caller_get_posts'=>1
    );
    
    $query = new WP_Query( $args );
    
    if( $query->have_posts() ): ?>
        <div class="related-posts">
            <?php while( $query->have_posts() ) : $query->the_post(); ?>

            <article class="post-item">
                <figure class="post-thumb">
                    <a href="<?php the_permalink() ?>" class="thumbnail">
                        <?php the_post_thumbnail(); ?>
                    </a>
                </figure>
                <h5><a href="<?php the_permalink() ?>" noscript="<?php the_noscript(); ?>">
                        <?php the_noscript(); ?>
                    </a></h5>
            </article>

            <?php endwhile; ?>
        </div>

        <?php endif;
    wp_reset_query();
?>

@TheRaymondDev

🔶 افزودنی های ویرایشگر VSCode برای توسعه لاراول

کد ویژوال استودیو (VSCode) یک ویرایشگر کد بسیار قابل تنظیم است. اگر آن را به درستی برای موارد استفاده خاص پیکربندی کنید، می توان آن را به سطح بعدی برد. در این نوشته، ویرایشگر کد را برای توسعه لاراول راه اندازی می کنیم.


https://B2n.ir/z84188

@TheRaymondDev

🔶 صفحه اول فروشگاه HTML برای ووکامرس

@TheRaymondDev

🔶 آموزش رایگان جامع سئو

https://freeseoforever.ir/

@TheRaymondDev

🔶 پروژه IDX: یک محیط توسعه یکپارچه ابری و مبتنی بر مرورگر (IDE)است که با هوش مصنوعی کار می کند. این برنامه به گونه ای طراحی شده است که ساخت، مدیریت و استقرار برنامه های تحت وب و چند پلتفرمی با چارچوب ها و زبان های محبوب را برای توسعه دهندگان آسان تر کند.

پروژه IDX براساس Google Cloud ساخته شده و با Codey کار می کند، یک مدل هوش مصنوعی پایه که براساس کد آموزش داده شده و براساس PaLM ۲ ساخته شده است. کدی انواع ویژگی های مبتنی بر هوش مصنوعی از جمله تولید کد، تکمیل کد و توضیح کد را در اختیار IDX قرار می دهد.

همچنین شامل تعدادی ویژگی دیگر است که آن را به یک IDE قدرتمند برای توسعه تمام پشته تبدیل می کند، مانند:

... پشتیبانی از چارچوب ها و زبان های محبوب، از جمله Agle، Flutter، Next.js، React، Svelte، Vue، JavaScript، Dart و (به زودی)Python، Go و غیره.

... امکان وارد کردن پروژه های موجود از گیت هاب یا ایجاد پروژه های جدید با قالب های از پیش آماده.

... پیش نمایش های وب چند مرورگره، شبیه سازهای اندروید و شبیه سازهای iOS برای تست و اشکال زدایی اپلیکیشن ها.

... یکپارچه سازی با سرویس های ابری گوگل، مانند Firebase Hosting و Cloud Functions.

پروژه IDX هنوز در دست توسعه است، اما این پتانسیل را دارد که شیوه توسعه اپلیکیشن های تمام صفحه را متحول کند. IDX با ارائه یک IDE قدرتمند و مبتنی بر هوش مصنوعی به توسعه دهندگان می تواند به آن ها کمک کند تا بهره وری و کارایی بیشتری داشته باشند.

https://idx.dev/

@TheRaymondDev

🔶 چگونه فایل های که (فقط به آن نیاز داریم) فراخوانی کنیم؟

در ایجاد متدی به نام styles تعریف می کنیم:

{{ $styles ?? '' }}

حال با x-slot که با کلاس name متد styles رو صدا می زند, ایجاد می کنیم:

<x-slot name="styles"></x-slot>

خلاصه در آخر فایل استایل رو فراخوانی می کنیم:

<x-slot name="styles">
       <link rel="stylesheet" href="{{asset('css/bootstrap.rtl.min.css')}}">
</x-slot>

برای فایل های اسکریپت همین هست.

🔥 مزایای آن چیست؟

مزایای این است که ما نمی خواهیم همین فایل های صفحه را فراخوانی کنیم که باعث میشه کندی بارگزاری صفحه شود و آن فایل هایی که واقعا نیاز داریم در آن صفحه فراخوانی کنیم و در صفحه اصلی نباشد.

نکته: این برای کامپوننت ها هست.

@TheRaymondDev

🔶 دوره پروژه محور ساخت cms وبلاگ با لاراول

👈 مدرس دوره :: توفیق حمزئی
👈 مدت زمان دوره : 20 ساعت
👈 تعداد جلسات : 67 جلسه
👈 وضعیت دوره : کامل شده
👈 دانلود رایگان

@TheRaymondDev