22 howto.md
33 A step-by-step guide to integrate Ruby on Rails with Syncfusion TS Scheduler
44-->
5- ## How to Integrate Ruby on Rails with Syncfusion Scheduler
5+ # How to Integrate Ruby on Rails with Syncfusion Scheduler
66This repository contains a sample full-stack application demonstrating how to display events in syncfuison Scheduler component using Ruby on Rails.
77
88## Prerequisites
@@ -18,11 +18,11 @@ This repository contains a sample full-stack application demonstrating how to di
1818├── test #Testing the functionality
1919│ ├── events_controller_test.rb
2020│ ├── schedule_controller_test.rb
21- ├ ── app
22- │ ├── javascript #Main JavaScript entry point that initializes frontend behavior
23- │ │ ├── application.js
24- │ │ ├── controllers
25- │ │ │ ├── index.js
21+ └ ── app
22+ ├── javascript #Main JavaScript entry point that initializes frontend behavior
23+ │ ├── application.js
24+ │ ├── controllers
25+ │ │ ├── index.js
2626 └── views
2727 ├── layouts
2828 │ ├── application.html.erb #Base HTML layout wrapping all views
@@ -31,17 +31,17 @@ This repository contains a sample full-stack application demonstrating how to di
3131```
3232
3333## Project Setup
34- ### Installation
35- 1 . #### Clone the project
34+ ## Installation
35+ 1 . ### Clone the project
3636 Clone the project from the repository by creating a fork and branch.
37- 2 . #### Ruby setup
37+ 2 . ### Ruby setup
3838 You can install the Ruby from the following link.
3939 [ ` https://www.ruby-lang.org/en/downloads/ ` ] ( https://www.ruby-lang.org/en/downloads/ )
4040 Then Install gem using below commands
4141 ```
4242 gem install rails
4343 ```
44- 3. #### Install dependencies:
44+ 3. ### Install dependencies:
4545 ```bash
4646 npm install
4747 or
@@ -60,117 +60,8 @@ This repository contains a sample full-stack application demonstrating how to di
6060
6161
6262## Output
63- 
63+ 
6464
6565## Troubleshooting
6666- **Version error**: Check and install the current version as by prerequistes.
67- - **Port already in use**: Clear all the previous running applications in both browser and command prompt.
68-
69- ## Creating Ruby on Rails Project With Syncfusion Scheduler
70-
71- ### 1. Create your folder-directory.
72- Create a folder with your own application name.
73-
74- Run the below command in your project terminal to create a directory.
75- ```bash
76- mkdir rails-ts-scheduler
77- ```
78-
79- ### 2. Navigate to your folder.
80- ``` bash
81- cd rails-ts-scheduler
82- ```
83-
84- ### 3. Creation of rails Project
85- Create a new rails project in your folder using the below command.
86- ``` bash
87- rails new . --webpack --database=sqlite3
88- ```
89-
90- ### 4. Create package.json file
91- To create package.json file use the following command.
92- ``` bash
93- bundle add jsbundling-rails
94- ```
95-
96- ### 5. Add Scripts
97- To add esbuild scripts, app/javascript/application.js use the following command
98- ``` bash
99- rails javascript:install:esbuild
100- ```
101-
102- ### 6. Installation of syncfusion dependencies
103- Install the syncfusion dependencies by the following commands.
104- ``` bash
105- yarn add @syncfusion/ej2-schedule
106- or
107- npm add @syncfusion/ej2-schedule
108- ```
109- ### 7. Add CSS styles
110- Add the Styles in app/javascript/application.js
111-
112- Import the necessary css styles from syncfusion documentatoion from the below link
113- ``` bash
114- https://ej2.syncfusion.com/documentation/schedule/getting-started
115-
116- ```
117-
118- ### 8. Creation of event models
119- Create a event folder to save the events in the database.
120- ``` bash
121- rails generate model Event title:string start:datetime end:datetime description:text
122- ```
123- To create a table in the database
124- ``` bash
125- rails db:migrate
126- ```
127-
128- ### 9. Create controller and Routes
129- To Create the EventsController, which handles event-related routes and API actions used by the Syncfusion Scheduler.
130- ``` bash
131- rails generate controller Events
132- ```
133-
134- ### 10. Creation of Home folder
135- Create the folder Home and index.html
136- ``` bash
137- rails generate controller Home index
138- ```
139-
140- ## 12. Update the code in index.html
141- Update the file app/views/Home/index.html or refer syncfusion documentation for different scheduler
142- https://ej2.syncfusion.com/documentation/schedule/getting-started
143- ``` bash
144- < section>
145- < script src=" https://cdn.syncfusion.com/ej2/32.1.24/dist/ej2.min.js" type=" text/javascript" ></script>
146- < link href=" https://cdn.syncfusion.com/ej2/32.1.24/material.css" rel=" stylesheet" >
147- < /section>
148- < section>
149- < div id=" Schedule" ></div>
150- < script>
151- var scheduleObj = new ej.schedule.Schedule({
152- height: ' 550px' ,
153- width: ' 100%' ,
154- selectedDate: new Date(2023, 6, 13),
155- eventSettings: {
156- dataSource: [{
157- Id: 1,
158- Subject: ' Meeting' ,
159- StartTime: new Date(2023, 6, 13, 10, 0),
160- EndTime: new Date(2023, 6, 13, 12, 30)
161- }]
162- }
163- });
164- scheduleObj.appendTo(' #Schedule' );
165- < /script>
166- < /section>
167- ```
168-
169- ### 13.Run the application
170- Run the application using the following command.
171- ``` bash
172- rails server
173- ```
174-
175-
176-
67+ - **Port already in use**: Clear all the previous running applications in both browser and command prompt.
0 commit comments