Sunil Kumar Dash for Composio

Posted on Sep 12

13 top open-source tools to ship your apps faster ⚡🚀

#webdev #javascript #beginners #programming

TL;DR

I have worked with many successful developers from different pre-seed and seed-stage companies. And they all had three reasons for their product's success.

Ship fast.
Get customer feedback.
Iterate faster.

With that in mind, I have curated a list of open-source tools you can use to build your products faster.

Feel free to explore the repositories and give them a star.

1. Composio 👑 - AI-optimized Integrations for your Apps

I have been building many AI applications lately. To accomplish complex automation, you must connect external applications, such as GitHub, Jira, Slack, Discord, etc., with AI models. For more clarity, check out our blog post on tool calling.

Composio makes it super easy to connect over 100 tools and applications, such as GitHub, Slack, Jira, Gmail, and more, with AI models to accomplish agentic automation.

It optimizes API endpoints, making them accessible as tools for AI models. Additionally, you can generate tools directly from your app's OpenAPI specifications, enabling automation of various end-to-end processes.

We have native support for Python and Javascript.

You can quickly start with Composio by installing it using pip.



pip install composio-core

Add a GitHub integration.



composio add github

Composio handles user authentication and authorization on your behalf.

Here is how you can use the GitHub integration to star a repository.



from openai import OpenAI
from composio_openai import ComposioToolSet, App

openai_client = OpenAI(api_key="******OPENAIKEY******")

# Initialise the Composio Tool Set
composio_toolset = ComposioToolSet(api_key="**\\*\\***COMPOSIO_API_KEY**\\*\\***")

## Step 4
# Get GitHub tools that are pre-configured
actions = composio_toolset.get_actions(actions=[Action.GITHUB_ACTIVITY_STAR_REPO_FOR_AUTHENTICATED_USER])

## Step 5
my_task = "Star a repo ComposioHQ/composio on GitHub"

# Create a chat completion request to decide on the action
response = openai_client.chat.completions.create(
model="gpt-4-turbo",
tools=actions, # Passing actions we fetched earlier.
messages=[
    {"role": "system", "content": "You are a helpful assistant."},
    {"role": "user", "content": my_task}
  ]
)

Run this Python script to execute the given instruction using the agent.

For more about Composio, visit their documentation.

Star the Composio repository ⭐

2. Vercel AI SDK - Easily Build AI-powered Products ⚡

AI is eating the internet, and you would want to stay ahead of the curve as a developer. Integrating LLMs into your applications can be pretty challenging. Vercel’s AI SDK offers a unified approach to integrating AI into your applications.

It is compatible with most front-end libraries and frameworks, such as Next, React, Vue, Svelte, etc., and you can build chatbots and generative interactive components inside them.

It has three major components.

AI SDK Core: A unified API for generating text, structured data, and tool invocations using LLMs.
AI SDK UI: A collection of framework-agnostic hooks designed for rapidly building chat and generative user interfaces.
AI SDK RSC: A library for streaming generative UIs using React Server Components (RSC).

Check out the documentation for more

To get started, install the library.



npm install ai

Install the model provider of your choice.



npm install @ai-sdk/openai

Call OpenAI API.



import { generateText } from 'ai';
import { openai } from '@ai-sdk/openai'; // Ensure OPENAI_API_KEY environment variable is set

async function main() {
  const { text } = await generateText({
    model: openai('gpt-4-turbo'),
    system: 'You are a friendly assistant!',
    prompt: 'Why is the sky blue?',
  });

  console.log(text);
}

main();

Star the Vercel AI SDK repository ⭐

3. Shadcn - Beautifully designed components that you can copy and paste into your apps

Building custom eye-candy components for your apps can often be time-consuming. Shadcn offers beautifully designed, reusable components built using Radix and Tailwind that you can copy, paste, and modify your applications.

It saves a lot of time compared to designing similar components from scratch. You need a component; look it up in Shadcn, copy and paste it into your application, and you are done.

It supports almost all the popular front-end libraries and frameworks, such as React, Next, Astro, Gatsby, and Remix.

Check out the documentation for more information on Shadcn.

Star the Shadcn repository ⭐

4. Trigger. Dev - Open source background jobs platform 📎

While building applications, you will often need to handle background jobs and scheduled tasks. For example, you can send automated emails after user signups, process file uploads asynchronously, run periodic data syncs with third-party APIs, or schedule recurring reports.

Triggerdev makes it easy to implement these tasks efficiently without worrying about infrastructure, ensuring your jobs run reliably and scale as needed.

They are also compatible with AI APIs for reliable AI generation tasks, routing, tracing, and auto-retrying.

Here’s an example of generating images with DALL-E3.



import { task } from "@trigger.dev/sdk/v3";
import OpenAI from "openai";

const openai = new OpenAI({
  apiKey: process.env.OPENAI_API_KEY,
});

type Payload = {
  theme: string;
  description: string;
};

export const generateContent = task({
  id: "generate-content",
  retry: {
    maxAttempts: 3, // Retry up to 3 times
  },
  run: async ({ theme, description }: Payload) => {

    // Generate text
    const textResult = await openai.chat.completions.create({
      model: "gpt-4o",
      messages: generateTextPrompt(theme, description),
    });

    if (!textResult.choices[0]) {
      throw new Error("No content, retrying…");
    }

    // Generate image
    const imageResult = await openai.images.generate({
      model: "dall-e-3",
      prompt: generateImagePrompt(theme, description),
    });

    if (!imageResult.data[0]) {
      throw new Error("No image, retrying…");
    }

    return {
      text: textResult.choices[0],
      image: imageResult.data[0].url,
    };
  },
});

function generateTextPrompt(theme: string, description: string): any {
  return `Theme: ${theme}\n\nDescription: ${description}`;
}

function generateImagePrompt(theme: string, description: string): any {
  return `Theme: ${theme}\n\nDescription: ${description}`;
}

Star the Trigger.dev repository ⭐

5. Vite - Next generation front end tooling ⚡

I have been using React with Vite lately, and the development experience is much better. Many good developers I know use Vite.

Vite is a modern build tool and development server primarily used for building fast and efficient web applications.

It has several benefits over Webpack and Parcel, such as

Instant dev server: Vite offers an instant dev server with Hot Module Replacement (HMR), enabling real-time code updates without page reloads for faster, smoother development.
Auto code splitting and shaking: Vite automatically optimizes code splitting and tree shaking, ensuring only the needed parts of your code are included in the final bundle for better performance.
Built-in TypeScript and JSX Support: Natively supports Typescript and JSX,

Vite supports almost all popular frameworks.

Scaffold your first Vite project.



npm create vite@latest

Install Vite CLi using the following command.



npm install -D vite

Check out the documentation for more on the Vite build tool.

Explore the Vite repository ⭐

6. Resend - Email for developers 📩

Developing applications often involves communicating with users and customers; email is the best medium. As a developer, you would want to do this programmatically, and Resend is the market leader in this space.

They let you quickly set it up in multiple languages and frameworks such as node JS, React, Go, Java, Ruby, and more.

Here is what you can do with Resend.

Programmatically send emails to users, such as welcome mail, password reset, etc.
Email template management.
Analytics and email tracking include open rates, clicks, and other engagement metrics.

Get started by installing Resend.



npm install resend

Send an email using HTML.



import { Resend } from 'resend';

const resend = new Resend('re_123456789');

(async function () {
  const { data, error } = await resend.emails.send({
    from: 'Acme <onboarding@resend.dev>',
    to: ['delivered@resend.dev'],
    subject: 'Hello World',
    html: '<strong>It works!</strong>',
  });

  if (error) {
    return console.error({ error });
  }

  console.log({ data });
})();

For examples with other frameworks and languages, refer to the official documentation.

Explore the Resend repository ⭐

7. Aider - Your Ai pair-programmer

Imagine having a pair-programmer who is helpful in reality. Well, you have it now. Aider is an end-to-end pair programmer who will help you set up projects faster, manage dependencies, and assist in debugging and code refactoring.

It sits in your CLI and codes at your command.

You can get started quickly like this:



python -m pip install aider-chat

# Change the directory into a git repo
cd /to/your/git/repo

# Work with Claude 3.5 Sonnet on your repo
export ANTHROPIC_API_KEY=your-key-goes-here
aider

# Work with GPT-4o on your repo
export OPENAI_API_KEY=your-key-goes-here
aider

For more details, see the installation instructions and other documentation.

Explore the Aider repository ⭐

8. Mentat - A GitHub-Native Coding Agent

Have you heard of Devin, the AI software engineer; this is an open-source alternative. The Mentat bot is an AI tool that can

Generate GitHub PRs from issues: It Selects relevant context, generates a new branch/commit and opens a PR.
Review Pull Requests (PRs): Instant reviews of human-generated PRs.
Use Leading Foundation Models: MentatBot chooses the best model from OpenAI, Anthropic and others for each task.

This can speed up your development time significantly.

Get started with it by installing Mentat.



python -m pip install mentat

Add your OpenAI key.



export OPENAI_API_KEY="your_api_key"

Run Mentat from within your project directory. Mentat uses git, so if your project doesn't already have git set up, run git init. Then you can run Mentat with:



mentat <paths to files or directories>

List the files you would like Mentat to read and edit as arguments. Mentat will add each of them to context,

Be careful about token consumption by the OpenAI models.

For more information, refer to the official repository.

Star the Mentat repository ⭐

9. Supabase - Managed backend for Apps

Supabase is an open-source alternative to Firebase. It offers a backend as a service (BaaS) that can significantly reduce the development time of your applications.

Here are the key features

Hosted Postgres database
Managed authentication and authorization.
Auto-generated APIs based on database schema.
File storage
AI + Vector database toolkits.

They support almost all the popular languages, such as Typescript, Python, C#, Flutter, etc. Check the documentation for more.

Explore the Supabase repository ⭐

10. Strapi - Developer-first headless CMS

Strapi is a headless Content Management System (CMS) that allows you to easily manage and deliver content through an API used by front-end, mobile apps, and other clients.

Critical features of Strapi include

Headless CMS: It keeps back-end content separate from the front-end content.
API-First: Strapi automatically generates RESTful or GraphQL APIs for the content types you define, allowing easy integration with front-end frameworks like React, Vue, or Angular.
Authentication and Permissions: Strapi offers a built-in user roles and permissions system, which helps control access to different parts of the CMS.
Self-hosted: You have complete control over the deployment, allowing you to self-host it on your infrastructure and giving you ownership of your data and infrastructure.

Get started with it by installing it.



npx create-strapi-app my-project --quickstart

For more, refer to the documentation.

Explore the Strapi repository ⭐

11. Zod - TypeScript-first schema validation with static type inference

Zod is a Typescript-first schema validation library that simplifies validating and parsing data while ensuring type safety.

Zod can be beneficial while validating data from APIs and forms and parsing data from dynamic sources when validation and transformation are needed.

Data can be extracted from LLM responses, for example. Even OpenAI uses Zod in its TS SDK for structured extraction from LLM responses.

Key benefits of Zod includes

Zero dependencies
Works in Node.js and all modern browsers
Tiny: 8kb minified + zipped
Immutable: methods (e.g. .optional()) return a new instance
Concise, chainable interface
Functional approach: parse, don't validate
It works with plain JavaScript, too! You don't need to use TypeScript.

Get started by installing Zod.



npm install zod

Creating a simple string schema



import { z } from "zod";

// creating a schema for strings
const mySchema = z.string();

// parsing
mySchema.parse("tuna"); // => "tuna"
mySchema.parse(12); // => throws ZodError 

// "safe" parsing (doesn't throw error if validation fails)
mySchema.safeParse("tuna"); // => { success: true; data: "tuna" }
mySchema.safeParse(12); // => { success: false; error: ZodError }

Creating an object schema



import { z } from "zod";

const User = z.object({
  username: z.string(),
});

User.parse({ username: "Ludwig" });

// extract the inferred type
type User = z.infer<typeof User>;
// { username: string }

For more, refer to their documentation.

Explore the Zod repository ⭐

12. Nx- Smart Monorepos, Fast CI

Nx is a powerful, open-source build system and mono repo management tool designed to help developers build, test, and scale large applications more efficiently.

Key features include

Monorepo Support: Nx manages multiple projects in a single repository, simplifying development and collaboration.
Fast Builds: Nx uses smart caching and parallelization to speed up builds by rebuilding only the changed code.
Dependency Graph: Nx automatically generates a dependency graph to visualize project interactions.
Testing and Linting: Nx integrates with testing and linting tools, enabling efficient testing and enforcing code quality.

For more, refer to their documentation.

Explore the Nx repository ⭐

13. LangChain - Build AI apps faster

If you are building an AI app and want to ship fast, LangChain is the choice. It is available in Python and Javascript and has all the bells and whistles to build any AI app conveniently, from data loaders and parsers to Vector stores and data stores.

It lets you create Agents, Chatbots, and RAG apps quite easily.

LangChain is a one-stop shop for building AI applications. It also has a vast ecosystem for monitoring and deploying AI apps, such as LangSmith and LangServe, within minutes.

Install LangChain using pip or npm.



pip install langchain
#or
npm install -S langchain

For tutorials and guides, check out their repository.

Explore the LangChain repository ⭐

Thanks for reading.

Let me know in the comments if any other tool has helped you build apps faster. 👇

Top comments (27)

Eric Goldman • Sep 12

Great list! If you need a queue or async triggers, try Sequin. Open source and works great with Supabase - easily brides to Trigger.dev too

github.com/sequinstream/sequin

Sunil Kumar Dash • Sep 12

This is really cool, Eric. Thanks for mentioning.

Parker • Sep 19

Is that not what Supabase broadcast does?
https://supabase.com/docs/guides/realtime/broadcast?queryGroups=language&language=js

Simon Johansson • Sep 23

Great list! But if your looking for a backend framework that makes you go faster from local development to deployed in the cloud you should check out Encore. Performance wise it's also 9x faster then Express.js 🤯
github.com/encoredev/encore
encore.dev/

Valentin Iljaž • Sep 15 • Edited

Great list! I especially like Zod. I use it in my project webacus.dev Check it out.

It’s a comprehensive online toolbox that offers a wide variety of tools in multiple categories. It aims to deliver these tools with a sleek and attractive user interface providing you with all the essentials in one handy place.