Overview
The UI Kit - The FrontMaterial React Landing Pages Kit is a professional React Kit created with Material-UI’s components and React. It is designed to simplify and accelerate the app development process by providing a collection of ready-to-use Material-UI components. Each component is fully customizable, responsive, and easy to integrate. The UI Kit is built with React, Material-UI v4, and uses React Scripts as a starting point.
Features
- Ready-to-use Material-UI components
- Fully customizable, responsive, and easy to integrate
- Component-centric atomic design architecture
- Browsersync live reload
- Fully responsive on all modern browsers
- Rich documentation with code samples and parameters/options
- Beautiful, modern style suitable for most brands
- Included Sketch design file with styles, color styles, and components
- Free-to-use licensed images
- Icon set provided by Font Awesome Kit
Installation
To use the UI Kit, follow these steps:
- Make sure your NodeJS and npm versions are up to date for React 16.8.6.
- Download the theme.
- Install dependencies by running
npm installin the root folder. - Start the server by running
npm run start. - Access the views at
localhost:3000. - Build for production by running
npm run build.
The UI Kit has a specific folder structure:
- public: Contains the public assets, images, and index.html file.
- src: Contains the main business logic of the theme.
- components: Contains reusable and stand-alone components based on the Atomic Design Methodology.
- atoms: Small functional components that do not use any other atomic components.
- molecules: Functional components that have dependencies on other atoms.
- organisms: Functional components that use other molecules and atoms.
- layouts: Contains the main and minimal layouts.
- theme: Contains overrides of the default color palette and typography from Material-UI.
- views: Contains all the available views/pages, which are combinations and compositions of reusable components and page representations.
- components: Contains reusable and stand-alone components based on the Atomic Design Methodology.
Summary
The UI Kit - The FrontMaterial React Landing Pages Kit is a comprehensive React Kit that utilizes Material-UI’s components. It provides a wide range of ready-to-use components that are fully customizable and responsive. The Kit follows a component-centric atomic design architecture, which makes customization and extension simple. It offers features such as browsersync live reload, extensive documentation, and a beautiful modern design suitable for various brands. The Kit is compatible with React, Material-UI v4, and supports create-react-app scripts.