Need help with react-pdf?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

diegomura
8.3K Stars 577 Forks MIT License 561 Commits 301 Opened issues

Description

📄 Create PDF files using React

Services available

!
?

Need anything else?

Contributors list

React renderer for creating PDF files on the browser and server

How to install

yarn add @react-pdf/renderer

How it works

import React from 'react';
import { Document, Page, Text, View, StyleSheet } from '@react-pdf/renderer';

// Create styles const styles = StyleSheet.create({ page: { flexDirection: 'row', backgroundColor: '#E4E4E4' }, section: { margin: 10, padding: 10, flexGrow: 1 } });

// Create Document Component const MyDocument = () => ( Section #1 Section #2 );

Web.
Render in DOM

import React from 'react';
import ReactDOM from 'react-dom';
import { PDFViewer } from '@react-pdf/renderer';

const App = () => ( );

ReactDOM.render(, document.getElementById('root'));

Node.
Save in a file

import React from 'react';
import ReactPDF from '@react-pdf/renderer';

ReactPDF.render(, ${__dirname}/example.pdf);

Examples

For each example, try opening

output.pdf
to see the result.

Text

Images

Resume

Fractals

Knobs

Page wrap

To run the examples, first clone the project and install the dependencies:

sh
git clone https://github.com/diegomura/react-pdf.git
cd react-pdf
yarn install
Then, run
yarn example -- 
sh
yarn example -- fractals

Contributors

This project exists thanks to all the people who contribute. [Contribute].

Sponsors

Thank you to all our sponsors! [Become a sponsors]

Backers

Thank you to all our backers! [Become a backer]

License

MIT © Diego Muracciole

FOSSA Status


We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.