{"id":16174907,"url":"https://github.com/app-generator/sample-react-mui-introduction","last_synced_at":"2026-04-02T18:45:32.994Z","repository":{"id":63768607,"uuid":"479035310","full_name":"app-generator/sample-react-mui-introduction","owner":"app-generator","description":"React MUI - Learn by Coding (Blog Article) | AppSeed","archived":false,"fork":false,"pushed_at":"2025-05-02T15:48:54.000Z","size":483,"stargazers_count":20,"open_issues_count":0,"forks_count":17,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-07T18:52:09.733Z","etag":null,"topics":["appseed-sample","mui","react","react-sample"],"latest_commit_sha":null,"homepage":"https://app-generator.dev/","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/app-generator.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","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":"2022-04-07T15:06:25.000Z","updated_at":"2025-05-02T15:48:58.000Z","dependencies_parsed_at":"2024-10-27T19:21:15.607Z","dependency_job_id":"265f5def-c5e3-4276-94d7-4c025577930f","html_url":"https://github.com/app-generator/sample-react-mui-introduction","commit_stats":null,"previous_names":[],"tags_count":2,"template":true,"template_full_name":null,"purl":"pkg:github/app-generator/sample-react-mui-introduction","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/app-generator%2Fsample-react-mui-introduction","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/app-generator%2Fsample-react-mui-introduction/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/app-generator%2Fsample-react-mui-introduction/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/app-generator%2Fsample-react-mui-introduction/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/app-generator","download_url":"https://codeload.github.com/app-generator/sample-react-mui-introduction/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/app-generator%2Fsample-react-mui-introduction/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31313305,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-02T12:59:32.332Z","status":"ssl_error","status_checked_at":"2026-04-02T12:54:48.875Z","response_time":89,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["appseed-sample","mui","react","react-sample"],"created_at":"2024-10-10T04:43:44.286Z","updated_at":"2026-04-02T18:45:32.988Z","avatar_url":"https://github.com/app-generator.png","language":"JavaScript","readme":"# [React MUI Introduction](https://blog.appseed.us/mui-react-coding-landing-page/)\n\nSample Code for the blog article [React MUI Components - Learn by Coding](https://blog.appseed.us/mui-react-coding-landing-page/) - Provided by **[App-Generator](https://app-generator.dev/)**.\n\nThe article explains how to use the MUI library in React.js by building a responsive website. The website will be built with MUI components only, no HTML element will be used.\n\n- 👉 [React MUI Landing Page](https://react-mui-landing-page.appseed-srv1.com/) - LIVE Demo\n- 👉 [React Apps](https://app-generator.dev/product/?search=react) - index provided by **[App-Generator](https://app-generator.dev/)**\n\n\u003cbr /\u003e\n\n## How to use it \n\n- Install `NodejS` - version 14.x or higher \n- Install dependencies via `yarn`\n- Start the project: `yarn start` \n\n\u003cbr /\u003e\n\n![React MUI Introduction - Sample Page crafted with MUI.](https://user-images.githubusercontent.com/51070104/163208108-81305831-7bee-4cdf-ba44-6382c31e58a6.gif)\n\n\u003cbr /\u003e\n\n## Components\n\n- `Header` \n- `Hero`\n- `Info Section`\n- `AboutUs`\n- `Testimonial`\n- `ContactUs`\n- `Footer`   \n\n\u003cbr /\u003e\n\n## [Getting Started with React](https://app-generator.dev/docs/technologies/react/index.html)\n\nReact.js is a JavaScript library that allows you to build fast and efficient web applications using the minimum amount of code possible. In React.js, you can break the web layout into components - reusable bits of code that return HTML elements. \n\n- 👉 [JavaScript concepts for React Beginners](https://blog.appseed.us/10-javascript-concepts-for-react-beginners/)\n\n\u003cbr /\u003e\n\n## 🚀 [Free MUI Templates](https://www.admin-dashboards.com/react-mui-template-open-source/)  \n\nFor those that search for a fully-fledged MUI Templates, here are some (all free). \n\n\u003cbr /\u003e\n\n### 👉 [Material Dashboard MUI](https://demos.creative-tim.com/material-dashboard-react/#/dashboard?AFFILIATE=128200) `LIVE Demo`\n\nIf you’re a developer looking to create an admin dashboard that is developer-friendly, rich with features, and highly customisable, here is your match. Material Dashboard 2 React is built with over 70 frontend individual elements, like buttons, inputs, navbars, nav tabs, cards, or alerts, giving you the freedom of choosing and combining.\n\n- 👉 [MUI React Dashboard](https://www.creative-tim.com/product/material-dashboard-react?AFFILIATE=128200) - `Product page`\n- 👉 [MUI React Dashboard](https://demos.creative-tim.com/material-dashboard-react/#/dashboard?AFFILIATE=128200) - `LIVE Demo`\n\n[![Free MUI Template - Material Dashboard by Creative-Tim.](https://user-images.githubusercontent.com/51070104/222799990-38749aaa-ed0f-428f-96e4-c722fff76795.png)](https://www.creative-tim.com/product/material-dashboard-react?AFFILIATE=128200)\n\n\u003cbr /\u003e\n\n### 👉 [Material Kit React MUI](https://demos.creative-tim.com/material-kit-react/#/presentation?AFFILIATE=128200)  `LIVE Demo`\n\nThis free MUI \u0026 React template is coming with pre-built design blocks, so the development process is seamless, switching from our pages to the real website is very easy to be done.\n\n- 👉 [Material Kit 2 React](https://www.creative-tim.com/product/material-kit-react?AFFILIATE=128200) - `Product page`\n- 👉 [Material Kit 2 React](https://demos.creative-tim.com/material-kit-react/#/presentation?AFFILIATE=128200) - `LIVE Demo`\n\n[![Free MUI Template - Material Kit 2 React by Creative-Tim.](https://user-images.githubusercontent.com/51070104/222800859-d24edd3f-6176-4502-adb7-b989bb9527b9.png)](https://www.creative-tim.com/product/material-kit-react?AFFILIATE=128200)\n\n\u003cbr /\u003e\n\n### 👉 [Argon Dashboard MUI](https://demos.creative-tim.com/argon-dashboard-material-ui/#/dashboard?AFFILIATE=128200) `LIVE Demo`\n\nThis Free MUI Dashboard is coming with prebuilt design blocks, so the development process is seamless, switching from our pages to the real website is very easy to be done. If you want to get inspiration or just show something directly to your clients, you can jump-start your development with our pre-built example pages.\n\n- 👉 [Argon Dashboard 2 MUI](https://www.creative-tim.com/product/argon-dashboard-material-ui?AFFILIATE=128200) - `Product page`\n- 👉 [Argon Dashboard 2 MUI](https://demos.creative-tim.com/argon-dashboard-material-ui/#/dashboard?AFFILIATE=128200) - `LIVE Demo`\n\n[![Free MUI Template - Argon MUI Dashboard by Creative-Tim.](https://user-images.githubusercontent.com/51070104/222801354-50a3468d-20dc-4cea-a61b-d91aee276834.png)](https://www.creative-tim.com/product/argon-dashboard-material-ui?AFFILIATE=128200)\n\n\u003cbr /\u003e\n\n--- \n[React MUI Introduction](https://blog.appseed.us/mui-react-coding-landing-page/) - provided by **[App-Generator](https://app-generator.dev/)**. \n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fapp-generator%2Fsample-react-mui-introduction","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fapp-generator%2Fsample-react-mui-introduction","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fapp-generator%2Fsample-react-mui-introduction/lists"}