Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
LaravelとFullCalendarでスケジュールカレンダーアプリをつくろう!
Rating: 2.8 out of 5(5 ratings)
32 students

LaravelとFullCalendarでスケジュールカレンダーアプリをつくろう!

カレンダーのJavaScriptライブラリーである『FullCalendar(フルカレンダー)』の導入から基本的な設定方法、カスタマイズなどを紹介する講座です。
Created byT J
Last updated 7/2023
Japanese

What you'll learn

  • PHP・Laravelにカレンダー機能を導入できるようになります
  • FullCalendarの使い方がわかります
  • 実際に簡単なアプリケーションを作成しながら学べます
  • 短い時間で効率的に理解できます

Course content

1 section12 lectures59m total length
  • コース概要3:25
  • アプリケーションの準備3:16

    【参考】Laravel Readouble

    https://readouble.com/laravel/6.x/ja/frontend.html


  • Schedule機能の作成13:56

    【参考】FullCalendar公式サイト

    https://fullcalendar.io/

  • FullCalendarの導入4:38

    【参考】FullCalendar公式サイト

    https://fullcalendar.io/

  • 登録したスケジュールの表示3:30
  • カレンダーのデザインアレンジ18:36
  • カレンダーのデザインアレンジ25:48
  • カレンダーのデザインアレンジ33:27
  • ポップアップの設定5:25

    【参考】Jquery CDN

    https://releases.jquery.com/

  • リンクの設定1:11
  • ドラッグ&ドロップによる日程の移動と期間の変更5:34
  • おわりに0:38

Requirements

  • LaravelとjavaScriptの基礎があることが前提です

Description

カレンダーのJavaScriptライブラリーである『FullCalendar(フルカレンダー)』の導入から基本的な設定方法、カスタマイズなどを紹介する講座です。Laravelで簡単なスケジュールアプリを作成し、そこにFullCalendarを導入していきます。

FullCalendarを初めて使うという方向けに、FullCalendarで何ができるのか、どのように設定するのかを理解することができます。

当講座ではFullCalendarはCDNで読み込みます。

FullCalendarの使い方がわからない方で基本的な利用方法を知りたい方におすすめの動画です。


【内容】

  • Laravelによるスケジュール登録

  • FullCalendarの導入

  • カレンダーに登録したイベントを表示する

  • 日本語化

  • 高さ設定

  • 曜日の開始設定

  • ヘッダーツール設定

  • ボタンテキスト

  • スケジュールなしのテキスト設定

  • 6週目の非表示

  • 当月以外のグレー表示

  • 初期表示日付

  • スケジュールの色設定

  • 時間の設定

  • ポップアップの設定

  • リンクの設定

  • ドラッグ&ドロップによる日程の移動と期間の変更


Who this course is for:

  • Laravelにカレンダーを導入したい方
  • FullCalendarの導入方法や使い方を知りたい方