@nodeblocks/frontend-create-product-block

🚀 Nodeblocks Frontend Starter Kit

Welcome to the Nodeblocks Frontend Starter Kit! 🎉 This kit is designed to make building frontend libraries in React super easy, helping you streamline your development workflow with minimal fuss. Let's dive in! 🤿

✨ Features

• 🚀 Bundling with Rollup: Get a clean, minimalistic approach to bundling your JavaScript files for smoother frontend development.
• 💙 TypeScript Support: We've included a pre-configured tsconfig.json to ensure your TypeScript setup is strict, efficient, and ready to go.
• ⚙️ Peer Dependencies: Keep bundle sizes lean with React and React DOM set as peer dependencies.
• 🎨 CSS Support: Easily import and process CSS files, giving you more control over your styles.

🛠️ How to Use

• Clone this repository 🌀:

  git clone <repository-url>
  cd <repository-directory>
  

• Install dependencies 📦:

  npm install
  

• Start development 🛠️:

  npm run watch
  

• Build for production 🏗️:

  npm run build
  

🧪 How to Test

The test folder contains examples that demonstrate how to use the libraries you create with this starter kit. These examples show compatibility with various bundlers, such as:

• Create React App (Webpack)
• Vite ⚡
• Rollup (itself) (Coming soon) 🔄
• Parcel (Coming soon) 📦

This ensures Nodeblocks libraries integrate seamlessly with different workflows. 🛠️✨

Before running each project make sure you run npm link:

• In the root of this project:

  npm link
  

• In the test project you want to run:

  npm i
  npm link @basaldev/frontend-starter-kit
  

  (Note that in real life your library would not be called frontend-starter-kit.)

• Then you can follow your usual workflow either with Create React App (npm start) or with Vite (npm run dev). This will give you a development environment where whenever you change your library it will be available in your test project.