From 0 To 500 GitHub Stars: Our Year-Long Adventure🔥

Hello everyone! Today, we would like to share a big event for us that happened the other day. Our project on GitHub received 500 stars!

This is really cool because a lot of effort was put into this project not only by me, but also by dozens of other contributors and thousands of people who liked, commented, and simply watched our journey for a long time.

There was a lot, from deleting the repository to opening new plugins for WebPack and Vite. In this article, I will try to briefly tell our path and also how we managed to get so many stars.

Well, let's not delay. Let's begin! 🚙

📚 History of HMPL.js

It all started with the idea of ​​combining old developments of the Cample.js framework with the template language. The first steps were quite meager and before what the pattern language is now, was still very far.

There were several repositories and this is the second one we started in November last year. During this time, we spent most of the months simply developing the project, finishing some things. But only since February, we started to be active in social networks 🌐.

We have already written several articles about how growth has been going on over this time:

• 100 Stars
• 200 Stars

Today, it is interesting to look at the time, what was written then and now. There I tell in detail about what history was, but here there is no special sense in repeating.

👀 What is this project?

If anyone doesn't know, then HMPL is a small template language for displaying UI from server to client. It is based on customizable requests sent to the server via fetch and processed into ready-made HTML. What does this mean? It's probably better to show it in code:

import { compile } from "hmpl-js";

const templateFn = compile(
  `<div>
    <button class="getHTML">Get HTML!</button>
    {{#request
      src="/api/test"
      after="click:.getHTML"
      repeat=false
    }}
      {{#indicator trigger="pending"}}
        <p>Loading...</p>
      {{/indicator}}
    {{/request}}
  </div>`
);

const wrapper = document.getElementById("wrapper");

const elementObj = templateFn();

wrapper.appendChild(elementObj.response);

In essence, this is an add-on for HTML to implement a Server-Side Application. That is, this is not a render on the server, but the case when we mount components from the server on the client.

🌱 Why do people give stars to a project on GitHub?

I don't know myself, to be honest. Maybe the project is not bad, I don't know. But, in my opinion, first of all, people put stars because they see the project on their screen to begin with.

No matter how stupid it is, if a person doesn't see or hear something, then he doesn't know about it. But how can we make people know? Probably, writing on the Internet and telling people in person is the most effective option :)

Today, there are many ways to tell people about what you do. The most effective way for us to get the word out is dev.to, but you can also use:

• 🐈‍⬛ ProductHunt
• 🦋 BlueSky

And other social networks, there are simply a huge number of them today, just choose for any taste. The main thing, in any business, is frequency and quality. Do not think that one entry will be interesting to someone. This, as I have already realized on myself, is daily work.

❤️ And finally...

And don't forget to:

• 💎 Star HMPL.js on GitHub to support the project
• 💬 Join the HMPL Discord community for wishes, solving problems, and just communication