DEV Community

Cover image for 9 must-know open-source tools that will make you better than 99% of developers
Nevo David
Nevo David Subscriber

Posted on

9 must-know open-source tools that will make you better than 99% of developers

The software development landscape is evolving faster than ever. To stay ahead of the curve, you must arm yourself with tools and technologies built for the future.

I’ve curated a must-know list of open-source tools to help you build applications designed to stand the test of time.

Southpark GIF


1. Composio 👑: Ultimate platform for AI automation

We are witnessing unprecedented growth in the AI landscape. For me, it resembles the 1990s internet boom. Big companies like Google, OpenAI, Microsoft, etc., are betting billions on an AI future.

Composio is the only tool needed to build complex AI automation software. It allows AI models to access third-party tools and applications to automate their interactions with them.

🎯 For instance, you can connect GitHub with the GPT model via Composio and automate reviewing PRs, resolving issues, writing test cases, etc.

It houses over 90 tools and integrations, such as GitHub, Jira, Slack, and Gmail, to automate complex real-world workflows.

Composio Integrtaions

Moreover, you can even integrate your applications, enabling AI to take actions like sending emails, simulating clicks, placing orders, and much more just by adding the OpenAPI spec of your apps to Composio.

They have native support for Python and Javascript.

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

pip install composio-core
Enter fullscreen mode Exit fullscreen mode

Add a GitHub integration.

composio add github
Enter fullscreen mode Exit fullscreen mode

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}
  ]
)
Enter fullscreen mode Exit fullscreen mode

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

Execute the code and let the agent do the work for you.

For more information, visit the official docs, and for even more complex examples, see the repository's example sections.

Composio GIF

Star the Composio repository ⭐


2. Postiz - Grow your internet presence using AI

Building the product is one thing, but getting users and clients is a different ball game. Developers often forget they still must market their products and create communities to sustain the business.

Postiz helps you step up your social media game using AI.

It offers everything you need to manage social media posts, build an audience, capture leads, and grow your business.

Check out the repository for more.

Postiz GIF

Star the Encore repository ⭐


3. Encore - Backend framework for robust and type-safe applications

Cloud services are great for building scalable applications. However, it can quickly become messy with complex infrastructure management, inconsistent APIs, and scattered DevOps processes.

Encore simplifies this chaos by providing a unified development platform integrating type-safe backend frameworks, automatic infrastructure provisioning, and DevOps automation.

t is available both in Golang and Typescript.

Get started with Encore by installing the CLI.

curl -L https://encore.dev/install.sh | bash
Enter fullscreen mode Exit fullscreen mode

Create an app.

encore app create
Enter fullscreen mode Exit fullscreen mode

This will configure your free account, allow you to choose your app's name, and select the Hello World template.

This will create an example application with a simple REST API in a new folder using your chosen app name.

Open the file in your editor.

// Service hello implements a simple hello world REST API.
package hello

import (
    "context"
)

// This simple REST API responds with a personalized greeting.
//
//encore:api public path=/hello/:name
func World(ctx context.Context, name string) (*Response, error) {
    msg := "Hello, " + name + "!"
    return &Response{Message: msg}, nil
}

type Response struct {
    Message string
}
Enter fullscreen mode Exit fullscreen mode

For more information, refer to their documentation.

Encore GIF

Star the Encore repository ⭐


4. Tolgee - Localization and translation platform

To grow your applications, you must reach users from different countries. However, managing translations and localizing content can be challenging. This is where you need a platform like Tolgee.

They provide a dedicated JS-SDK that you can integrate in your web app to localize content. They also offer several useful features, such as in-context translation, automated screenshot generation, Review translations, etc., to speed up your development process.

Check out the documentation for more.

Tolgee GIF

Star the Tolgee repository ⭐


5. CopilotKit - Integrate AI into your Web App

If you are looking for a convenient way to integrate AI workflows into your web app, your search ends here. CopilotKit is an all-in-one application that directly integrates AI capabilities, such as chatbots, text auto-completion, etc., into your application.

It offers React components like text areas, popups, sidebars, and chatbots to augment any application with AI capabilities.

Let’s see how to build an AI chatbot using CopilotKit.

npm i @copilotkit/react-core @copilotkit/react-ui
Enter fullscreen mode Exit fullscreen mode

Configure App provider

First, you must wrap all components that interact with your copilot with the <CopilotKit /> provider.

Use the <CopilotSidebar /> UI component to display the Copilot chat sidebar. Some other options you can choose from are <CopilotPopup /> and <CopilotChat />.

"use client";

import { CopilotKit } from "@copilotkit/react-core";
import { CopilotSidebar } from "@copilotkit/react-ui";
import "@copilotkit/react-ui/styles.css";

export default function RootLayout({children}) {
  return (
    <CopilotKit publicApiKey="<your-public-api-key>">
      <CopilotSidebar>
        {children}
      </CopilotSidebar>
    </CopilotKit>
  );
}
Enter fullscreen mode Exit fullscreen mode

Copilot Readable State

To provide state knowledge for the Copilot.

import { useCopilotReadable } from "@copilotkit/react-core";

export function YourComponent() {
  const { employees } = useEmployees();

  // Define Copilot readable state
  useCopilotReadable({
    description: "List of available users",
    value: users,
  });

  return (
    <>...</>
  );
}
Enter fullscreen mode Exit fullscreen mode

Copilot Action

Let the Copilot take action using the useCopilotAction hook.

import { useCopilotReadable, useCopilotAction } from "@copilotkit/react-core";

export function YourComponent() {
  const { employees, selectEmployee } = useEmployees();

  // Define Copilot readable state
  useCopilotReadable({
    description: "List of available users",
    value: users,
  });

  // Define Copilot action
  useCopilotAction({
    name: "Select an employee",
    description: "Select an employee from the list",
    parameters: [
      {
        name: "employeeId",
        type: "string",
        description: "The ID of the employee to select",
        required: true,
      }
    ],
    handler: async ({ employeeId }) => selectEmployee(employeeId),
  });

  return (
    <>...</>
  );
}
Enter fullscreen mode Exit fullscreen mode

You can check their documentation for more information.

CopilotKit GIF

Star the Copilotkit repository ⭐


6. D3 - Bring data to life with SVG, Canvas and HTML

There are no better alternatives to D3 when creating visualizations in JavaScript. D3 is a free, open-source JavaScript library for visualizing data. Its low-level approach built on web standards offers unparalleled flexibility in authoring dynamic, data-driven graphics.

Popular visualization frameworks like Plotly use D3 to draw interactive plots and charts.

D3 works in any JavaScript environment.

Quickly get started by installing D3.

npm install d3
Enter fullscreen mode Exit fullscreen mode

Here’s an example of a line chart in React.

import * as d3 from "d3";

export default function LinePlot({
  data,
  width = 640,
  height = 400,
  marginTop = 20,
  marginRight = 20,
  marginBottom = 20,
  marginLeft = 20
}) {
  const x = d3.scaleLinear([0, data.length - 1], [marginLeft, width - marginRight]);
  const y = d3.scaleLinear(d3.extent(data), [height - marginBottom, marginTop]);
  const line = d3.line((d, i) => x(i), y);
  return (
    <svg width={width} height={height}>
      <path fill="none" stroke="currentColor" strokeWidth="1.5" d={line(data)} />
      <g fill="white" stroke="currentColor" strokeWidth="1.5">
        {data.map((d, i) => (<circle key={i} cx={x(i)} cy={y(d)} r="2.5" />))}
      </g>
    </svg>
  );
}
Enter fullscreen mode Exit fullscreen mode

Check out all the examples of plots and graphs built using D3.

D3 GIF

Explore the D3 repository ⭐


7. Biome - Toolchain for the web

Biome is a fast and efficient web development tool focusing on code quality. It offers linting, formatting, and compiling features in a single tool.

It is designed to provide better performance, lower resource usage, and an improved developer experience compared to ESLlint and Prettier.

Get started with Biome by installing it using any package manager.

npm install --save-dev --save-exact @biomejs/biome
Enter fullscreen mode Exit fullscreen mode

Configure Biome,

npx @biomejs/biome init
Enter fullscreen mode Exit fullscreen mode

After running the init command, you’ll have a new biome.json file in your directory:

biome.json

{
  "$schema": "https://biomejs.dev/schemas/1.9.3/schema.json",
  "vcs": {
    "enabled": false,
    "clientKind": "git",
    "useIgnoreFile": false
  },
  "files": { "ignoreUnknown": false, "ignore": [] },
  "formatter": { "enabled": true, "indentStyle": "tab" },
  "organizeImports": { "enabled": true },
  "linter": {
    "enabled": true,
    "rules": { "recommended": true }
  },
  "javascript": { "formatter": { "quoteStyle": "double" } }
}
Enter fullscreen mode Exit fullscreen mode

The linter.enabled: true enables the linter, and rules.recommended: true enables the recommended regulations. These correspond to the default settings.

Check out the documentation for more.

Biome GIF

Explore the Biome repository ⭐


8. Continue - Leading AI-powered code assistant

You must have heard about Cursor IDE, the popular AI-powered IDE; Continue is similar to it but open source under Apache license.

It is highly customizable and lets you add any language model for auto-completion or chat. This can immensely improve your productivity. You can add Continue to VScode and JetBrains.

Key features

  • Chat to understand and iterate on code in the sidebar
  • Autocomplete to receive inline code suggestions as you type
  • Edit to modify code without leaving your current file
  • Actions to establish shortcuts for everyday use cases

For more, check the documentation.

Continue GIF

Star the Continue repository ⭐


9. Godot Engine - Multi-platform 2D and 3D game engine

Gaming is a big market, and as per multiple surveys, the average gaming time has increased manifold in the past ten years. Godot can be a great start if you are considering game development.

It is a feature-packed, multi-platform game engine for building 2D and 3D games from a unified interface.

Games built with Godot can easily be exported to the Web, MacOS, Linux, Windows, Android, IOS, and consoles. With game engines, you can also build compute-intensive apps like photo editors, animation, etc.

Godot Engine <br>
Image

Key Features

  • It includes tools for developing virtual and augmented reality applications.
  • It is efficient and lightweight, making it suitable for indie and small-scale projects.
  • Access to a growing library of free community assets.
  • Cross-platform.

For more, refer to their official documentation.

Godot Engine GIF

Explore the Godot repository ⭐


Thanks for reading.

Top comments (42)

Collapse
 
cavo789 profile image
Christophe Avonture

Your post didn't target php so, OK, you've not mentioned one of the best tool for PHP : Rectorphp getrector.com/.

Rector will scan your code (without running it) and will suggest tons of improvements, new way of writing code.

One of best open source tool I ever know

@tomasvotruba

Collapse
 
tillermwain profile image
Miller Twain

2 years into changing careers to Dev, specifically php and the laravel framework, maybe you can create a post about tools surrounding php? Would love to read

Collapse
 
nevodavid profile image
Nevo David

I have abandoned PHP around five years ago :)
I don't have a lot of recommendations.
For me PHP is a dying language, it exists only because of Wordpress.

Thread Thread
 
msankhala profile image
Mahesh Sankhala

Bro you can believe whatever you want but data related to php doesn't support your opinion.

Thread Thread
 
msankhala profile image
Mahesh Sankhala

Great list. Thanks for sharing.

Thread Thread
 
nevodavid profile image
Nevo David

If you can give me one reason why I would use PHP compared to the alternative on a new project (judging the language, not projects like Laravel, WordPress or Drupal)
I might change my mind.

❌ Async
❌ Slow
❌ Hard installation

I also use WordPress as a CMS for my website. But it's not because of the "language" it's because it's a good project.

Thread Thread
 
msankhala profile image
Mahesh Sankhala

Often many people have this impression of php as dying language but it has evolved much.
Just one reason I can give you is that It has async now. Just Google it and you will know.
In terms of performance it has improved alot after php8.
It is not hard to install any more. Many package managers installs it with single command. Or you can use docker images for preconfigured php env.

Thread Thread
 
nevodavid profile image
Nevo David

Async is not supported natively in PHP.
It is still an interpreter language, so you open a process for every request.
I agree that PHP8 is faster but still not comparable to modern languages.
I dare you to go and render a full video in PHP - see how fast you get a memory allocation error :)

Image description

Thread Thread
 
giantninja profile image
Steve

Most uses of php use php-fpm, which will NOT start a new process per request. It will spawn a bunch of processes that will handle multiple requests in separate threads and scale up/down as far as process count goes depending on the traffic and configuration. This has been the standard for years now

Thread Thread
 
denys_bochko profile image
Denys Bochko

I read already one post on how php is being reborn so I am going to voice my opinion here as there is already a thread about this. I have nothing against php (heck I have used it as my main language for the past 20 years), but I think the tech is being moved into microservice oriented architecture and php is not cut for it.

One of the main problems with php is that it's a monolithic language, you can't separate frontend and backend into two services as they both need to run on the server. In short, if your server goes down so does your application.
You can try to use it as an API point, of course, but none of the cloud providers support it to be serverless since php is not a pure server language but a pre processor.

The core php function is to execute statements one after another and wait for that execution to finish (I got very surprised when I found out that JS runs differently and does not wait), so if you have an issue with your call, app dies... There is still no async in php, I am thinking due to how it was built.

A lot of people are exited about strong types in parameters and return type for functions. I don't think I ever had an issue with that and to me it looks like just making it inline with other languages (not a big deal). You should write comments, and work in IDE, so you will always know what types of parameters a function takes and what it returns.
It does seem like they are trying to align php with what other languages are doing: anonymous functions, strong types, changing array() into [].

Earlier I read that 86% of the websites are still using php, true, but what kind of websites? wordpress, drupal and all other CMSs. I believe if you look into the sites that use custom data and are heavy on calculations, graphs or anything custom, you will not find a lot of those CMSs doing that.

Last but not least, look at the job market, which is the best indication of trend out there. For the past 6 month, there is only a 10% of jobs are php related with even senior roles not getting a good salary. I could say a niche market, but niche market usually has a good salary match.

Conclusion. PHP is good for people who know it and use it, however, the technology is moving into microservice world. The fact that none of the cloud providers have php in their serverless offerings, while having most of the other languages, speaks for itself.
I am moving to Python and Vue or React, should be fun.

Collapse
 
nevodavid profile image
Nevo David

Not a big php fan, but nice repository!

Collapse
 
cavo789 profile image
Christophe Avonture

If you are interested by a first how to for Rector, i've written this article months ago : avonture.be/blog/php-rector

You'll read a very basic and very short php code, something like everyone can code. Then you'll see how Rector will transform my "I've always code like that" to a much better code, state of the art.

I'm a big fan, yes.

Collapse
 
meaghan_degroot_ profile image
Meaghan DeGroot • Edited

Tired of “the best” inline code editors. Yawn . Give me a valid reason why they are different other than they have sponsored you. Don’t mention GitHub copilot or I’ll reach out and smack you

Collapse
 
devnenyasha profile image
Melody Mbewe

A great collection of libraries. Thank you for putting this together

Collapse
 
nevodavid profile image
Nevo David

❤️

Collapse
 
time121212 profile image
tim brandom

Nice Compilation, I will also add Zod for Typescript devs.

Collapse
 
nevodavid profile image
Nevo David

Thank you so much!
Zod is great!

Collapse
 
rym_michaut profile image
Rym

and Taipy

Collapse
 
nevodavid profile image
Nevo David

The best!

Collapse
 
martinbaun profile image
Martin Baun

Copolitkit is pretty cool! No more externally creating your own services.

Collapse
 
nevodavid profile image
Nevo David

It is!

Collapse
 
sunilkumrdash profile image
Sunil Kumar Dash

Great list, thanks.

Collapse
 
nevodavid profile image
Nevo David

Thank you!

Collapse
 
jswhisperer profile image
Greg, The JavaScript Whisperer

This is cool article great links, you gotta take the second you just know out the title though... Please!

Collapse
 
nathan_tarbert profile image
Nathan Tarbert

Hey Nevo, great list.
I already feel smarter ;)
Thanks for including CopilotKit!!!!

Collapse
 
nevodavid profile image
Nevo David

Thank you fo reading!

Collapse
 
williamdk profile image
Asaba William

Thank you

Collapse
 
nevodavid profile image
Nevo David

Thank you for reading!