https://github.com/aakashdinkarh/smart-components-dinkar
This project contains a collection of smart components designed to ease your web application development by providing reusable and efficient solutions for common UI patterns. You can see the tutorials and components usage from the link provided below.
https://github.com/aakashdinkarh/smart-components-dinkar
react react-components react-library resuable-component smart-components typescript-react ui-components
Last synced: 5 months ago
JSON representation
This project contains a collection of smart components designed to ease your web application development by providing reusable and efficient solutions for common UI patterns. You can see the tutorials and components usage from the link provided below.
- Host: GitHub
- URL: https://github.com/aakashdinkarh/smart-components-dinkar
- Owner: aakashdinkarh
- License: mit
- Created: 2023-09-04T10:59:55.000Z (almost 3 years ago)
- Default Branch: master
- Last Pushed: 2024-10-02T12:17:33.000Z (over 1 year ago)
- Last Synced: 2024-10-29T20:56:36.598Z (over 1 year ago)
- Topics: react, react-components, react-library, resuable-component, smart-components, typescript-react, ui-components
- Language: TypeScript
- Homepage: https://devdinkar-codebook.vercel.app/
- Size: 1010 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: changelog.md
- License: LICENSE
- Code of conduct: CODE_OF_CONDUCT.md
- Codeowners: .github/CODEOWNERS
Awesome Lists containing this project
README
# Smart Components Dinkar
Live Demo:
DevDinkar CodeBook
A monorepo containing a collection of smart React components and their interactive playground. This repository provides reusable UI components designed to enhance web application development with a focus on modularity, flexibility, and ease of integration.
## 📦 Repository Structure
This monorepo contains two main packages:
- **`packages/library`** - The npm package containing reusable React components
- **`packages/app`** - The playground/demo application showcasing component usage
## 🚀 Quick Start
### Prerequisites
- Node.js >= 16
- npm >= 8
### Installation
1. Clone the repository:
```bash
git clone https://github.com/aakashdinkarh/smart-components-dinkar.git
cd smart-components-dinkar
```
2. Install dependencies for all packages:
```bash
npm run bootstrap
```
## 🛠️ Development
### Run Development Environment
Start both the library watcher and playground app:
```bash
npm run dev
```
This will:
- Watch and rebuild the library package on changes
- Start the playground app at http://localhost:3000
### Individual Package Commands
**Library Package:**
```bash
# Build the library
npm run build:lib
# Watch mode for library development
npm run watch --workspace=packages/library
```
**App Package:**
```bash
# Start the playground app
npm run start --workspace=packages/app
# Build the playground app
npm run build:app
```
### Linting
```bash
# Lint all packages
npm run lint
# Lint specific package
npm run lint --workspace=packages/library
npm run lint --workspace=packages/app
```
## 📚 Documentation
- **Component Documentation:** [DevDinkar CodeBook](https://devdinkar-codebook.vercel.app/)
- **NPM Package:** [smart-components-dinkar](https://www.npmjs.com/package/smart-components-dinkar)
## 🏗️ Build
Build all packages:
```bash
npm run build
```
## 📝 Contributing
1. Fork the repository
2. Create a feature branch
3. Make your changes
4. Run tests and linting
5. Submit a pull request
## 📄 License
ISC License - see [LICENSE](LICENSE) file for details.