HTPL was born from one eternal internet debate:
"Is HTML a programming language or not?"
Instead of arguing forever... I decided to just build one. So here it is.
HyperText Programming Language (HTPL): looks like HTML, but actually behaves like a real programming language.
git clone https://github.com/DrelezTM/HTPL.git
cd HTPL
npm install
node bin/htpl.js <file.htpl>
Run Command Example:
node bin/htpl.js example/looping.htpl
Code:
<htpl>
<input name="name" prompt="Enter your name = "/>
<output message="Hi {{ name }}! welcome to HyperText Programming Language!"/>
</htpl>Response:
Want to see more cool HTPL programs and play with other example files? Check them out here
HTPL is like HTML, but it’s not a markup language - it’s just for fun! It supports variables, loops, conditions, functions, input/output, and basic control flow.
<set name="foo" value="'hello world'" />
<set name="bar" value="123" />let foo = "hello world";
const bar = 123;<input name="username" prompt="Enter your name: " />const readline = require('readline-sync');
const username = readline.question("Enter your name: ");<output message="Hello {{ username }}" />console.log(`Hello ${username}`);<if condition="foo == 'hello'">
<output message="It's hello!" />
</if>
<if condition="foo != 'hello'">
<output message="Not hello." />
</if>if(foo == "hello"){
console.log("It's hello!");
} else {
console.log("Not hello.");
}<for var="i" from="0" to="5">
<output message="Loop number {{ i }}" />
</for>for (let i = 0; i < 5; i++){
console.log("Loop number " + i);
}<for var="i" from="0" to="5">
<if condition="i == 3">
<break />
</if>
</for>for (let i = 0; i < 5; i++){
if(i == 3) break;
}<function name="greet" params="firstname,lastname">
<output message="Hello {{ firstname }}" />
<output message="Hi {{ lastname }}" />
</function>function greet(firstname, lastname){
console.log(`Hello ${firstname}`);
console.log(`Hi ${lastname}`);
}<call name="greet" args="'Yazid', 'Yusuf'"/>greet("Yazid", "Yusuf");Every HTPL program must be wrapped inside <htpl> … </htpl>.
For example:
<htpl>
<!-- Your HTPL code goes here -->
<set name="foo" value="'hello world'"/>
<output message="Hello {{ foo }}"/>
</htpl>- The tag is the root of your program.
- All variables, loops, functions, input/output must be inside this root tag.
- If you forget it, the interpreter will not run your code.
Think of as the "main container" for your program - everything lives inside it. 🚀
This project is made for fun, learning, and experimenting with interpreter concepts.
It is not production-ready - please don’t use it for serious systems 😅
Feel free to fork it, improve it, or build your own HTPL!