Log in Talk to Sales Start Now
Home
Uncategorized
Uncategorized
2022-06-23

How to build your own custom CRM with No-code [Step-by-Step Guide]

Jestor is a no-code platform that can be used to build anything, from inventory, and collaborative project management apps to a custom CRM with No-code totally automated. In this beginner guide, we’ll go through most of the basic content you’ll need to learn how to build a CRM from scratch with no-code.

For the purposes of this guide, we’ll teach you how to build your own custom CRM, which is an interesting structure that will allow us to go over most of the basic features of the platform.

How to build a CRM from scratch:

Step 1: How to create Tables

When starting out, the first thing you should do is think about what are the necessary data structures for your app. To put it simply, what are the parts that compose a custom CRM with no-code software when it comes to information? 

For example, if you were to build a Content Management app, you’d probably want a place to write down ideas. In the case of the custom CRM with no-code, we’ll go with Companies, Contacts, and Opportunities. For each of these parts, we’ll need a table to hold their information. 

Why do we need this separation? Why not put everything on the same table?

Well, it all comes down to how you’re going to use this information. A table is, essentially, a structure for repeatable data. Each Contact will always have the same set of information (for example name, email, and phone number), so it makes sense to create a table with this exact set of data. The same goes for Companies or Opportunities.

However, the way (and how much) you’ll use them will vary. A Company may have many Contacts or many Opportunities. It doesn’t make sense to have ten fields for Contacts in the Company, or repeat input information all over again for a new Opportunity in the same Company, right?

That’s why you need to build these tables independently, and then connect them. It’s much easier to have a structure for Companies, one for Contacts, and say you can add as many contacts as you want to the same Company. Sounds complicated? It’s really not! You can do it with just a few clicks.

But first things first. Click on “+Add new” in the left-hand menu, choose Table, write the table’s name and press Create. Do this for the three tables: Companies, Contacts, and Opportunities. Once that’s done, click on the Companies table on the menu so we can start customizing it.

Step 2: How to create Fields

The next thing we’re going to do is add new fields to these tables. By default, the tables come with a Title text field, and automatic Created by and Created at fields. Now, we’re going to add some more information to this table. You can do this by clicking on the + icon in the table header, or by pressing F. This will bring up a panel with the field types you can create.

We’re going to add the following fields to the custom CRM:

  • Website: this will be a URL field.
  • Address: this will be an Address field.
  • Size: this will be a Single Select field, with the options Small, Mid, and Large. Note that you can also customize the color of each option, for ease of identification when looking at the table.

Now, create two new records in this table by clicking on the + icon on the top right, or pressing N. We’ll go with:

  • Title: Jestor.
  • Website: https://jestor.com
  • Address: 2021 Fillmore Street, San Francisco, CA.
  • Size: Mid.

And:

  • Title: Amazon.
  • Website: https://amazon.com
  • Address: 410 Terry Avenue North, Seattle, WA.
  • Size: Large.

Once that’s done, go to the Contacts table. Here we’ll add two fields:

Now, we’ll connect the two tables together. Remember when we said that a Company could have many Contacts? In other words, a Contact points to or belongs, to a Company. This means we’ll need a Connected records field in the Contacts table to tag the Company they belong to in the custom CRM with no-code. 

Add a new field of the Connected records type that points to the Companies table, and name it Company.

You’ll now be able to select a previously created Company when creating or updating a Contact. A cool thing about this is that you’re not merely selecting the Company name, you’re in fact connecting all the information from the Company to the Client record. This means you’ll be able to use the Company information when automating or using formulas, which is a topic we’ll get more into in a further moment in this custom CRM tutorial. 

Now, create two records on this table. We’ll go with:

  • Title: Andrew.
  • Email: [email protected].
  • Phone: 111 222 3333.
  • Role: Analyst.
  • Company: Jestor.

And:

Finally, let’s hop over to the Opportunities table. We’ll try to keep it simple for now, so add the following fields: 

Now, we’re going to add one more Connected records field for a Primary Contact. The thing is, if we just create the field without any further elaboration, as we did for Companies, we’ll be able to select any Contact, not just Contacts that belong to the Company we selected.

However, we can use filters in the Connected records field to fix that! Start creating the field just like you did before, selecting a Connected records field type, naming it Primary Contact, and selecting the Contacts table. But, before you create the field, scroll down: you should see a Connected records filters section. Click on + Add filter.

What this section does is filter out which options that will be selectable in the Connected records field. This can be fixed (like only selecting active companies or products), but it can also be dynamic. That is, filter based on the value of another field inside the record.

To do this, first select which field in the Contacts table will be used for the filter. In this case, it will be the Company field. For the condition, leave it at Contains any. 

Now, instead of selecting a fixed option in the Values box, click on the Use form field value checkbox. This will change the Values box to a Form field box. You can now select which field inside Opportunities will be compared against the Company field inside Contacts. As it is, it’s the Company field. Select it, click on Add, and finish creating the field.

Now, try to create a new record in Opportunities. You’ll see that, when you select Jestor as a company, the only selectable Contact will be Andrew. Similarly, by changing the Company to Amazon, the only available Contact will be Jeff.

Let’s create two Opportunities:

  • Title: Opportunity #0001.
  • Stage: New.
  • Amount: $10,000.
  • Owner: your own user.
  • Company: Jestor.
  • Primary Contact: Andrew.

And:

  • Title: Opportunity #0002.
  • Stage: New.
  • Amount: $10,000.
  • Owner: your own user.
  • Company: Amazon.
  • Primary Contact: Jeff.

Nice! We now have all of the structures necessary for a custom CRM with no-code. In fact, you could use the tables as they are, but that wouldn’t be fun, would it? Ideally, we would have Apps that help us operate the custom CRM, for example, a kanban view for the Opportunities. Before getting into that, however, we would like to talk about the records themselves, and some other features that are sort of related to them.

Step 3: How to create Records

Let’s go to the Companies table. Now, hover the cursor over the Jestor company record. An edit icon will appear: click on it. This will open the record for editing, which is a way to edit a bunch of information in the custom CRM with no-code instead of one field at a time. 

Also, in this editing view, you’ll see all the information contained in the record, even if you hide fields from view in the table. By using the options located at the top of the record, you can create new fields for the table, delete the record, or even reorder the fields inside the editing view.

More importantly, however, is what is contained in the panel on the right-hand side of the record. You’ll notice that you can shift between two options there: Comments and Related.

Step 4: How to add Comments

The default section when opening a record is Comments. In this section of the view, you can see and add comments to the record. This comment will belong to this record alone: it will not show up in any other record view. This is useful to keep a thread of information inside a specific place. For example, you may submit notes for a specific deal inside the Opportunity record itself, and it’ll be easier for you to find this information later in the custom CRM. 

Also, do note that more than a Comments section, this feature works much like a chat between the users. You can mention people by using the @ symbol, and those users will receive notifications inside Jestor, or even emails if they so desire. 

By clicking on the Related option, we shift the panel to another view where we can see all the connected data that pointed to this specific record.

In this case, we can see two connected tables: Contacts and Opportunities. And, as expected, they’re showing the relevant records in those tables in which this company was tagged. 

This shows that more than just copying the information, as a spreadsheet VLOOKUP formula would, the records here are truly connected. Opening a record is all it takes for you to see the connections, as well as where and how many times this record is being mentioned. 

Finally, you’ll be able to edit or copy the connected data right from the opened record, which can be helpful for quick input and checking relevant info in the custom CRM with no-code.

Step 6: How to create Tasks

As a last exploratory item, let’s check out the Jestor Tasks structure. Press K on your keyboard to open a panel for creating tasks.

Jestor has a dedicated section inside the platform for task management. Every task can be assigned to an owner, have a deadline, and, more importantly, be assigned to a specific table and record in the custom CRM. 

What this means is: that you don’t have to say in the description that a specific task belongs to Opportunity #0001. Instead, you can just title it something relevant (such as “Send standard agreement”), and link it to the Opportunity tables, and specifically, to the #Opportunity #0001 record. 

You can see all the tasks that you own in the For You section, which is the second icon in the left-hand menu, just below the Jestor (or your company’s) logo.

A better way to see this, however, can be by creating a Tasks type field in the table. Let’s do this now. 

Go to the Opportunities table, then create a Tasks field. You’ll see that this field looks a little bit different than the others: it holds a small icon that shows how many open tasks, if any, are contained in this record. Also, the task panel it opens will let you create tasks that are automatically linked to this record, which is easier than inputting this information manually. 

Note that not every task has to be linked to a record! Sometimes all you want is to create a quick reminder for yourself. In this case, pressing K to create a new task works wonderfully. 

Well, now that we know how these basic structures work, let’s start working on building your own CRM with no-code app itself. 

Step 7: How to create Apps 

Let’s start by creating an App. This is similar to creating a table: just click  on +Add new in the left-hand menu, choose App, write the app’s name and press Create. In this case, we’ll call it a CRM.

You’ll now have a blank slate for building your own no-code CRM with no-code. Let’s go over things that could be interesting if we’re thinking of this as a central hub of sorts. For this example, the parts we want are:

Let’s start building then! Click on the + icon on the top right to bring the blocks/components panel. 

For the first item, we’ll go with a Single Record View. Name it Company View, then select the Companies table. Now, in Select fields, choose all the fields you want to see in this block. In this case, we’ll go with Title, website, address, and size. Resize and drag this block as you want.

For the next item, the Contact list, let’s build a List View. To start, select the Contact list, and order it by Title/Name of the Contact in ascending order. Now, in the List fields select the fields you want to appear on the list main view. Ideally, in this part, you select a few fields, for a more condensed view. We’ll only go with Company and Role here. 

Next, select if you want this list to be read-only or not: read-only means you won’t be able to edit the fields you’ll select in the next section. Finally, scroll down, and in the Update record form, select the Email and Phone fields. Create the record, and as before, resize and rearrange it on the app.

For the kanban view, create a Cards block. Name it Opportunities, select the Opportunities field, and select the fields that will appear on the kanban card. We’ll keep it simple for interface economy and go only with Company and Amount. For the single selection variable (which will be what defines the columns), let’s go with Stage. There are more settings, but for this app, we can go ahead and create it as it is.

The comments block is very simple: just create a Chat component, name it Notes, and select Company. 

Lastly, create a Maps block, name it Location, select the Company table and then Address as the field. 

With this, the app is nearly done! However, you’ll notice that it’s showing information from all over the place. That’s because there are no filters in the components. If you paid attention while building the blocks, you probably noticed we could add filters directly into them. However those would be static (in other words, fixed) filters, and we want them to be dynamic. 

So let’s create one final component: the Filter Magnet. This is a special feature that lets you filter other parts of your app by selecting an option. Name the component Filter and click on + Add Filter.

For the Button name, go with Company. Select a color of your choosing, then select Record ID as the Filter type, then select Companies as the table. 

What we’re going to do in the Select components section is say how we’re going to filter each component using the Company we’re selecting. So add all components you created selecting the following fields for each of them.

  • Record View (Company): as it’s a component that sees the Company table, select Record ID.
  • List View (Contacts): the Contacts table has a field that chooses a Company, so select the Company field. 
  • Cards (Opportunities): the Opportunities table has a field that chooses a Company, so select the Company field. 
  • Chat (Notes): as it’s a component that sees the Company table, select Record ID.
  • Maps (Location): as it’s a component that sees the Company table, select Record ID.

Save it and finish creating the field. Do the last pass of resizing and reordering things to your liking and exit editing mode by clicking on Done on the top right.

The app is finished! Use the filter magnet to select a Company (say, Jestor) and all the apps will be refreshed to show Jestor info. Congratulations, you’re nearly done building this functional, easy-to-use CRM with no-code! 

Nearly done? Yes! There’s one more thing we’d like to talk about: automation and buttons.

Step 8: How to create No-code Automation

Let’s go back to the Opportunities table. We’re going to do two things here:

  • Setting up automation so, that when an Opportunity goes to the Won stage, you receive a task of “Onboard customer {{company.name}}”.
  • Creating a button that moves the Opportunity to the next stage in the kanban.

Before starting this, there’s one crucial thing to understand about no-code automation. They always follow a Trigger -> Actions structure. What this means is that you start by defining the event that will set off the automation, and only then the actions to be performed. 

Some hands-on experience will help us understand this a little bit better. Click on the + Automation button in the top right corner. Now, click on + Add trick. 

Name this automation Create an onboarding task and, for the trigger, search for the When a field is changed. 

Remember when we said before that we want this automation to run when an Opportunity goes to the Won stage? Well, it seems to fit this trigger perfectly: When a field (Stage) is changed (to Won).

For the table, select Opportunities. Next, choose Stage as the field, and write Won as the value. 

So, right now, our automation trigger will run when, in the Opportunities table, a record has its Stage field changed specifically to the value Won, which is exactly what we want.

Now, we need to select one or more actions. We’ll go with only one: Create a task. For the Description, write Onboard customer, then select the option Company * Name. The whole thing will look something like Onboard customer {{companies.name}}. This means the Company name will be dynamic, depending on the Company that is tagged in the Opportunity.

Note: a cool thing about this is that we’re using connected information. If we want to use a Company’s name, or size, from the Opportunities table, we can. That’s the magic of connected data.

For the Owner, choose your user. This could also be dynamic, but as you’re probably the only user in your account right now, let’s leave it static.

Leave Table as Opportunities, and now change the Record option to one called id opportunities. This means the task will be linked to the record that is moved to Won, and not to a fixed record in the table. 

Save the automation and test it by changing some Opportunity’s stage to Won. In a few moments, you should have received a task just like you set up! It will be in the For You section, as we demonstrated before, but also reflected in the Tasks field we’ve created in this table. 

For the final part, we’re going to create a button that moves any Opportunity to the next stage. 

Step 9: How to create No-code Buttons

Create a field of the Button type in the Opportunity table. Name it Next, and for Action leave it as Automation. Buttons in Jestor can also link you to internal or external URLs dynamically, but we won’t be using them for this in this case.

For the button label, write Next. Now choose a color for the button. Finally, click on Connect an automation button. 

If you have previously created an automation that is linkable to buttons, they will appear here. However, we will create new automation from scratch. 

You’ll notice that we don’t need to choose a trigger here. It’s already set up for us: When a button field is clicked. All we have to do is create the action. For this one, we’ll choose the Move to Next Stage action.

For the table, select Opportunities. For the stage field, choose Stage. Finally, for the record id, choose id opportunities. It’s going to look like this: {{id_opportunities}}. This is signaling that the Opportunity where you pressed the button is the one that should be moved. Create the action, save the automation, then save the button. You’ll know you’ve set it up correctly if the icon of the automation appears in the button.

There you go! Now test it by clicking on one of the Opportunities. If you did everything correctly, the Opportunity should go to the next stage in the list.

Before finishing things up, let’s go back to the custom CRM with no-code app. Click the edit button in the top right corner, and then edit the kanban component. In the Select actions section, select this button you’ve created, and click on save. You’ll notice that the button will appear on the kanban view, and now instead of dragging a card, you can click on the button to move it.

This is the last point we’d like to touch on in this build a CRM from scratch tutorial: buttons can be used for a myriad of things: opening an external page, running automation, adding connected records, and so on. Once created, they will be usable in the apps as well. You can take advantage of this to build ultra-focused apps. There are a lot of cool options that you can experiment with.

Automation is also very powerful and cover a wide range of topics. While we kept things inside Jestor for now, you could have automation for sending emails, Slack messages, or even creating subscribers in Mailchimp. Checking out the automation possibilities will certainly be worth your time.

Complete custom CRM with no-code

You can now add your own touches to the no-code CRM. There are probably a lot of other fields you wish to add to the tables, or automation that you know can help you out in being optimally productive. There are also a lot of other features we didn’t quite delve into in this how to make your own CRM with no-code tutorial, so don’t be afraid to experiment and explore all the possibilities within the platform. 

While this is a how to build a CRM from scratch lesson, the things you’re picking up right now are applicable to a wide range of uses. Content creation, project management, inventory tracking. There are a lot of ways Jestor can help your company grow with a scalable and integrated solution. Check out some of our other content to find out how.

Youtube Channel

Go to YouTube