21 Developer Tools to Improve Your Daily Life as Developer ⚡🎁
Anmol Baranwal
Posted on September 10, 2024
There are thousands of developer tools and packages but the common problem is that most of them are not up to standards.
That is why, I'm covering 21 actually useful ones that can improve your daily life as a developer.
Some of these are tools, some are projects and others might include packages.
Let's jump in.
1. Taipy - Data and AI algorithms into production level web apps.
Normally, when I need an interface for Python, I use Streamlit. However, it isn't very efficient and has a lot of performance-based problems.
Taipy (open source) on the other hand is the perfect Python library for easy, end-to-end application development, featuring what-if analyses, smart pipeline execution, built-in scheduling, and deployment tools.
To be clear, Taipy is used to create a GUI interface for Python-based applications and improve data flow management.
The key is performance and Taipy is the perfect choice for that.
While Streamlit is a popular tool, its performance can decline significantly as I told you earlier especially when handling large datasets, making it impractical for production-level use.
Taipy, on the other hand, offers simplicity and ease of use without sacrificing performance.
Taipy has a lot of integration options and connects effortlessly with leading data platforms.
Get started with the following command.
pip install taipy
You can read the docs.
Another useful thing is that the Taipy team has provided a VSCode extension called Taipy Studio to accelerate the building of Taipy applications.
If you want to read a blog to see codebase structure, you can read Create a Web Interface for your LLM in Python using Taipy by HuggingFace.
It is generally tough to try out new technologies, but Taipy has provided 10+ demo tutorials with code & proper docs for you to follow along. I will discuss some of these projects in detail!
Taipy is close to 11k stars on GitHub and is on the v3.1.1 release.
2. Mitosis - write components once, run everywhere.
If you're someone who doesn't want to maintain a consistent design system across multiple frameworks or avoid the pitfalls of web components by compiling native framework code, then this one is for you!
Mitosis is a tool that transforms JSX components into fully functional components for frameworks like Angular, React, Qwik, Vue, Svelte, Solid and React Native.
By writing your UI components once in JSX, you can deploy them across any platform, removing the need to rewrite code for each framework.
The concept is very unique and they use a static subset of JSX, inspired by Solid. It can parse it to a simple JSON structure, then easily build serializers that target various frameworks and implementations. You can read more on how it works.
To create a new Mitosis project from scratch, run the following command.
npm create @builder.io/mitosis@latest
It's simple, very powerful and easy to use. Many organizational-level open source projects maintain a codebase of different frameworks, so mitosis can be very useful for them.
You can read the docs and check the live playground.
The most amazing feature is that it can also integrate with Figma to keep your design system in sync with your code system. Wow!
They have 12k stars on GitHub and are built using TypeScript.
3. responsively - modified web browser for 5x faster responsive web development.
Responsively is a modified browser built using Electron that helps in responsive web development.
I know Chrome development tools work very well but you will be amazed by how easy it is to use Responsively.
At first glance, anyone would think it of ordinary app but there are some very unique features:
✅ See all devices at once.
✅ Any click, scroll or navigation that you perform on one device will be replicated to all devices in real-time.
✅ It allows quick context switching by saving your favorite device combinations as Preview Suits to switch between them when you're testing.
✅ It comes with a large collection of device profiles out of the box. You can also add your own custom devices.
You must be thinking about the usual features that would be missing here but that's not the case.
⚡ You will get all the basic browser features like cookie management, local storage, session storage and bookmarks. You can also use the dev tools as in any browser.
⚡ You can also take screenshots of individual devices by clicking on the camera icon in the device toolbar with a quick screenshot of the viewport too.
⚡ The Unified Inspector allows you to inspect elements across all devices at once by pressing Cmd/Ctrl + I to activate it and hover over any element to see its details.
You can download the desktop app.
They have also provided browser extensions for Chrome, Edge, and Firefox to easily send links from your browser to the app and preview instantly.
I would highly recommend to at least check it out because it supports hot reloading as well. It might end up making your workflow much smoother.
Responsively has 22.3k stars on GitHub and is built using JavaScript.
4. Documenso - sign digital documents in the easiest way.
If you're doing freelancing and need to sign an agreement, this is a perfect tool for that. This solves a huge problem for developers who don't want to end up wasting time and focusing on what matters.
This is technically quite easy today, but it also introduces a new party to every signature.
The tech stack for the project includes TypeScript, Next.js, Prisma, Tailwind CSS, shadcn/ui, NextAuth.js, react-email, tRPC, @documenso/pdf-sign, React-PDF, PDF-Lib, Stripe and Vercel.
The free tier lets you sign 10 documents per month which is good enough.
You can read this on how to set up the project.
You can read the docs.
I know it's not a very wide use case but you can still learn from the codebase so that is always a plus point.
I've tested it properly and it works very well. In a nutshell, this is how it works:
✅ You upload the document and start filling in the information.
✅ Insert the email of all the parties involved.
✅ You just insert the textbox of the email, name, or signature that you need in the document.
✅ You will receive an email when any of the parties signs it and it will be available to download once every member has signed it.
The document will contain the signature and one more attached page with digital information. Very unique!
They have 7.1k stars on GitHub and are built using TypeScript.
5. Jam - one click bug reports.
I found Jam a few months back and I have used it too often.
Jam is a free Chrome extension (not open source) that you can use to report bugs efficiently.
Reporting a bug is a lengthy process and you may end up missing the essential data needed to solve it. That is why developers prefer using Jam.
Watch this video to see how Jam works!
As you can see, the best part is that it captures the console and network logs information which makes it convenient for other developers to look into it.
You will also get an AI debugger, backend tracing, repro steps and browser info. What more do you need?
I've used Jam for a long time, you will also get a dashboard to see all the jams that you've created to date. It's efficient and works really well.
It also works with a lot of popular tools so you don't have to change your environment at all.
Don't use the traditional way, you can simply comment on the Jam and improve the whole process to deal with it without hassle.
6. Can I Use - check the support of frontend web technologies.
Can I use is a website that provides up-to-date browser support tables for support of front-end web technologies on desktop and mobile web browsers.
Frankly, a lot of developers don't even know about this.
For instance, typing local storage to see where I can use it will give proper stats and references.
You can also directly compare browsers on various types of data.
There are so many options to filter data which you can explore yourself, I loved the overall concept.
If you want to contribute towards the data, check out their open source repository.
It has 5.6k stars on GitHub and is used by 1.8M developers on GitHub.
7. AppFlowy - open source alternative to Notion.
AppFlowy is an AI-powered secure workspace similar to the notion where you achieve more without losing control of your data.
I've covered Obsidian before, so I'm just skipping it here.
It is important to manage our tasks, and AppFlowy is a strong option for that.
You can organize and visualize your data in tables, boards and calendars. They also provide mobile apps so that's a plus.
You can read the docs and read about installation methods.
They support self-hosting AppFlowy using Supabase. This is ideal for users who use Supabase for their infrastructure.
You should also check this to learn more about data storage, markdown, shortcuts, themes, AI involved and plugins.
AppFlowy has 52.3k+ stars on GitHub.
8. Copycat - generate deterministic fake values.
This is not a tool but an efficient package that every developer can use in their workflow.
Snaplet (startup) was recently shut down but Paul Copplestone (Co-founder of Supabase) reached out to Peter to see if Snaplet was interested in open sourcing.
Open sourcing the stuff you have built is the best way to ensure your products outlive your business.
They released three tools out of which Copycat is one of those and the other is Seed. I've discussed both of them.
Copycat helps you to generate fake data. It's like faker.js, but deterministic.
This works statelessly, which means for the same input, the same value will be returned regardless of the environment, process, call ordering, or any other external factors.
A few examples would be:
import { copycat } from '@snaplet/copycat'
copycat.email('foo')
// => 'Raleigh.McGlynn56687@wholewick.info'
copycat.email('bar')
// => 'Amir_Kris69246@raw-lout.name'
copycat.email('foo')
// => 'Raleigh.McGlynn56687@wholewick.info'
You can read the docs including API reference and alternative approaches.
Copycat has 648 stars on GitHub and is built using TypeScript.
9. Litlyx - One line code Analytics with AI.
I don't trust Google Analytics that much because it's not open source so I was looking for another alternative. This one is developer oriented.
Litlyx is a single-line code analytics solution that integrates with every JavaScript/TypeScript framework.
A simple analytics solution for developers, they use a wrapper of GPT that users can query about the data collected with litlyx.
For instance, you can simply ask How many visits did I have 7 days ago?, How many visits I had last week?, how many custom events were triggered with this name or name of the event and so on.
I believe they are planning to generate charts and reports with it in the future.
It tracks 10+ KPIs and as many custom events as you want for your app. It also provides AI-powered dashboards for intuitive data insights, automatic reports sent straight to your email, and seamless CSV file downloads to work on your data.
You can install it using npm or CDN. The total lib size is less than 4kb so that's a plus point.
It supports 15+ frameworks as shown below.
Read the docs and check the live demo.
Trust me, using a good analytics system is perfect for your project!
Litlyx has 342 stars on GitHub and is built using Vue + TypeScript.
10. Requestly - powerful HTTP interceptor for browsers.
We have all been there when the backend isn't ready with APIs so the frontend developers manually hardcode the response.
Requestly is an open source frontend development platform that helps developers test and debug their apps faster without needing multiple deployment cycles. It helps you to:
✅ Build features when backend API is not ready.
✅ Testing code changes in production without deployment cycles.
✅ Testing, Validating, Mocking API responses and many more.
🎯 How to install Requestly?
You can download the desktop app or find it on your preferred browser including Chrome, Safari and Brave.
As I discussed the hardcoding responses in the codebase, you no longer need to do it after setting up Requestly. With a mutual understanding of the backend and frontend, an API contract is decided and then defined on the Requestly dashboard for the desired API endpoint.
It serves the response in such a way that it's coming from the server to avoid making any changes in the codebase or any other complex configuration.
You can lots of other stuff like:
-→ Testing scripts or APIs directly on staging/production sites by redirecting HTTP requests(API Calls/Files) from one environment to another.
-→ Modify headers or Inject custom scripts/styles on external web pages.
-→ Intercept, Modify, and Mock GraphQL Query by applying extra targeting on operation name and query data.
It's extremely useful for QA Software engineers or frontend teams.
Let's see some of the exciting features:
✅ You can create a workspace to share rules, mocks, and sessions. Faster collaboration leads to solving problems quickly!
✅ You can record sessions and it's automatically done whenever you test a rule from the dashboard.
✅ You can enable/disable rules from the dashboard.
✅ You can mock any servers. Read more with sample apps and use cases.
You can read the docs.
They have 2.2k stars on GitHub.
11. Music for Programming - music while programming to inspire the mind.
Most of you would deny the importance of music. I know the truth is hard sometimes but music can improve your coding 😅
That is why, a lot of developers absolutely adore this site.
Music for programming presents a series of mixes intended for listening while programming to focus the brain and inspire the mind.
I love the feature of playing random music, it's sweet and focus oriented in my opinion.
Let me know in the comments if this can improve your coding skills :)
The only drawback is that it's not open source.
12. Obsidian - writing app for your style.
Obsidian is a private and flexible writing app that adapts to the way you think.
You can also see the list of plugins that can help you shape Obsidian to fit your way of thinking. I've checked the insane amount of options present there!
You can even collaborate and easily track changes between revisions, with one year of version history for every note.
You can publish those (I've never tried) and control the look and feel of your site with themes, custom domains, password protection, and more. It's a paid feature but you can read all about publishing with Obsidian.
You can read the detailed docs and check the live website. You can also build a custom plugin using this guide and use React or Svelte for that.
Download Obsidian based on the platform you're using.
They offer a free forever tier plan and don't charge based on features or usage. You only pay if you use Obsidian commercially.
One of the great alternatives that you can try is Capacities. It might even be better than Obsidian in some ways. I will cover it in one of my future articles.
The main repository has 9k stars on GitHub with 1600+ contributors. Another awesome project by the open source community.
13. Vanna - Chat with your SQL database.
Vanna is an MIT-licensed open-source Python RAG (Retrieval-Augmented Generation) framework for SQL generation.
Basically, it's a Python package that uses retrieval augmentation to help you generate accurate SQL queries for your database using LLMs.
It's perfect for developers like me who are not very fond of SQL queries!
Vanna works in two easy steps - train a RAG model on your data, and then ask questions that will return SQL queries that can be set up to run on your database automatically.
You don't need to know how this whole stuff works to use it.
You just have to train a model, which stores some metadata, and then use it to ask questions.
Get started with the following command.
pip install vanna
To make things a little easier, they have built user interfaces that you can use as a starting point for your own custom interface. Find all the interfaces including Jupyter Notebook and Flask.
You can read the docs and you can try this Colab notebook in case you want to see how it works after training.
Watch this demo for a complete walkthrough!
They have 10.5k+ stars on GitHub and are built using Python.
14. Seed - seed your database based on schema.
This is not a tool but a package that can be useful for your workflow.
Seed generates realistic synthetic data based on a database schema. It automatically determines the values in your database so you don't have to define each value.
You can get started by using this command.
npx @snaplet/seed init
For instance, if you want to generate 3 comments for one of your posts you simply point it at your schema and let it handle the rest:
It consists of the following parts:
a. Seed Client: Auto-generated and type-safe data client for Node.js & TypeScript.
b. Seed CLI: A CLI to generate and keep the data client in sync with your database 🛠️
c. Seed AI: Our custom model identifying the shape of your data 🤖
You can read the docs. Seed is compatible with PostgreSQL, SQLite and MySQL.
Watch this quick demo about Seed and how it works.
Seed was recently open sourced after Snaplet got shut down and has 298 stars on GitHub.
15. Hyperswitch - payments switch written in Rust.
Hyperswitch is a community-led, open payments switch to enable access to the best payment infrastructure for every digital business.
It provides APIs to access payment ecosystems across 130+ countries and you can even use it to reduce processing fees with smart routing.
You can manage 200+ payment methods and 50+ payment processors by using a simple CRUD way. Plus, it's trusted by a lot of companies.
You can read the api reference docs and the quickstart guide.
It's open source with 11.3k stars on GitHub.
16. Chat2DB - AI-driven data management platform.
Chat2DB is an AI-first data management, development and analysis tool.
Its core is AIGC (Artificial Intelligence Generation Code), which can convert natural language into SQL, SQL into natural language, and automatically generate reports, taking efficiency to another level.
Even operations that do not understand SQL can use it to quickly query business data and generate reports.
For instance, when you are doing database development, it will help you generate SQL directly in natural language, SQL optimization suggestions, analyze SQL performance, analyze SQL execution plan, and can also help you quickly generate SQL test data, system code, etc. Too much jargon but it's very powerful :)
They have excellent support for multi-data sources and can easily integrate up to 17 different database types including PostgreSQL, MySQL, MongoDB, and Redis.
You can download or try it in the browser.
Let's see some of the exciting features:
✅ Intelligent reports.
✅ Data Exploration.
✅ SQL Development.
You can read the quickstart guide on the official docs.
They have 14.7k stars on GitHub and are on the release v3.2.
17. Micro Agent - AI agent that writes (actually useful) code for you.
AI-assisted coding tools like GitHub Copilot and ChatGPT don't produce very reliable code. They often don't work correctly right out of the box, you find bugs, edge cases or even references to non-existent APIs.
This can lead to a frustrating loop of trying the generated code, finding issues, going back to the AI for fixes and repeating.
The time spent debugging can negate the time saved by using AI tools in the first place. But devs still use it!
Micro Agent claims to deliver the benefits of AI-assisted coding while mitigating the problems of unreliable code generation.
Give it a prompt and it'll generate a test and then iterate on code until all test cases pass.
You can install it using this command.
npm install -g @builder.io/micro-agent
# Next, set your OpenAI API key when prompted or manually using this.
micro-agent config set OPENAI_KEY=<your token>
# Then you can run to start a new coding task
micro-agent
Micro Agent will prompt you to describe the function you want, generate tests, and start writing code in your preferred language to make the tests pass. Once all the tests are green, you'll have a fully functional, test-backed function ready to use.
Let's explore some of the most mind blowing use cases:
⚡ 30-second demo of Micro Agent generating tests and code for a TypeScript function that groups anagrams together from an array of strings.
⚡ Using Micro Agent to generate a simple HTML to AST parser (it was achieved on two iterations).
⚡ Unit test matching.
⚡ Visual matching (experimental).
⚡ Integration with Figma.
Micro Agent can also integrate with Visual Copilot to connect directly with Figma to ensure the highest fidelity possible design to code!
Visual Copilot connects directly to Figma to assist with pixel-perfect conversion, exact design token mapping, and precise usage of your components in the generated output.
Then, Micro Agent can take the output of Visual Copilot and make final adjustments to the code to ensure it passes TSC, lint, tests, and fully matches your design including final tweaks. Amazing right :)
You can read the docs and the official blog where the team discussed everything about the micro agent.
It's open source with 2.5k stars on GitHub.
18. Miro AI - AI visual workspace.
Miro is the AI-powered visual workspace that brings teams together to collaborate and make faster decisions. Its intelligent canvas with interactive tools makes it easy for anyone to get work done, from journey mapping to diagramming and more. It's just too awesome!
Watch a quick demo to understand most of the stuff.
The concept of intelligent canvas is definitely new to me.
You can let AI use your brainstorms and ideas to create product briefs and summaries to move work forward — no complicated prompts needed. All you need to do is provide content from your canvas and let Miro AI handle the rest.
Watch the video to understand about that canvas!
There are intelligent templates, integrations and also an academy where you can learn all sorts of stuff about Miro. See all the courses and verified blogs at Miro Academy, and you can earn cool badges.
They have 70M users so I guess I was the only one who didn't know about it earlier. By the way, there is a free tier plan available but it's limited to a single workspace with 3 editable boards.
It's not open source but it will absolutely blow your mind.
19. Codium AI - Quality-first AI code generation to help busy devs write, test and review code.
CodiumAI is a developer tool that uses AI to generate meaningful tests for code. It analyzes your code, docstring, and comments, and then suggests tests as you code. You don’t have to spend hours!
Watch the complete demo of Codium AI in under 1 minute!
You can download it from VSCode Marketplace and JetBrains extension.
You definitely have heard about a PR agent that assists you in reviewing PRs, that with other tools and Codiumate are products by the same company.
You can also see the difference between CodiumAI vs ChatGPT for generating unit-tests.
I recommend checking out docs to find comprehensive guides and details to harness the full potential of CodiumAI.
They offer a lot more, so check their website for the detailed features along with all of the things that you can do!
CodiumAI is completely open source with all of its tools.
20. Opire - reward platform for developers.
Opire has a clear principle that states anyone can make a living from open source.
It's a platform for solving and creating bounties in open source.
As a developer, you can solve real problems which can be shown in your portfolio to build credibility.
As a project admin, this might be the most underrated way to grow your open source project.
Some of the very useful use cases can be:
⚡ Collaborate on open source projects and earn money for your contributions.
⚡ Include paid technical tests as part of the selection process in your company by adding rewards. This can help you evaluate your candidates' skills while valuing their time, which sends a very strong message.
⚡ Support maintainers of open source projects by contributing financially. They don't get enough recognition for the work they do!
🎯 How to create and solve those bounties?
You can install the bot that manages communication with the Opire API, ensuring that actions performed through commands will be reflected in the Opire dashboard.
You can use commands such as:
-→ /reward [amount] : to create a reward.
-→ /try : try to solve the issue.
-→ /claim #[issue_number] : to claim rewards.
-→ /tip [amount] @[user] : for tip in USD to the mentioned user.
If you don't want to install the bot, then you can also create those rewards from the dashboard. I have attached a snapshot.
You can read the docs.
Everyone knows about Algora so I'm just trying to help Opire as a new platform in the domain. But the main reason is that developers receive 100% of the rewards.
Opire is open source with docs and the website.
21. Mantine Hooks - react hooks for state and UI management.
How many times have you been stuck in writing hooks from scratch?
Well, I'm never going to do it from now on thanks to mantine hooks.
It's not efficient to write more code since you would end up maintaining it later so it's better to use these production-level hooks to make your work a lot easier plus each of them has a good number of options.
This might be the most useful project that everyone can use rather than writing code from scratch.
Trust me, getting 60+ hooks is a big deal considering they have a simple way for you to see the demo of each of the hooks with easy docs to follow.
Get started with the following npm command.
npm install @mantine/hooks
This is how you can use useScrollIntoView as part of mantine hooks.
import { useScrollIntoView } from '@mantine/hooks';
import { Button, Text, Group, Box } from '@mantine/core';
function Demo() {
const { scrollIntoView, targetRef } = useScrollIntoView<HTMLDivElement>({
offset: 60,
});
return (
<Group justify="center">
<Button
onClick={() =>
scrollIntoView({
alignment: 'center',
})
}
>
Scroll to target
</Button>
<Box
style={{
width: '100%',
height: '50vh',
backgroundColor: 'var(--mantine-color-blue-light)',
}}
/>
<Text ref={targetRef}>Hello there</Text>
</Group>
);
}
They almost have everything from local storage to pagination, to scroll view, intersection and even some very cool utilities like eye dropper and text selection. This is damn too helpful!
You can read the docs.
They have more than 25.9k stars on GitHub but it's not only for the hooks because they are a component library for React.
To get a better idea, the package has 500k+ weekly downloads along with the v7 release which proves their credibility.
I know not every tool, project or package here would be useful to you but you could try these in your workflow.
Everyone shares the same tools and projects so I have tried to cover some unique stuff. I hope you found some useful.
Have a great day! Until next time.
If you are looking for a friendly community of writers and developers, you can join us at dub.sh/opensouls.
| If you loved this, please follow me on socials :) |
  
|
|---|
Follow Taipy for more content like this.
Posted on September 10, 2024
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
