Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/indiecodermm/hello-rails-react
Web application built to demonstrate the integration between a React front-end and a Ruby on Rails back-end.
https://github.com/indiecodermm/hello-rails-react
rails react redux-toolkit webpack
Last synced: 8 days ago
JSON representation
Web application built to demonstrate the integration between a React front-end and a Ruby on Rails back-end.
- Host: GitHub
- URL: https://github.com/indiecodermm/hello-rails-react
- Owner: IndieCoderMM
- License: mit
- Created: 2023-05-15T09:54:45.000Z (over 1 year ago)
- Default Branch: development
- Last Pushed: 2023-06-07T16:24:16.000Z (over 1 year ago)
- Last Synced: 2025-01-15T23:50:06.117Z (13 days ago)
- Topics: rails, react, redux-toolkit, webpack
- Language: Ruby
- Homepage:
- Size: 97.7 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Table of Contents
- [👋 Greeting App](#-greeting-app)
- [🧰 Tech Stack ](#-tech-stack--)
- [✨ Key Features ](#-key-features--)
- [📘 Getting Started ](#-getting-started--)
- [📋 Prerequisites](#-prerequisites)
- [📂 Setup](#-setup)
- [📥 Installation](#-installation)
- [💾 Database](#-database)
- [📦 Build](#-build)
- [💻 Usage](#-usage)
- [👨🚀 Author ](#-author--)
- [🎯 Future Features ](#-future-features--)
- [🤝 Contribution ](#-contribution--)
- [💖 Show Your Support ](#-show-your-support--)
- [🙏 Acknowledgements](#-acknowledgements)
- [📜 License ](#-license-)# 👋 Greeting App
The Greeting App is a simple web application built to demonstrate the implementation of a connection between a Ruby on Rails back-end and a React front-end. It generates random greetings and serves as a learning tool for understanding the integration between these two technologies.
- Front end: React
- State management: Redux Toolkit
- Back end: Ruby on Rails
- Database: PostgreSQL- Random Greetings: The app generates a random greeting each time it is loaded
- React and Redux: The front end is built using React, and API calls are made using Redux
- API: The back end is built using Rails, creating an API endpoint to generate a random greeting messageTo run this project locally, you'll need to follow these steps.
### 📋 Prerequisites
Make sure you have the following installed on your machine:
- [Ruby 3.1.3 or higher](https://www.ruby-lang.org/en/)
- [Rails 7.0.4 or higher](https://rubyonrails.org/)
- [PostgreSQL 15.2 or higher](https://www.postgresql.org/)### 📂 Setup
Clone this repository to your desired foler.
```sh
cd my-project
git clone [email protected]:IndieCoderMM/hello-rails-react.git .
```### 📥 Installation
Install the required gems with:
```sh
bundle install
```Install node dependencies with:
```sh
npm install
```### 💾 Database
Create the databases and run migrations with:
```sh
rails db:create
rails db:migrate
```To load the sample data, run:
```sh
rails db:seed
```### 📦 Build
Build the front-end assets with:
```sh
npm run build
```You can also set it to *watch mode* which automatically build after every changes. To start the *watch mode*, use:
```sh
npm run watch
```### 💻 Usage
After building the assets, run the development server with the following command:
```sh
rails server
```I am always looking for ways to improve my project. If you have any suggestions or ideas, I would love to hear from you.
**Hein Thant**
[![Github](https://img.shields.io/badge/GitHub-673AB7?style=for-the-badge&logo=github&logoColor=white)](https://github.com/IndieCoderMM)
[![Linkedin](https://img.shields.io/badge/LinkedIn-0077B5?style=for-the-badge&logo=linkedin&logoColor=white)](https://linkedin.com/in/hthantoo)
[![Gmail](https://img.shields.io/badge/Gmail-D14836?style=for-the-badge&logo=gmail&logoColor=white)](mailto:[email protected])- [ ] Add more endpoints
Contributions, issues, and feature requests are welcome!
If you like this project, please consider giving it a ⭐.
## 🙏 Acknowledgements
I would like to thank all code reviewers for making this project better.
This project is [MIT](./LICENSE) licensed.