How I make the Calendly App with Ruby and React js          (Backend Part 1)
Published: 2020-12-25 14:26:45

Have you guys ever hear about Calendly? From this app, I have an idea to make the app called [Bookme](https://bookme.jamesmai.dev/).
 
First, When I started making this app, I thought I would do an app for some practice with Ruby and React JS and wanted to have a conversation with me about the job, they could book me through the app.

Bookme App is an app for scheduling appointments, meetings, and events. People can book you for a meeting you've created. Even more, people can book you through this Booking App instead of email or message.

The Bookme App only allows you to create and delete meetings, Invitees will see all the meetings you've available in my schedule, and they can select one of those to make an appointment with you. After a person has booked you, it will have the email notice for you and the person who has booked you, Ensuring the ideal time slot for both parties.

For this Booking App, I'll be creating an API containing Meeting and Booking. We'll be using PostgreSQL for our database cause it will allow easier to push it on Heroku.
<br>
#Backend API

To get started, we will create the Rails API.

```
rails new booking_backend --api --database=postgresql 
```
The `rails new booking_backend` command will create the full application with views and some we won't be using, so we insert the `--api` to specify it is an API. `--database=` the database we are using, which is `postgresql`.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/so5r9z2338ks3wlo5l00.png)

Once you've created it, you can open the project in your code editor. Inside the `app` folder, we will be working on the `controllers` and `models` directories.
<br>
#Models


First, we will generate two models are Meeting and Booking.

**Meeting**
```
rails generate model Meeting title:string start_date:datetime end_date:datetime start_time:time end_time:time time_meeting:string
```
This command line will create the migrate, the meeting files, and some other code.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ugezta1ay1r87b6asm9f.png)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/dya569cj59ihz1lcucyp.png)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/3bswaorl2onf6ed4grur.png)

In our meeting will have:
* `title` of the meeting.
* `start_date` and `end_date` is the valid date of the meeting.
* `start_time` and `end_time` is the available time people can book the meeting in the day.
* `time_meeting` is the limited time of the meeting.


**Booking**
```
rails generate model Booking meeting:references name:string date:date time:time email:string message:text
```
This command line will create the migrate, booking files, and some other code.

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/c0c3s5vlqaw3vc98y6bb.png)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/ycck3xxqpg7821vl3f9s.png)

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/kt3qzhbv5qr3k0lzlri8.png)

In our Booking table will have some columns for people to book the meeting:
* `date` and `time`  are the day and time the person booking wants to start the meeting.
* `name` and `email` are the information of the person booking
* `message` is the message of the person booking to send to the meeting user.

<br>
Note that `meeting:references` creates a relationship with the Meeting model, this is because of our Booking to `belong_to :meeting` and Meeting `has_many :bookings`.

**Migrate**
Once we have everything done, we can start building and migrating our database with the following commands:

```
//Set up the database
rails db:setup

//Run the migration files
rails db:migrate
```
You should see some similar to this:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/tbwuwjby3vkq7pn1ddzc.png)

You also can be able to check the schema.rb file in your db folder:
![Alt Text](https://dev-to-uploads.s3.amazonaws.com/i/osiz2d0u34nqbartaek5.png)
**Meeting Model**
Add some code to the Meeting Model: ` app/models/meeting.rb`

```ruby
class Meeting < ApplicationRecord
  has_many :bookings
  validates :title, :time_meeting, :start_date, :end_date, :start_time, :end_time, :user_id, presence: true
end
```
* Because booking belongs to a meeting, it's mean the meeting will have many bookings `has_many :bookings` .

* `validates :title, :time_meeting...` are used to ensure that valid data of `:title, :time_meeting...` is saved into database
* `:title, :time_meeting, :start_date, :end_date, :start_time, :end_time, :user_id,` are column in meeting table. 
* `presence: true` is a method to check if the value is nil or a blank string, 
**Booking Model**
Add code to the Booking Model: `app/models/booking.rb`

```ruby
class Booking < ApplicationRecord
  belongs_to :meeting, optional: true
  validates :name, :date, :time, :email, :message, presence: true
end
```

* As I told you before, the meeting has many bookings, it means booking will belong to meeting `belongs_to :meeting`.

<br>
[Backend Part 2](https://dev.to/jamesmai0512/how-i-make-a-simple-app-with-ruby-and-react-js-backend-part-2-4c97)