When developing the solution for Inventory Management System, with mobile app integration, NocoDB actually fit every single aspect perfectly.
- NocoDB able to generate QR Code automatically
- NocoDB come with ready REST API
Follow the below tutorial, I promise you can do it within 10 minutes with the above functions.
Pre-requisite check
Initial requirement
Let’s look at how it started, as well as the initial design
URL
https://www.nocodb.com/
Platform
NocoDB is an open source project, you will be able to find a lot of options for platform at here.
Email
Same as WordPress, you may need to make sure SMTP is working, as you are on your own server.
What? You don’t know what is SMTP? Ok, it is time to get to your friendly IT department again…
Cost
It is an open source project, hence technically no cost to use the software, but you will have to pay for the cost of the infrastructure – server hosting.
Programming Skill
You don’t really required programming skill here, but a basic understanding of REST API end point will be helpful
Part 2: Retool as mobile app frontend
The 2nd part of the article, explained how NocoDB served as backend, and Retool served as mobile app front end.
Let's get started
Configure the tables
Let’s start with creating a new project as usual, we call it “Inventory System”
2. Next, we create a table under this project, let’s call it “products”
3. Next, let’s create the necessary fields based on requirement for the “products” table
4. To generate QR Code, we making use of Row ID as the QR Code data. At this moment, NocoDB’s QR Code field not able to directly refer to Row ID, hence we have to create a Formula column type, which will reflect the Row ID. Let’s call this column “QR Code String”
The formula to reflect Row ID for NocoDB is
{Id}
5. Now, we finally able to create a QR Code column, make sure the QR Code value refer to the column we created just now, which is “QR Code String”
6. Once we done the configuration of the table, let’s load some sample data to try it out. As usual, we get the sample data prepared for you, download it here.
7. Upon load up the sample data, you can see that “QR Code String” and “QR Code” automatically generated! Cool eh?
Configure the REST API
1. Now, we gotta setup the REST API for mobile app later, hence we start with creating access token. Under this project, click on “Team & Auth”, and then “API Tokens Management”, click on the button “Add New Token”
2. NocoDB come with Swagger, which is a really sweet tool to help us test out the REST API without hassle. Click on “API & Support” at the bottom left, and then “Swagger Documentation”
3. Upon switching to Swagger page, you will be happy to see the REST API for “products” table already created automagically!
4. To try it out, we gotta get ourself authorized first. Click on the top right “Authorize” button, place the access token key we created just now, to xcToken (apiKey), and then click the “Authorize” button
5. For this project, we only need 1 of the specific REST API, which is getting the product detail by Row ID, hence we pick the below REST API to try.
To test the REST API, go to this specific REST API end point, and expand it. You shall see a button “Try it out” button by now.
Let’s key in Row ID at below text box, and then click the button “Try it out”
6. If the Row ID you enter is a valid Row ID, you shall see a successful response from the REST API, which return the products information
7. You just created a database with below functions:
- Generate QR Code automatically
- REST API available to return product’s information by Row ID
The database is now ready for mobile app to trigger – Please follow up the next chapter soon: Mobile App integration with NocoDB
