An open API service indexing awesome lists of open source software.

https://github.com/praisespjmt/hello-react-frontend

A demo app that set up as a client-side for a Rails app to manage frontend of the application running on both Ruby-on-Rails and React. The app display a ramdom message from the server using React component.
https://github.com/praisespjmt/hello-react-frontend

reactjs

Last synced: 2 months ago
JSON representation

A demo app that set up as a client-side for a Rails app to manage frontend of the application running on both Ruby-on-Rails and React. The app display a ramdom message from the server using React component.

Awesome Lists containing this project

README

          

# 📗 Table of Contents

- [📗 Table of Contents](#table-of-contents)
- [📖 Hello React Frontend](#about-project)
- [🛠 Built With ](#built-with)
- [Tech Stack ](#tech-stack)
- [Key Features ](#key-features)
- [💻 Getting Started ](#getting-started)
- [Prerequisites](#prerequisites)
- [Setup](#setup)
- [Install](#install)
- [Usage](#usage)
- [👥 Authors ](#authors)
- [🔭 Future Features](#future-features)
- [🤝 Contributing ](#contributing)
- [⭐️ Show your support ](#️show-your-support)
- [🙏 Acknowledgements](#acknowledgements)
- [📝 License ](#license)

# 📖 Hello React Frontend

> `Hello React Frontend` is a demo app that set up as a client-side for a `Rails`
> app to manage frontend of the application running on both `Ruby-on-Rails` and `React`.
> The app display a ramdom message from the server using `React` component

- `Hello Rails Backend` PR Link: [Backend APP PR](https://github.com/PraisesPJMT/Hello-Rails-Backend/pull/1)
- `Hello Rails Backtend` APP Link: [Backend App](https://github.com/PraisesPJMT/Hello-Rails-Backend)

## 🛠 Built With

### Tech Stack

> Here are the tech stacks applied in this project.

Language

Framework

Linters

Markup Languages

(back to top)

## Key Features

> The following a key features of the app

- **Created React **
- **Created React Redux store**
- **Created components to view random messages from a Rails API endpoint**

(back to top)

## 💻 Getting Started

### Prerequisites

> The following applications are required to be installed for the project to run!

- Install Ruby on your computer (machine)
- Install a modern browser e.g [Google Chrome](https://www.google.com/chrome/), [Edge](https://www.microsoft.com/en-us/edge?r=1), [Firefox](https://www.mozilla.org/en-US/exp/firefox/new/) etc.
- Install [Node.js](https://nodejs.org/en/download/) LTS version
- Install [Git](https://git-scm.com/downloads)

### Setup

Clone this repository to your desired folder:

```sh
git clone git@github.com:PraisesPJMT/Hello-React-Frontend.git
cd Hello-React-Frontend
```

### Install

Install this project with:

```sh
npm install
```

### Usage

To run the project, execute the following command:

```sh
npm start
```

- After running `npm start`, use the app on [http://localhost:3000/](http://localhost:3000/) in the browser!
- For more information please visit [Ruby-on-Rails](https://rubyonrails.org/).

(back to top)

## 👥 Authors

👤 **Praises Tula**

[![GitHub](https://img.shields.io/badge/github-%23121011.svg?style=for-the-badge&logo=github&logoColor=white)](https://github.com/Paul-js-hub)
[![LinkedIn](https://img.shields.io/badge/linkedin-%230077B5.svg?style=for-the-badge&logo=linkedin&logoColor=white)](https://www.linkedin.com/in/praises-tula/)
[![Twitter](https://img.shields.io/badge/Twitter-%231DA1F2.svg?style=for-the-badge&logo=Twitter&logoColor=white)](https://twitter.com/PraisesPJMT/)

[![Gmail](https://img.shields.io/badge/Gmail-D14836?style=for-the-badge&logo=gmail&logoColor=white)](mailto:praisesmusa@gmail.com)
[![AngelList](https://img.shields.io/badge/AngelList-%23D4D4D4.svg?style=for-the-badge&logo=AngelList&logoColor=black)](https://angel.co/u/praises-tula/)

(back to top)

## 🔭 Future Features

> The following are features to be expected in the future

- [ ] **Connect to more API endpoints**

(back to top)

## 🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the [issues page](../../issues/).

(back to top)

## ⭐️ Show your support

Give a ⭐️ if you like this project!

(back to top)

## 🙏 Acknowledgments

> - Original UI design by [Gregorire Vella](https://www.behance.net/gregoirevella) on [Behance](https://www.behance.net/gallery/19759151/Snapscan-iOs-design-and-branding?tracking_source=).
> - Tip hart to you for checking this project out

(back to top)

## 📝 License

This project is [MIT](./LICENSE) licensed.