{"id":17673255,"url":"https://github.com/crclothier/hello-react-front-end","last_synced_at":"2025-03-30T15:45:02.087Z","repository":{"id":185303354,"uuid":"617423389","full_name":"CRClothier/hello-react-front-end","owner":"CRClothier","description":null,"archived":false,"fork":false,"pushed_at":"2023-08-01T11:06:17.000Z","size":215,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-05T17:22:22.601Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/CRClothier.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2023-03-22T11:12:47.000Z","updated_at":"2023-03-23T13:43:35.000Z","dependencies_parsed_at":"2023-08-01T12:38:25.295Z","dependency_job_id":null,"html_url":"https://github.com/CRClothier/hello-react-front-end","commit_stats":null,"previous_names":["crclothier/hello-react-front-end"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CRClothier%2Fhello-react-front-end","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CRClothier%2Fhello-react-front-end/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CRClothier%2Fhello-react-front-end/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/CRClothier%2Fhello-react-front-end/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/CRClothier","download_url":"https://codeload.github.com/CRClothier/hello-react-front-end/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246342752,"owners_count":20761938,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-24T04:42:55.995Z","updated_at":"2025-03-30T15:45:02.063Z","avatar_url":"https://github.com/CRClothier.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 📗 Table of Contents\n\n- [📗 Table of Contents](#-table-of-contents)\n- [📖 Hello React Frontend ](#-hello-react-frontend-)\n  - [🛠 Built With ](#-built-with-)\n    - [Tech Stack ](#tech-stack-)\n    - [Key Features ](#key-features-)\n  - [🚀 Live Demo ](#-live-demo-)\n  - [💻 Getting Started ](#-getting-started-)\n    - [Prerequisites](#prerequisites)\n    - [Setup](#setup)\n    - [Install](#install)\n    - [Usage](#usage)\n    - [Run tests](#run-tests)\n    - [Deployment](#deployment)\n  - [👥 Authors ](#-authors-)\n  - [🔭 Future Features ](#-future-features-)\n  - [🤝 Contributing ](#-contributing-)\n  - [⭐️ Show your support ](#️-show-your-support-)\n  - [🙏 Acknowledgments ](#-acknowledgments-)\n  - [📝 License ](#-license-)\n\n\u003c!-- PROJECT DESCRIPTION --\u003e\n\n# 📖 Hello React Frontend \u003ca name=\"about-project\"\u003e\u003c/a\u003e\n**Hello React Frontend** is a simple React app that displays a random greeting when connecting to the API. It uses Redux to manage the global state, which is generated with data fetched from an API built with Ruby on Rails which you can find [here](https://github.com/crclothier/hello-rails-back-end).\n\n## 🛠 Built With \u003ca name=\"built-with\"\u003e\u003c/a\u003e\n### Tech Stack \u003ca name=\"tech-stack\"\u003e\u003c/a\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003eClient\u003c/summary\u003e\n  \u003cul\u003e\n    \u003cli\u003e\u003ca href=\"https://reactjs.org/\"\u003eReact.js\u003c/a\u003e\u003c/li\u003e\n    \u003cli\u003e\u003ca href=\"https://redux-toolkit.js.org/\"\u003eRedux Toolkit\u003c/a\u003e\u003c/li\u003e\n  \u003c/ul\u003e\n\u003c/details\u003e\n\n\u003cdetails\u003e\n  \u003csummary\u003eServer\u003c/summary\u003e\n  \u003cul\u003e\n    \u003cli\u003e\u003ca href=\"https://guides.rubyonrails.org/index.html\"\u003eRuby on Rails\u003c/a\u003e\u003c/li\u003e\n  \u003c/ul\u003e\n\u003c/details\u003e\n\n\u003cdetails\u003e\n\u003csummary\u003eDatabase\u003c/summary\u003e\n  \u003cul\u003e\n    \u003cli\u003e\u003ca href=\"https://www.postgresql.org/\"\u003ePostgreSQL\u003c/a\u003e\u003c/li\u003e\n  \u003c/ul\u003e\n\u003c/details\u003e\n\n\u003c!-- Features --\u003e\n\n### Key Features \u003ca name=\"key-features\"\u003e\u003c/a\u003e\n\n- **Displays a random greeting** in a component.\n- **Redux Toolkit** is used for state management.\n- **Data fetch** is done using `createAsyncThunk` and requesting data from the API built with Rails.\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n\u003c!-- LIVE DEMO --\u003e\n\n## 🚀 Live Demo \u003ca name=\"live-demo\"\u003e\u003c/a\u003e\n\nThis is just an exercise for Microverse Bootcamp and won't be deployed.\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n\u003c!-- GETTING STARTED --\u003e\n\n## 💻 Getting Started \u003ca name=\"getting-started\"\u003e\u003c/a\u003e\n\nTo get a local copy up and running, follow these steps.\n\n### Prerequisites\nTo run this project you need:\n- Ruby version 2.7.0+\n- Rails version 7+\n- PostgreSQL\n- Node.js\n- Npm or Yarn\n\n### Setup\n\nClone this repository to your desired folder:\n\n```\nhttps://github.com/crclothier/hello-react-front-end.git\n```\n\n```\ncd hello-react-front-end\n```\n\n### Install\nInstall this project's dependencies with:\n\n```\nnpm install\n```\nor\n```\nyarn install\n```\n\n### Usage\n\nTo start the server run:\n\n```\nnpm start\n```\nor\n```\nyarn start\n```\nThis will start the server on http://localhost:4000/\n### Run tests\nN/A\n\n### Deployment\nN/A\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n\u003c!-- AUTHORS --\u003e\n\n## 👥 Authors \u003ca name=\"authors\"\u003e\u003c/a\u003e\n\n👤 **Chris Clothier**\n\n- GitHub: [@CRClothier](https://github.com/crclothier)\n- LinkedIn: [LinkedIn](https://www.linkedin.com/in/crclothier)\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n\u003c!-- FUTURE FEATURES --\u003e\n\n## 🔭 Future Features \u003ca name=\"future-features\"\u003e\u003c/a\u003e\n\n*User greetings* - add a form so the user can suggest new random greetings.\n*Add CSS animations* - Add animations for the greetings to appear on screen creatinga great user experience.\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n\u003c!-- CONTRIBUTING --\u003e\n\n## 🤝 Contributing \u003ca name=\"contributing\"\u003e\u003c/a\u003e\n\nContributions, issues, and feature requests are welcome!\n\nFeel free to check the [issues page](https://github.com/crclothier/hello-react-front-end/issues/).\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n\u003c!-- SUPPORT --\u003e\n\n## ⭐️ Show your support \u003ca name=\"support\"\u003e\u003c/a\u003e\n\nIf you like this project please give it a star ⭐\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n\u003c!-- ACKNOWLEDGEMENTS --\u003e\n\n## 🙏 Acknowledgments \u003ca name=\"acknowledgements\"\u003e\u003c/a\u003e\n- Microverse Bootcamp\n- Your name will be here if you contribute 😎\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n## 📝 License \u003ca name=\"license\"\u003e\u003c/a\u003e\n\nThis project is [MIT](./LICENSE) licensed.\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcrclothier%2Fhello-react-front-end","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fcrclothier%2Fhello-react-front-end","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fcrclothier%2Fhello-react-front-end/lists"}