Full-stack Javascript Components

We’re releasing the first version of Nullstack!

...Yes, another JavaScript framework. This one is made by a very small team, but we have some nice things to offer. Applications built in Nullstack have a slightly good perceived performance and the code tends to be relatively small compared to other frameworks.

Nullstack is an isomorphic framework, focused on giving some quality of life (and of code) to freelancers. It’s based on vanilla Javascript. We’ve been using it in our freelancing projects for 2 years now and thought it was time to release it into the world.

Nullstack components interop between both the back-end and the front-end seamlessly allowing you to write code like this:

import Nullstack from 'nullstack';

class PokePoll extends Nullstack {

  pokedex = [];

  prepare({project, page}) {
    page.title = `${project.name} built with Nullstack!`;
  }

  static async getTopTenpokedex({database}) {
    return await database.collection('pokedex').find().sort({votes: -1}).limit(10).toArray();
  }

  async initiate() {
    this.pokedex = await this.getTopTenpokedex();
  }

  renderPokemon({ranking, name, sprite, number, votes}) {
    return (
      <li>
        <div>
          <h2>#{ranking}</h2>
          <img src={sprite} alt={name} />
          <span>#{number}</span>
          <a href={`/${name}`}>{name}</a>
          <small>{votes} votes</small>
        </div>
      </li>
    )
  }

  render({page}) {
    return (
      <div>
        <h1> {page.title} </h1>
        <ul>
          {this.pokedex.map((pokemon, index) => <Pokemon {...pokemon} ranking={index + 1} />)}
        </ul>
      </div>
    )
  }

}

export default PokePoll;

If you’re interested you can check out documentation or the application example we’ve built. We hope you enjoy Nullstack as much as we do!