https://github.com/voidnerd/parag.js
Template Engine for nodejs.
https://github.com/voidnerd/parag.js
Last synced: 10 months ago
JSON representation
Template Engine for nodejs.
- Host: GitHub
- URL: https://github.com/voidnerd/parag.js
- Owner: voidnerd
- License: mit
- Created: 2022-10-24T03:26:10.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-11-19T10:21:30.000Z (about 3 years ago)
- Last Synced: 2024-11-15T10:57:48.708Z (about 1 year ago)
- Language: TypeScript
- Homepage:
- Size: 104 KB
- Stars: 10
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Parag.js
Parag.js is a fast and lightweight template engine for nodejs with zero dependencies. It offers you tags that make interpolating javascript into your `HTML` look clean and readable, even with nested conditionals and loops.
## Installation
```bash
npm install parag
```
## Usage
Below is an example of how to use parag
```js
const Parag = require('parag');
const data = {
title: 'The matrix',
year: '1999',
};
const result = Parag.render('
{{title}} was released in {{year}}
', data);
console.log(result); // => The matrix was released in 1999
```
Same code with typescript
```ts
import * as Parag from 'parag';
const data: Record = {
title: 'The matrix',
year: '1999',
};
const result: string = Parag.render('
{{title}} was released in {{year}}
', data);
console.log(result); // => The matrix was released in 1999
```
We recommend that you use the `renderFile` function as it is cached on first render.
```js
const Parag = require('parag');
const user = {
name: 'Void',
};
const result = Parag.renderFile('./example/hello.parag', user);
console.log(result); // =>
Hello Void
```
#### Usage with express
```js
const express = require('express');
const app = express();
const port = 3000;
app.set('views', './view');
app.set('view engine', 'parag');
app.get('/', (req, res) => {
res.render('hello', { name: 'void' });
});
app.listen(port, () => {
console.log(`Example app listening on port ${port}`);
});
```
#### Make vscode treat parag file extensions as html
1. Go to Code > Preferences > Settings
2. Search "File associations"
3. Click on "Add Item"
4. Add (`*.parag`) as extension(item) and `html` as associated language(value).
# Features
### Interpolation
All results are escaped by default.
```html
Hello {{name}}
```
If it's javascript, parag will interpolate the result.
```html
{{["rice", "beans"].join(",")}}
{{new Date()}}
```
You can also render unescaped results
```html
{{! article.body !}}
```
### Conditionals
Simple if statement
```html
@if(user)
{{user.name}}
@endif
```
if, else if and else chain.
```html
@if(user.age > 21)
Proper adult
@elseif(user.age > 18 && user.age < 21)
Early adult
@else
Kid
@endif
```
### Loops and Iteration
- For..of loop statement
```html
- {{user.name}}
@for(let user of users)
@endfor
```
- For...in loop statement
```html
- {{user[prop]}}
@for(let prop in user)
@endfor
```
- for loop statement
```html
- {{ "count: " + i }}
@for(let i = 0; i < 5; i++)
@endfor
```
### Comments
Comments are not included in rendered result
```
{# This is a comment #}
```
### Partials
You can render partials in your template with the `@include` tag.
```js
@include("partials/header")
```
A partial inherits all data properties of its parent template. You can also pass extra data to partials with an object.
```js
@include("partials/footer", {year: "2022"})
```
### Parag with Frontend Libraries
For libraries that conflict with this template engine, you can use the `@` symbol to render content as is.
```js
const result = Parag.render('
Count: @{{ count }}
');console.log(result); //
Count: {{ count }}
```
## License
This project is licensed under the MIT license. See the [LICENSE](LICENSE) file for more info.