About

Hello Rails React is a sample project that shows how to integrate Rails and React. See more...

📗 Table of Contents

💬 About the project
💻 Getting Started
- Prerequisites
- Setup
- Usage
- Run
- Open
👥 Author
🔭 Future Features
🤝 Contributing
⭐️ Show your support
🙏 Acknowledgements
📝 License

👋Hello Rails React

Hello Rails React is a sample project that shows how to integrate Rails and React. It is composed of two projects, one for the back end and another one for the front end.

Ruby on Rails

RoR is used for the back end, and it is configured as an api, so it attends the requests of the front end.
hello-rails-back-end this repository, is the one that holds the RoR project.

React

React is used for the front end, and it consumes the back end as an API.
hello-react-front-end, is the repository that holds the React project.

🛠 Built With

Tech Stack

Back End with RoR
- Ruby
- Rails
- PostgreSQL
Front End with React/Redux
- React
- Redux Toolkit

Key Features
- Uses Ruby on Rails for the Back End.
- Back End is an API.
- Back End preserves data in a Postgress DB.
- Uses React for the Front End.
- Uses React components.
- Uses Redux to handle the state of the app.

(back to top)

💻 Getting Started

To get a local copy of this project up and running, follow these steps.

Prerequisites for the Back End
- git installed. Please got to Getting Started - Installing Git guide and follow the steps described for your system to install git.
- Ruby installed, you can go to the Installing Ruby documentation and follow the steps for your computer OS.
- Rails installed, you can follow the GoRails Tutorial and follow the steps for your computer OS.
- PostgreSQL installed, you can follow the PostgreSQL Tutorial and follow the steps for your computer OS.

Setup

Clone this repository to your local-folder:

cd local-folder
git clone git@github.com:luigirazum/hello-rails-back-end.git

Usage

In the local-folder where you cloned the project, go into the project folder
```
cd hello-rails-back-end
```
Prepare

In the hello-rails-back-end folder, use the following code to install the app dependencies
```
bundle install
```
Run

In the hello-rails-back-end folder, use the following code to run the app
```
rails server
```

Open

That's it, the API is running now.
Running the following command in your terminal:

curl --verbose --get 'http://127.0.0.1:3000/api/v1/greetings/random' --header 'Accept: "application/json"'

Will throw something like the following:

*   Trying 127.0.0.1:3000...
* Connected to 127.0.0.1 (127.0.0.1) port 3000 (#0)
> GET /api/v1/greetings/random HTTP/1.1
> Host: 127.0.0.1:3000
> User-Agent: curl/7.81.0
> Accept: "application/json"
>
* Mark bundle as not supporting multiuse
< HTTP/1.1 200 OK
< x-frame-options: SAMEORIGIN
< x-xss-protection: 0
< x-content-type-options: nosniff
< x-permitted-cross-domain-policies: none
< referrer-policy: strict-origin-when-cross-origin
< content-type: application/json; charset=utf-8
< etag: W/"ddb1f6216f69d27ea533d4d810381d26"
< cache-control: max-age=0, private, must-revalidate
< x-request-id: 3f02e9c6-3b14-4498-a7a1-8ab8833a8eb5
< x-runtime: 0.008468
< server-timing: start_processing.action_controller;dur=0.01, sql.active_record;dur=1.06, instantiation.active_record;dur=0.10, process_action.action_controller;dur=5.35
< vary: Origin
< Content-Length: 254
<
* Connection #0 to host 127.0.0.1 left intact
{"data":{"id":6,"message":"Say Hello to Rails with React","created_at":"2024-03-12T09:17:22.649Z","updated_at":"2024-03-12T09:17:22.649Z"},"headers":{"Access-Control-Allow-Origin":"http://localhost:3001","Content-Type":"application/json; charset=utf-8"}}%