wayofjs
v4.1.0
Published
A library for managing models and views
Downloads
17
Maintainers
Readme
Based on the structure and content of the repository, here is a well-written README.md
for the Primora-js project:
# Primora-js
Primora-js is a lightweight JavaScript library designed to manage models and views efficiently. It provides robust tools for synchronizing data, event handling, and view rendering, making it easier to build dynamic web applications.
## Features
- **Model Management**: Easily create and manage data models with built-in support for attributes, event handling, and synchronization with a backend API.
- **View Rendering**: Render dynamic views using templates and manage updates efficiently.
- **Routing**: Simple yet powerful routing for single-page applications (SPA).
## Installation
You can install Primora-js via npm:
```bash
npm install primora-js
Usage
Setting Up Models
Primora-js provides a set of classes to define and manage your data models.
import { Model, ApiSync, Attributes, Eventing } from 'primora-js';
interface UserProps {
id?: number;
name?: string;
age?: number;
}
const rootUrl = 'http://localhost:3000/users';
const user = new Model<UserProps>(
new Attributes<UserProps>({ id: 1, name: 'John Doe', age: 30 }),
new Eventing(),
new ApiSync<UserProps>(rootUrl)
);
// Fetch user data
user.fetch();
Creating Views
Views in Primora-js can be created using HTML templates. You can also use EJS templates if needed.
import { View } from 'primora-js';
class UserView extends View<User, UserProps> {
template(): string {
return `
<div>
<h1>User Detail</h1>
<p>Name: ${this.model.get('name')}</p>
<p>Age: ${this.model.get('age')}</p>
</div>
`;
}
}
const userView = new UserView(document.getElementById('root'), user);
userView.render();
Setting Up Routing
Primora-js includes a simple router to manage navigation in single-page applications.
import { Router } from 'primora-js';
const router = new Router();
router.addRoute('/home', () => {
console.log('Home page');
});
router.addRoute('/about', () => {
console.log('About page');
});
// Navigate to a route
router.navigate('/home');
Development
To build the project, run:
npm run build
Contributing
Contributions are welcome! Please open an issue or submit a pull request for any improvements or bug fixes.
License
This project is licensed under the MIT License.
Author
Your Name
Acknowledgments