Build an agentic admin panel for your existing database in minutes with open-source AdminForth

インデックス作成: 2026-05-19

[00:00:00]Welcome. I'm Ivan, founding developer of Admin Force. It's a modern TypeScript framework for building complex admin panels and back office applications faster while keeping full flexibility and control. Admin force killer feature is native built-in AI agent which can be used to handle your data. So you simply connect admin force to your existing database with the data and you can already start using agent to perform complex filtering queries or perform some aggregations or complex automated workflows to modify the data to call custom actions and so on and you can do all of this with simple natural language as Andre Karpati mentioned currently most popular programming language is English but the truth is it's already not only about programming agents can helps also founders, growth hackers, business intelligence to get reports faster and write them in simple language. Of course, it's not only English. You can also write in your own language and get reports in format which you like. So, let's dive in and I will show you how simple is the process of admin force setup.

[00:01:11]to show you how to set up admin force on top of existing database. I will first create a fresh brand new installation of posgress. We'll create one table there and we'll populate it with the data. You can skip this step if you already have some local instance of database like posgreql or mongodb.

[00:01:30]I will use this prompt. I will share it via github g with you. So if you wish you can use it by yourself. So it uh instructs some coding agent to run posgress docker container with definite username password port and so on and create orders table. This is pretty typical for e-commerce tasks. However, admin force can work with any domain niche. So you can use it for virtually any entities which you have in your database. So let's copy it and paste to our agent. I'm using GitHub copilot.

[00:02:03]However, you can use anything like clex and so on.

[00:02:09]And it's ready. Now we can create our first admin for application. To do it, we will use admin force cla. You can type it as npx admin force create a.

[00:02:24]It's interactive wizard. First, it asks us how to name our app. I will use my admin for example. Now it asks us to write URL to our local database.

[00:02:42]Here you can select your favorite node package manager. We recommend to use PNPM as it's faster. Also CLI suggests you to install Prisma migrations.

[00:02:52]However, if you already have existing database with some existing migration tools, you can skip it and select no. So we have database. So we will select no admin force never modifies your database schema. This means that you should manage schema by yourself by using your favorite migration tools like LMB or Prisma or anything else. For admin force it doesn't matter. What is important that in admin force you define exact database URL and clearly define exact table names and columns which admin force will have access to. So you should understand that uninforce will work only with tables and columns which you define in your resources. Now we can open our ID in new folder.

[00:03:40]Also for convenience I will initialize GitHub repository here to track any changes.

[00:03:48]There are a lot of files and folders in admin force project structure. However, most important ones for now is index.ts TS which is our entry point. Also, it has global admin force config and resources folder. Resource in admin force is a representation of one database table or one database data collection. CLI generated only one default resource which is also important for authentication and authorization system to work. However, we don't have database table for it yet. Here we can see how table should be named in database and also we have array of columns and we can see how each column should be named. So we can create now table for this resource. Also it's important to mention that there is one virtual column which should not be created in database. Virtual column here used for passwords to provide inputs uh on UI part. However, we don't want store passwords in a database. So, let's go to our database management agent and we'll create a new table.

[00:05:02]To run our admin force application, we should open terminal and run pnpm start command.

[00:05:09]You can also use control-click to open this URL in a browser.

[00:05:14]And here we can see login screen. Later you will be able to change this logo, change colors, branding and so on. But for now let's discover how to login into our back office. So in index file at the bottom there is a code which creates first admin user with email admin force and password admin force. This code creates user only if there is no other users in database. So you can safely deploy this code to production. create user for yourself with true password and then the late admin force default user.

[00:05:47]So let's use it and we are in here we can see page with list of users. We can also open our admin users see its details. We can also create new users and so on. So now let's consider how to import our orders resource. Let's return to our terminal.

[00:06:10]To import resource from existing physical table, we recommend you to use npx admin force resource command.

[00:06:22]It will show you a list of all existing tables in database. We already have resource for admin user and we want to import resource for orders.

[00:06:33]We can check what happened here using g changes. First of all, our CLI generated new file under resources folder which has list of all columns which exist in database right now. You can for example remove some columns if you don't want admin force to manage them or later you can add a lot of configurations to this resource. Also CLI made changes to our entry point file. First of all, it imported resource file and registered it under resources key which is important to admin force to understand that this resource exists and also CLI generated new menu item which points to new resource. We can check how it looks here orders menu item appeared and we can get access to any entity from existing database. So now let's consider how to add agent.

[00:07:28]To add agent plug-in you can follow official admin force documentation or simply use coding agents. Admin force project ships with default set of aentic tools and assets like agents MD cloud MD and some agent skills which make work with agent efficient even with third party documentation resources. So I will use the second way.

[00:08:00]And it's done. Let's check which changes were made by Copilot. First of all, it created two new resources for user sessions and terms which are required for agent plug-in to work. Also, it added installation of our agent plug-in.

[00:08:15]Here by default it used OpenAI adapter but you can also easily switch it to for example adapter from Entropic or Google and it's important to mention that here we use openi API key environment variable. You can define this variable in your M file by adding this line here and writing your open I key. I have it in global environment so I don't need to do it. And also we can see other changes here. The adapter and agent was installed into package JSON and also some resources were registered in index file.

[00:08:57]Also we might need to restart our application here because agent made uh changes of database after changes the sources. So hot reload of admin force uh broke the application. So we can just press enter here and let's return to our instance of application. So here we got an agent and we can try to use it for some tasks. For example, we can ask some statistics on orders.

[00:09:34]Also we can use agent to build some charts.

[00:09:45]And here we got it. Also, we can build some reports, for example, tables and so on. Let's also unwrap this agent to full screen and run another query. Find top five products by total sold price and put them into the table.

[00:10:11]Here we got it. Also we can turn it into pie chart. For example, here it's done. Also we can use agent to modify some uh records. For example, we can find highest order change quantity to let's say 2x times.

[00:10:49]So here agent found this order. We can review it here. And now agent asks for confirmation to change quantity from 10 to 20. Let's confirm. Yes, sure.

[00:11:05]And it's done. As we can see now quantity is 20.

[00:11:11]We discovered how to use default agent capabilities. In the next video, I will show you how to create your custom skills and tools to allow agent performing more complex tasks like sending emails or generating custom reports or connecting external APIs.

[00:11:29]Thank you for attention.