Simplifying Frontend Development with Temba: A Quick Backend Solution

Jul 12, 2024 · Temba, APIs · 3 minute read

As a frontend developer, you're often focused on crafting the perfect client-side experience. Whether you're working with React, Vue, Svelte, or any other framework, sometimes the last thing you want to deal with is setting up a backend. Maybe you're experimenting with an app idea, learning a new frontend technology, or just need a place to store data temporarily. That's where my project, Temba, comes into play.

What is Temba?

Temba is a library I created to help developers like you quickly spin up a backend web API, allowing you to concentrate on building the frontend. It's available on NPM, and it's designed to be simple and straightforward to use.

With Temba, you can create a local HTTP server running on Node with just one command in the terminal. This means you can get back to focusing on your frontend while Temba handles the backend.

Temba is an alternative for json-server. However, next to JSON file storage, Temba also supports MongoDB databases.

Example

Running the following JavaScript with Node is all you need to get your server running:

import { create } from "temba"

const server = create()

server.start()

How Does Temba Work?

Once you've got your HTTP server running, you can start issuing HTTP requests for any resource using the standard methods GET, POST, PUT, PATCH, and DELETE.

For example, you can send a POST request to the /products resource with a JSON payload representing a product. When you GET the /products resource again, you'll see the product you added in the response.

Flexibility and Customization

Temba is incredibly flexible. You can create any resource you need, not just products. This flexibility allows you to tailor your backend to the specific needs of your frontend application. The data is stored in memory by default, which means it's temporary and will be lost when you restart the server. However, if you need to persist data, you have options to save it to a JSON file or even a MongoDB database.

Let's store our data in MongoDB:

const config = {
  connectionString: 'mongodb://localhost:27017/myDatabase',
}

const server = create(config)

server.start();

Configuration and Control

While Temba works out of the box without any configuration, you have the option to customize it further. You can:

  • Restrict Resources: Limit the server to only handle specific resources, like products. Any other resource requests will then return a 404 error: Docs
  • Validate Data: Define JSON Schema for your resources to ensure that the data meets certain criteria before it's accepted: Docs
  • Intercept Requests and Responses: Modify or validate the request body before it hits the database, or alter the response body before it's sent back to the client: Docs

Hosting and Deployment

Temba also supports hosting your server alongside your frontend application. By configuring the location of your static site within Temba, you can deploy both the frontend and backend together on fullstack platforms like Heroku or Fly.

When to Use Temba

Temba is ideal for learning, prototyping, or when you're focused on the frontend and don't want to be bogged down by backend concerns. It's not an enterprise solution but rather a convenient tool for getting started quickly on small projects. As your project grows, you might transition to a more robust backend, but Temba is a great starting point.

My Personal Use Case

I use Temba as the backend for my own To Do app, which helps me track tasks for home, garden, and personal projects. It's been a valuable tool for me, and I draw inspiration for Temba's roadmap from my own experiences and needs.

Extensibility

If Temba doesn't meet your specific needs, you can extend it with Express routers. This allows you to add custom routes and functionality to your Temba server.

Open Source

Of course Temba is open source and available on GitHub, so you're welcome to contribute or suggest improvements.

Conclusion

Temba is a practical alternative to json-server with the added benefit of database storage. It's designed to keep things simple and let you focus on what you do best: building amazing frontend experiences. Give Temba a try, and let me know how it works for you. Your feedback is invaluable in shaping the future of this project.

Share on Twitter · Discuss on Twitter · Edit on GitHub