{"id":16071853,"url":"https://github.com/fmanimashaun/yumeats","last_synced_at":"2026-04-10T17:04:11.225Z","repository":{"id":170308228,"uuid":"646247832","full_name":"fmanimashaun/yumeats","owner":"fmanimashaun","description":"YumEats it is a simple landing page for a resturant that offers a variety of dishes. it is built using react and styled using tailwindcss. using tailwindcss, the app is responsive and can be viewed on any device.","archived":false,"fork":false,"pushed_at":"2023-05-30T10:19:13.000Z","size":13961,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-02-10T21:19:21.649Z","etag":null,"topics":["postcss","react","tailwindcss"],"latest_commit_sha":null,"homepage":"https://fmanimashaun.github.io/yumeats/","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/fmanimashaun.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,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-05-27T19:02:44.000Z","updated_at":"2023-05-28T13:07:29.000Z","dependencies_parsed_at":null,"dependency_job_id":"daa68431-f9f8-4e0c-b271-4866b3b9f83a","html_url":"https://github.com/fmanimashaun/yumeats","commit_stats":null,"previous_names":["fmanimashaun/yumeats"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fmanimashaun%2Fyumeats","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fmanimashaun%2Fyumeats/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fmanimashaun%2Fyumeats/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/fmanimashaun%2Fyumeats/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/fmanimashaun","download_url":"https://codeload.github.com/fmanimashaun/yumeats/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247321328,"owners_count":20919969,"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":["postcss","react","tailwindcss"],"created_at":"2024-10-09T07:42:37.643Z","updated_at":"2025-12-30T23:07:47.972Z","avatar_url":"https://github.com/fmanimashaun.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"![](https://img.shields.io/badge/fmanimashaun-green)\n\u003ca name=\"readme-top\"\u003e\u003c/a\u003e\n\n# 📗 Table of Contents\n\n- [📖 About the Project](#about-project)\n  - [🛠 Built With](#built-with)\n    - [Tech Stack](#tech-stack)\n    - [Key Features](#key-features)\n  - [🚀 Live Demo](#live-demo)\n  - [📷 Screenshots](#screenshots)\n- [💻 Getting Started](#getting-started)\n  - [Setup](#setup)\n  - [Prerequisites](#prerequisites)\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](#support)\n- [🙏 Acknowledgements](#acknowledgements)\n- [❓ FAQ (OPTIONAL)](#faq)\n- [📝 License](#license)\n\n# 📖 YumEats \u003ca name=\"about-project\"\u003e\u003c/a\u003e\n\n**YumEats** it is a simple landing page for a resturant that offers a variety of dishes. it is built using react and styled using tailwindcss. using tailwindcss, the app is responsive and can be viewed on any device.\n\n## 🛠 Built With \u003ca name=\"built-with\"\u003e\u003c/a\u003e\n\n### Tech Stack \u003ca name=\"tech-stack\"\u003e\u003c/a\u003e\n\n- [React](https://reactjs.org/)\n- [React Icons](https://react-icons.github.io/react-icons/)\n- [tailwindcss](https://tailwindcss.com/)\n- [postcss](https://postcss.org/)\n- [gh-pages](https://www.npmjs.com/package/gh-pages)\n\n### Key Features \u003ca name=\"key-features\"\u003e\u003c/a\u003e\n\n- The app is responsive and can be viewed on any device.\n- The app is built using react and styled using tailwindcss.\n- The app is deployed to github pages.\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n## 🚀 Live Demo \u003ca name=\"live-demo\"\u003e\u003c/a\u003e\n\n\n- [Live Demo Link](https://fmanimashaun.github.io/yumeats/)\n\n## 📷 Screenshots \u003ca name=\"screenshots\"\u003e\u003c/a\u003e\n\n### Desktop \u003ca name=\"#desktop\"\u003e\u003c/a\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"1200\" src=\"screenshots/desktop.png\"\u003e\n\u003c/P\u003e\n\n### Tablet \u003ca name=\"#tablet\"\u003e\u003c/a\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"600\" src=\"screenshots/tablet.png\"\u003e\n\u003c/P\u003e\n\n### Mobile \u003ca name=\"#mobile\"\u003e\u003c/a\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003cimg width=\"300\" src=\"screenshots/mobile.png\"\u003e\n\u003c/P\u003e\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n## 💻 Getting Started \u003ca name=\"getting-started\"\u003e\u003c/a\u003e\n\n### Prerequisites \u003ca name=\"prerequisites\"\u003e\u003c/a\u003e\n\n- [Optional] Install git bash to your machine to enable you to clone this repo.\n- install Visual Studio to be able to host a local live version.\n- Install a browser to view the local live version.\n\nTo get a local copy up and running follow these simple example steps.\n### Setup \u003ca name=\"setup\"\u003e\u003c/a\u003e\n\nClone this repository to your desired folder:\n\n```sh\n  cd your-desired-folder\n  git clone https://github.com/fmanimashaun/yumeats.git\n  open the repo folder `yumeats`\n```\n\n### Install \u003ca name=\"install\"\u003e\u003c/a\u003e\n\nInstall this project dependencies with:\n\n```sh\n  npm install\n```\n\n### Usage \u003ca name=\"usage\"\u003e\u003c/a\u003e\n\nTo run the project, execute the following command:\n\n```sh\n  npm run start\n```\n\nRuns the app in the development mode.\\\nOpen [http://localhost:3000/yumeats](http://localhost:3000/yumeats) to view it in your browser.\n\nThe page will reload when you make changes.\\\nYou may also see any lint errors in the console.\n\n### Run tests \u003ca name=\"run-tests\"\u003e\u003c/a\u003e\n\nTo run tests to check the lint errors, run the following command:\n\n- To check for CSS lint errors, run the following command:\n\n```sh\n  npm run stylelint\n```\n\n- To check for JS lint errors, run the following command:\n\n```sh\n  npm run eslinter\n```\n\nTo run unit tests, run the following command:\n\n```sh\n  npm run test\n```\n\nLaunches the test runner in the interactive watch mode.\\\nSee the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.\n\n### Deployment \u003ca name=\"deployment\"\u003e\u003c/a\u003e\n\nYou can deploy this project to github pages by running the following command:\n\n```sh\n  npm run deploy\n\n```\n\nBuilds the app for production to the `build` folder.\\\nIt correctly bundles React in production mode and optimizes the build for the best performance.\n\nThe build is minified and the filenames include the hashes.\\\nand it is automatically deployed to the github page.\n\nSee the section about [github page deployment](https://github.com/gitname/react-gh-pages) for more information.\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n## 👥 Authors \u003ca name=\"authors\"\u003e\u003c/a\u003e\n\n👤 **Engr. Animashaun Fisayo**\n\n- [GitHub](https://github.com/fmanimashaun)\n- [Twitter](https://twitter.com/fmanimashaun)\n- [LinkedIn](https://www.linkedin.com/in/fmanimashaun/)\n- [Website](https://fmanimashaun.com)\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n## 🔭 Future Features \u003ca name=\"future-features\"\u003e\u003c/a\u003e\n\n- [ ] add to cart functionality\n- [ ] add checkout functionality\n- [ ] add payment functionality\n- [ ] add order tracking functionality\n- [ ] add user authentication functionality\n- [ ] add admin dashboard functionality\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\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](../../issues/).\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n## ⭐️ Show your support \u003ca name=\"support\"\u003e\u003c/a\u003e\n\nIf you like this project and want to support me, you can give a ⭐️ to this repo!\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n\n## 🙏 Acknowledgments \u003ca name=\"acknowledgements\"\u003e\u003c/a\u003e\n\n\nI would like to thank [Okwuose Ehiedu](https://www.linkedin.com/in/okwuose-ehiedu-7b8923198/) for resources\n\n\u003cp align=\"right\"\u003e(\u003ca href=\"#readme-top\"\u003eback to top\u003c/a\u003e)\u003c/p\u003e\n\n\n## ❓ FAQ (OPTIONAL) \u003ca name=\"faq\"\u003e\u003c/a\u003e\n\n- **How do I dynamically import multiple images within my project directory?**\n\n    - I used the [require.context](https://webpack.js.org/guides/dependency-management/#requirecontext) method to dynamically import multiple images within my project directory.\n    \n    ```js\n    const importAll = (r) =\u003e {\n      const images = {};\n      r.keys().forEach((key) =\u003e {\n        const imageName = key.replace(/^.+\\/([^/]+)\\.[^.]+$/, '$1'); // Extracts the image name from the path\n        images[imageName] = {\n          name: imageName.replace(/_/g, ' '), // Replaces underscores with spaces\n          path: r(key),\n        };\n      });\n      return Object.values(images);\n    };\n\n    // then you can call the function inside your component\n\n    const Slider = () =\u003e {\n      const ImagesArray = importAll(\n        require.context('path to image folder', false, /\\.(png|jpe?g|svg)$/),\n      );\n\n      // rest of your code\n    };\n    ```\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%2Ffmanimashaun%2Fyumeats","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffmanimashaun%2Fyumeats","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffmanimashaun%2Fyumeats/lists"}