React Awesome Resume



npm install react-awesome-resume semantic-ui-css

Include the stylesheet for semantic-ui in your project

import Resume from 'react-awesome-resume';
import 'semantic-ui-css/semantic.min.css';

Pass your props to the Resume

jsonResume [object]

jsonResume is an object in the JSON Resume format, see the example in person.js

theme [string]

theme is a string indicating which resume theme to use, currently the supported themes are:

inline [bool]

inline is a boolean value which indicates whether or not the resume is meant to be rendered inline with other content on the page or if it is meant to be fullscreen. If the Resume is rendered inline, it needs to be in a div that is at least 720px wide or else it will not display correctly.

Render the component with your person and your theme

import React from "react";
import ReactDOM from "react-dom";
import Resume from 'react-awesome-resume'
import 'semantic-ui-css/semantic.min.css';

const myJSONResume = {//...jsonResume}

  <Resume jsonResume={myJSONResume} theme="default" />,



  1. build and commit a new version, test in development
  2. make a production build of the component and the project that imports it, test
  3. build the project and deploy it to, test it
  4. yarn publish
  5. push