You're Invited:Meet the Socket Team at BlackHat and DEF CON in Las Vegas, Aug 4-6.RSVP →
react-mvvm-architecture
Advanced tools
react-mvvm-architecture - npm Package Compare versions
Comparing version 1.0.31 to 1.0.32
| { | ||
| "name": "react-mvvm-architecture", | ||
| "version": "1.0.31", | ||
| "version": "1.0.32", | ||
| "description": "React MVVM Architecture is a simple and opinionated custom React framework that provides a solid foundation for building modern, efficient, and scalable React applications following the principles of MVVM (Model-View-ViewModel) and Clean Architecture. It aims to simplify the setup process and offers a well-organized project structure to help developers get started quickly.", | ||
@@ -10,3 +10,3 @@ "main": "index.js", | ||
| "bin": { | ||
| "react-mvvm-architecture": "./create-my-react-app" | ||
| "react-mvvm-app": "./create-my-react-app" | ||
| }, | ||
@@ -13,0 +13,0 @@ "keywords": ["react", "mvvm architecture", "clean-architecture", "framework", "zustand", "react-query", "typescript", "scalable", "aamir mansuri"], |
@@ -1,9 +0,21 @@ | ||
| # React MVVM Architecture | ||
| # React MVVM Architecture (Beta) | ||
| React MVVM Architecture is a simple and opinionated custom React framework that provides a solid foundation for building modern, efficient, and scalable React applications following the principles of MVVM (Model-View-ViewModel) and Clean Architecture. It aims to simplify the setup process and offers a well-organized project structure to help developers get started quickly. | ||
| React MVVM Architecture is a simple and opinionated custom React framework that provides a solid foundation for building modern, efficient, and scalable React applications following the principles of MVVM (Model-View-ViewModel). It aims to simplify the setup process and offers a well-organized project structure to help developers get started quickly. | ||
| ## Getting Started | ||
| To use React MVVM Architecture, you can create a new React app by running the following command: | ||
| ```bash | ||
| npx react-mvvm-app my-new-app | ||
| ``` | ||
| Replace `my-new-app` with the desired name for your project. | ||
| After running the command, your new React app will be created with TypeScript support, Zustand, and React Query installed. The `App.tsx` file will be customized to include the setup for React Query. | ||
| ## Features | ||
| - Bootstrap new React projects with TypeScript support and pre-installed packages like Zustand and React Query. | ||
| - Provides a structured project organization for better code maintainability and scalability, following the MVVM and Clean Architecture principles. | ||
| - Provides a structured project organization for better code maintainability and scalability, following the MVVM principles. | ||
| - Customized `App.tsx` file with React Query setup to handle data fetching seamlessly. | ||
@@ -22,15 +34,5 @@ | ||
| ├── src/ <-- Source code for the React app | ||
| │ ├── app/ <-- Application-specific use cases | ||
| │ │ └── usecases/ | ||
| │ │ └── todo/ | ||
| │ │ ├── TodoUseCase.ts | ||
| │ │ └── TodoUseCaseImpl.ts | ||
| │ ├── data/ <-- Data layer and repository implementations | ||
| │ │ └── TodoRepository.ts | ||
| │ │ └── TodoRepositoryImpl.ts | ||
| │ ├── domain/ <-- Domain models and entities | ||
| │ │ └── Todo.ts | ||
| │ ├── hooks/ <-- Custom hooks | ||
| │ │ └── useApi.ts | ||
| │ ├── presentation/ <-- Components for rendering UI | ||
| │ ├── models/ <-- Models for data representation | ||
| │ │ └── Todo.ts <-- Example model (Todo) | ||
| │ ├── view/ <-- React components for rendering UI | ||
| │ │ ├── components/ | ||
@@ -40,2 +42,7 @@ │ │ │ └── TodoItem.tsx | ||
| | | | ||
| │ ├── viewmodels/ <-- ViewModels to manage view logic and state | ||
| │ │ ├── TodoViewModel.ts | ||
| │ │ └── index.ts <-- Entry point to export viewmodels | ||
| │ ├── services/ <-- Services for data handling and API calls | ||
| │ │ └── TodoService.ts | ||
| │ ├── App.css | ||
@@ -77,10 +84,4 @@ │ ├── App.tsx <-- Customized entry point for the React app | ||
| My name is Aamir Mansuri, and I am a React JS Developer passionate about building efficient and maintainable web applications. This custom React framework, inspired by the MVVM and Clean Architecture principles, is my contribution to the developer community, and I hope it helps you kickstart your React projects with ease and productivity. | ||
| My name is Aamir Mansuri, and I am a React JS Developer passionate about building efficient and maintainable web applications. This custom React framework, inspired by the MVVM principles, is my contribution to the developer community, and I hope it helps you kickstart your React projects with ease and productivity. | ||
| ## Acknowledgments | ||
| React MVVM Architecture aims to simplify the setup process and provide a solid foundation for building React applications with Zustand and React Query. It is inspired by the principles of MVVM and Clean Architecture, offering a more structured and efficient way to kickstart new React projects. | ||
| --- | ||
| Happy coding! |
No alert changes
Improved metrics
- Number of lines in readme file
84
1.2%Worsened metrics
- Total package byte prevSize
7115
-1.34%No dependency changes