This message contains the changes of the Ruby-Sample File.

README.md

@@ -1,30 +1,71 @@
-# javascript-scheduler-ruby-rails-application
+<!--
+  howto.md
+  A step-by-step guide to integrate Ruby on Rails with Syncfusion TS Scheduler
+-->
+# How to Integrate Ruby on Rails with Syncfusion Scheduler
+This repository contains a sample full-stack application demonstrating how to display events in syncfuison Scheduler component using Ruby on Rails.
 
 ## Prerequisites
+- Ruby - (3.2.2)
+- Node JS - (>=18.13.0)
+- Yarn - (>=1.22.19)
 
-Ruby - 3.2.2
-Node Js - 18.13.0
-Yarn - 1.22.19
-
-## Ruby setup
-
-You can install the Ruby from the following link.
-[`https://www.ruby-lang.org/en/downloads/`](https://www.ruby-lang.org/en/downloads/) 
-
-## Install Rails
-
+## Project Structure
 ```
-gem install rails
+├── README.md                  # This guide
+├── postcss.config.js
+├── package.json                  
+├── test       #Testing the functionality      
+│   ├── events_controller_test.rb  
+│   ├── schedule_controller_test.rb
+└── app 
+     ├── javascript   #Main JavaScript entry point that initializes frontend behavior
+     │   ├── application.js
+     │   ├── controllers
+     │   │   ├── index.js
+     └── views
+         ├── layouts
+         │   ├── application.html.erb  #Base HTML layout wrapping all views
+         └── welcome
+             └── index.html.erb  # View template for the welcome page
 ```
 
-## Add Syncfusion Scheduler component in your application
+## Project Setup
+## Installation
+1. ### Clone the project
+    Clone the project from the repository by creating a fork and branch.
+2. ### Ruby setup
+    You can install the Ruby from the following link.
+    [`https://www.ruby-lang.org/en/downloads/`](https://www.ruby-lang.org/en/downloads/) 
+    Then Install gem using below commands
+    ```
+    gem install rails
+    ```
+3. ### Install dependencies:
+   	```bash
+    npm install
+        or
+    yarn install
+    ```
+### Running the Application
+1. Navigate to javascript-scheduler-ruby-rails-application folder.
+    ```bash
+    cd javascript-scheduler-ruby-rails-application
+    ```
+2. Start the Scheduler Frontend
+    ```bash
+    rails server
+    ```
+3. Navigate to `http://localhost:3000` in your browser. (or) Ctrl + click the link in your terminal
 
-Refer the following UG documenation for adding Syncfusion React component in your application
-* [Getting Started of Syncfusion Javascript Scheduler component](https://ej2.syncfusion.com/javascript/documentation/schedule/getting-started)
 
-## Run the project
+## Output
+![Frontend Preview](./output.png)
 
-```
-yarn install
-rails server
-```
+## Troubleshooting
+- **Version error**: Check and install the current version as by prerequistes.
+- **Port already in use**: Clear all the previous running applications in both browser and command prompt.
+
+## Liscense
+**License banner**: Obtain and register a Syncfusion license key [link](https://ej2.syncfusion.com/angular/documentation/licensing/overview).
+

app/views/welcome/index.html.erb

@@ -1,23 +1,23 @@
 <section>
-    <script src="https://cdn.syncfusion.com/ej2/22.1.38/dist/ej2.min.js" type="text/javascript"></script>
-    <link href="https://cdn.syncfusion.com/ej2/22.1.38/material.css" rel="stylesheet">
+    <script src="https://cdn.syncfusion.com/ej2/32.1.24/dist/ej2.min.js" type="text/javascript"></script>
+    <link href="https://cdn.syncfusion.com/ej2/32.1.24/material.css" rel="stylesheet">
 </section>
 <section>
     <div id="Schedule"></div>
     <script>
         var scheduleObj = new ej.schedule.Schedule({
             height: '550px',
             width: '100%',
-            selectedDate: new Date(2023, 6, 13),
+            selectedDate: new Date(2026, 0, 22),
             eventSettings: {
                 dataSource: [{
-                    id: 1,
-                    subject: 'Meeting',
-                    startTime: new Date(2023, 6, 13, 10, 0),
-                    endTime: new Date(2023, 6, 13, 12, 30)
+                    Id: 1,
+                    Subject: 'Meeting',
+                    StartTime: new Date(2026, 0, 22, 10, 0),
+                    EndTime: new Date(2026, 0, 22, 12, 30)
                 }]
             }       
         });
         scheduleObj.appendTo('#Schedule');
     </script>
-</section>
+</section>

package.json

@@ -1,11 +1,11 @@
 {
 "dependencies": {
   "@rails/webpacker": "5.4.4",
-  "@syncfusion/ej2-schedule": "^22.1.38",
-  "webpack": "^5.88.0",
-  "webpack-cli": "^5.1.4"
+  "@syncfusion/ej2-schedule": "*",
+  "webpack": "^5.104.1",
+  "webpack-cli": "^6.0.1"
 },
 "devDependencies": {
-  "webpack-dev-server": "^5.2.1"
+  "webpack-dev-server": "^5.2.3"
   }
 }