Leanpub Header

Skip to main content
Go to Leanpub.comLeanpub

Material for Creating NPM Package with ReactJS

The Complete Step-by-Step Course to Build, Test, and Publish React Libraries

CodeSweetly

The author is letting you choose the price you pay for this book!

Pick Your Price...
PDF
EPUB
WEB
100
Pages
About

About

About the Book

Share this book

Categories

Computers and ProgrammingJavaScriptReactSoftwareGitCookbooksWeb DevelopmentNon-FictionTextbooks

Feedback

Email the author

License

Creative Commons Attribution 4.0 International License

Price

Pick Your Price...

Minimum price

$19.00

$29.00

You pay

$29.00

Author earns

$23.20
$

All prices are in US $. You can pay in US $ or in your local currency when you check out.

EU customers: prices exclude VAT, which is added during checkout.

...Or Buy With Credits!

Number of credits (Minimum 2)

2
The author will earn $24.00 from your purchase!
You can get credits monthly with a Reader Membership

Author

About the Author

CodeSweetly

Learning to be a software developer can sometimes feel overwhelming or tedious, but CodeSweetly is here to help.

Unlike other resources, CodeSweetly helps you become a confident developer by simplifying technical concepts and presenting them in a way that supports your unique learning style, so you can focus on coding sweetly.

We break down programming topics with clear tutorials, examples, cheat sheets, and illustrations made to make complex ideas easier to grasp. Our approach centers on clarity and simplicity for your success.

Whether you’re new to coding or a pro, CodeSweetly makes learning to code easier and more enjoyable.

Contents

Table of Contents

Introduction

  1. Welcome to the World of NPM Packages!
  2. Why This Course Will Help You
  3. What You Will Build
  4. Use the Right Tools
  5. What You Should Know First
  6. Got Questions?
  7. Let’s Get Started!

Project Configuration

  1. 1. Set Up Your System
  2. 2. Create a Project Directory
  3. 3. Create a package.json File
  4. 4. Initialize a Git Repository
  5. 5. Specify the Files Git Should Ignore
  6. 6. Stage and Commit Your Project’s Changes to Git
  7. 7. Configure a GitHub Remote Repository
  8. 8. Push Your Local Git Directory to the Remote Repo
  9. 9. Install React as a dev-dependency
  10. Why Install React as a Package’s Dev-Dependency?
  11. Exercise 1
  12. Quiz 1

Testing React Component

  1. 1. Install the Testing Tools
  2. 2. Specify Jest as Your Project’s Test Runner Tool
  3. 3. Install the Code Compiler
  4. 4. Configure Babel to Compile Your Code
  5. 5. Configure Jest’s Testing Environment
  6. 6. Create Your Code Files
  7. 7. Write Your Test Case
  8. 8. Develop Your React Component
  9. 9. Run the Test
  10. Exercise 2
  11. Quiz 2

Commit Message Configuration

  1. Conventional Commits Messages Syntax
  2. Enforcing the Conventional Commits Format
  3. Setting up Husky
  4. Creating a Hook to Auto-Lint Commit Messages
  5. Exercise 3
  6. Quiz 3

Setting Up GitHub Action

  1. 1. Create a GitHub Action Workflow File
  2. 2. Define the GitHub Action Workflow
  3. 3. Test the GitHub Action Workflow
  4. Exercise 4
  5. Quiz 4

Styling React Components

  1. 1. Create the Stylesheet
  2. 2. Apply CSS Styles to Your Component
  3. 3. Loading CSS Files to Jest’s JSDOM
  4. 4. Run the Test
  5. Exercise 5
  6. Quiz 5

Compiling React to JavaScript

  1. Exercise 6
  2. Quiz 6

Distinguishing Source and Distribution Code

  1. Exercise 7
  2. Quiz 7

Defining Package’s Entry Point

  1. Quiz 8

Local Testing of Unpublished Package

  1. 1. Link-Install Your Package Globally in Your System
  2. 2. Create a NextJS Demo Website for Testing Your Package
  3. 3. Install Your Package from Your System’s Global Folder to the Test-App
  4. 4. Use the Link-Installed Package in the Test-App
  5. 5. Unlink Your Package from the Test-App
  6. 6. Unlink Your Package from the Global Folder
  7. Exercise 8
  8. Quiz 9

Creating README

  1. Exercise 9
  2. Quiz 10

Creating LICENSE

  1. Exercise 10
  2. Quiz 11

Publishing Package to NPM

  1. 1. Search Engine Optimization (SEO)
  2. 2. Specify the Files You Want to Publish to NPM
  3. 3. Confirm the Files NPM Will Publish
  4. 4. Confirm That You Have Passing Tests
  5. 5. Compile Any Pending Code
  6. 6. Stage and Commit Any Recent Changes
  7. 7. Push Your Local Git Directory to the Remote Repo
  8. 8. Sign In or Sign Up on the NPM Website
  9. 9. Log In to NPM via the Terminal
  10. 10. Confirm If Your Package’s Name Is Available
  11. 11. Publish Your Package!
  12. Exercise 11
  13. Quiz 12

Local Testing of the Published Package

  1. 1. Install the Package
  2. 2. Import the Package
  3. 3. Run Your Local Server
  4. Exercise 12
  5. Quiz 13

Production Testing of the Published Package

  1. 1. Stage and Commit Your Changes
  2. 2. Set Up a GitHub Remote Repository for Your NextJS Test-App
  3. 3. Push Your Local Git Directory to the Remote Repo
  4. 4. Sign In or Sign Up on the Vercel Website
  5. 5. Deploy Your Project to Vercel’s Server
  6. 6. Test the Package on the Live Demo Website
  7. Quiz 14

Updating Package’s Versions

  1. Example 1: Updating to a Patch Version
  2. Example 2: Updating to a Minor Version
  3. Example 3: Updating to a Major Version
  4. Exercise 13
  5. Quiz 15

Automating Version Management

  1. How to Release Your Package’s Latest Version
  2. How to Overwrite Release-It’s Default Configurations
  3. How Release-It Determines Your Package’s Latest Version
  4. How to Provide Release-It with a Recommended Version
  5. Exercise 14
  6. Quiz 16

Automating Changelog Management

  1. Quiz 17

Automating GitHub Releases

  1. 1. Get a GitHub Personal Access Token
  2. 2. Copy the Generated Token
  3. 3. Create a GitHub Environment Variable
  4. 4. Tell Release-It Your GitHub Token’s Name
  5. 5. Make the GitHub Secret Available Locally in Your Project
  6. 6. Prevent Git from Monitoring the Environment File
  7. 7. Install the Plugin for Loading the .env File
  8. 8. Load the .env File While Releasing Your Project’s Latest Version
  9. 9. Stage and Commit Your Changes
  10. Exercise 15
  11. Quiz 18

Epilogue

  1. What’s Next?
  2. One Last Favor

Get the free sample chapters

Click the buttons to get the free sample in PDF or EPUB, or read the sample online here

Download Sample PDFDownload Sample EPUB

The Leanpub 60 Day 100% Happiness Guarantee

Within 60 days of purchase you can get a 100% refund on any Leanpub purchase, in two clicks.

Now, this is technically risky for us, since you'll have the book or course files either way. But we're so confident in our products and services, and in our authors and readers, that we're happy to offer a full money back guarantee for everything we sell.

You can only find out how good something is by trying it, and because of our 100% money back guarantee there's literally no risk to do so!

So, there's no reason not to click the Add to Cart button, is there?

See full terms...

Earn $8 on a $10 Purchase, and $16 on a $20 Purchase

We pay 80% royalties on purchases of $7.99 or more, and 80% royalties minus a 50 cent flat fee on purchases between $0.99 and $7.98. You earn $8 on a $10 sale, and $16 on a $20 sale. So, if we sell 5000 non-refunded copies of your book for $20, you'll earn $80,000.

(Yes, some authors have already earned much more than that on Leanpub.)

In fact, authors have earned over $14 million writing, publishing and selling on Leanpub.

Learn more about writing on Leanpub

Free Updates. DRM Free.

If you buy a Leanpub book, you get free updates for as long as the author updates the book! Many authors use Leanpub to publish their books in-progress, while they are writing them. All readers get free updates, regardless of when they bought the book or how much they paid (including free).

Most Leanpub books are available in PDF (for computers) and EPUB (for phones, tablets and Kindle). The formats that a book includes are shown at the top right corner of this page.

Finally, Leanpub books don't have any DRM copy-protection nonsense, so you can easily read them on any supported device.

Learn more about Leanpub's ebook formats and where to read them

Write and Publish on Leanpub

You can use Leanpub to easily write, publish and sell in-progress and completed ebooks and online courses!

Leanpub is a powerful platform for serious authors, combining a simple, elegant writing and publishing workflow with a store focused on selling in-progress ebooks.

Leanpub is a magical typewriter for authors: just write in plain text, and to publish your ebook, just click a button. (Or, if you are producing your ebook your own way, you can even upload your own PDF and/or EPUB files and then publish with one click!) It really is that easy.

Learn more about writing on Leanpub