React Code39 Barcode

This app is here to highlight what the react-code39-barcode library can do. Every barcode you see is created using this library. I hope you'll find it helpful in some way!

This project started when I had to create loads of Code39 barcodes for different parts and then print them as PDFs. But the existing options weren't cutting it - they were slow and didn't support server-side rendering. So, I whipped up a nifty little React component to solve my problem! I'd love to hear what you think about it - any feedback is more than welcome!

Installation

npm i react-code39-barcode

Usage

  
  import React from 'react';  
  import { Barcode39Svg } from 'react-code39-barcode';  

  export default function App() { 
    return (  
      <div> 
        <Barcode39Svg value='123456789' />  
      </div>  
    );  
  };

Output

Props

Prop	Type	Default	Description
value	string	-	The value to be encoded as a Code39 barcode.
width	number	1	The width of each bar in pixels.
height	number	60	The height of the barcode in pixels.
fontSize	number	16	The font size of the text displayed below the barcode.
fontFamily	string	'monospace'	The CSS font family of the text displayed below the barcode.
fontWeight	string	'500'	The CSS font weight of the text displayed below the barcode.
color	string	"black"	The color of the barcode.
textColor	string	"black"	The color of the text displayed below the barcode if different from the color.
showText	boolean	true	Whether to display the text below the barcode.
lineSpacing	number	-	The spacing between the display text and the barcode.
className	string	-	Any valid css class that will be applied to the barcode container.
id	string	-	HTML id for the barcode container.
style	React.CSSProperties;		React CSS properties that will apply to the barcode container.

License

This project is licensed under the MIT License.