# react-vitae-material-theme

> The Material Theme for react-vitae, build resumes using the material-ui framework and react-vitae.

Latest version **1.0.7** (published 2022-04-02) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-vitae-material-theme
pnpm add react-vitae-material-theme
yarn add react-vitae-material-theme
bun add react-vitae-material-theme
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.7 |
| Published | 2022-04-02 |
| First published | 2019-06-14 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 1.2 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 21 |
| Author | Guillaume St-Pierre |
| Maintainers | minivera |
| Keywords | react, resume, json-resume, material-ui, theme |

## Links

- npm: https://www.npmjs.com/package/react-vitae-material-theme
- Repository: https://github.com/Minivera/react-vitae
- Homepage: https://github.com/Minivera/react-vitae#readme
- Issues: https://github.com/Minivera/react-vitae/issues
- npm.io page: https://npm.io/package/react-vitae-material-theme

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 1.0.7 (latest) — 2022-04-02
- 1.0.6 — 2022-03-06
- 1.0.5 — 2022-03-06
- 1.0.3 — 2020-10-26
- 1.0.2 — 2020-06-04
- 1.0.0 — 2019-06-14

## README

# React vitae Material theme

![npm](https://img.shields.io/npm/v/react-vitae-material-theme.svg) ![npm bundle size](https://img.shields.io/bundlephobia/minzip/react-vitae-material-theme.svg)

`react-vitae-material-theme` is the Material Design theme for [react-vitae](https://github.com/Minivera/react-vitae).

## Installation

You can install `react-vitae-material-theme` with NPM or Yarn.

`npm install --save react-vitae @material-ui/core react-vitae-material-theme` or `yarn add react-vitae @material-ui/core react-vitae-material-theme`

## Peer dependencies

`react-vitae-material-theme` requires an installation of the latest version of `react-vitae` and [Material-ui](https://material-ui.com/getting-started/installation/).

## Usage

`react-vitae-material-theme` includes a main component to quickly create your resume and a set of smaller components to allow you to customize the resume.

### The `Resume` component

The `Resume` component is a ready made page that will build the entire resume from the valid resume.json file provided to it. It uses the various components exported by this package to create the resume.

```jsx harmony
import { Resume } from 'react-vitae-material-theme';

const App = () => <Resume resume={json - resume} />;
```

### Individual components

The package exports individual components used as the building blocks for the main `Resume` component, feel free to import them. They need to be added inside of a `ResumeProvider` from `react-vitae`.

```jsx harmony
import React from 'react';
import { ResumeProvider } from 'react-vitae';
export {
  Profiles,
  Personal,
  Skills,
  Languages,
  Interests,
  References,
  WorkList,
  VolunteerList,
  EducationList,
  ProjectsList,
  AwardsList,
  PublicationsList,
} from 'react-vitae-material-theme';

export const App = () => (
  <ResumeProvider resume={resume}>{/* Include any of hte imported components here */}</ResumeProvider>
);
```

## Development

### Installation

The installation of dependencies is made from the monorepo's root using lerna, see the commands there for more information on dependencies.

### Demo Development Server

`npm start` will run a development server at [http://localhost:1234](http://localhost:1234) with hot module reloading.

### Running Lint

`npm lint` will run eslint in this package.

### Running Tests

`npm test` will run the tests in this packages.

### Building

`npm run build` will build the package and create the built files in the `dist` folder.

`npm run clean` will clean the package, removing the cache, `node_modules` and built resources.

### Publishing

Publishing is done automatically through travis.

---
_Source: https://npm.io/package/react-vitae-material-theme · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
