top of page

A Non-Coder's Guide to Coding in a Knack App

Updated: Sep 24, 2022

Simple explanation of how to do basic coding in a Knack app.

"stock code" from Knack:

Full Transcript

hello dave parish here with uh

knack builders doing another uh

knack functionality functionality video

um if you like these videos go ahead and

and like it on the youtube channel or my

blog that's always helpful

but today's topic is

a non-coders uh guide

to coding and i say it's simpler than

you might think

so there you go i'm a non-coder believe


i am my uh degrees in history

and business experience and operations

management finance

um i am definitely not a coder but

nak does have um the ability to add

some code behind the scenes in their


which adds certain functionality um

i'm a given uh overview of what you can


um and spoiler to this i'm just

stealing other code and doing some

adapting to it

to uh to let me do what i want to do

so i'll be back in a minute

okay i'm back here on the topic for

today of a non-coder's

guide to coding uh in a knack app

now one thing you might ask is i thought

knack was a no code app

um i didn't need to well it does allow

you to do

all kinds of stuff behind the scenes if

you want to

now i'm going to tell you i have a lot

of clients

that simply do not want

me to use code they found knack

because they don't want a platform where

they're going to have to be

wed to some coder they've been down that

road before

and don't want to go down it again and i

won't even get into all that

but all due respect to coders um

so when i'm doing stuff for them you

know they're asking me find a way around

it to do it natively because we don't

want a bunch of custom code behind the


and i actually thought uh for my own

practice that i was gonna need

to learn code and i uh did

take some classes and do some stuff um

i thought the ability to continue to get

business would that would be necessary

but i found it is not i have no problem

uh growing my business without using


so with that said uh let's jump into

how this works get rid of

some of this and here's how you do it

um i'm going to show you the basics of

actually doing it

first of all i'm going to open

a url i'll keep this

in the instructions below or

sometimes i just google let me call up a

a browser here you can just google mac

hq custom

code and what you're looking for is this

thing called development docs

and again i'll keep it now here's the

different types of code stuff but mostly

i deal with

javascript or css

if you go to one of these it's going to

give you

the overview of how code works

but the real guts to this for my example

are these examples

they have put in a bunch of different

types of functionality

common stuff you might want to use

here's the name of something

here's the code you use name is

something else moving the signup link

add check boxes uh

the chrome deal with comp table it you

know all kinds of different things i'm

going to leave it up to you

to browse through this so this is where

you find or if i said earlier

where i steal existing code and just

adapt it

to what i do and notice this

i'm gonna make this bigger

a lot of this has to do when you're

adapting it

is just the simple thing do you want it


to any part of the app

or do you want it applied to a

particular view a particular field

or it's going to be in here a particular


that's the basis of how i adapted

that any will apply to the whole app

and a scene will apply to specific scene

now let me go pull up an app here and

look at i'll show you how to find that

here's a scene if i go up to the url

up here is scene 32.

if i go to a different one

scene 47 appeared that's where you find

the page basically that you want to

apply something so if i want to make a


smaller on a particular page i would

insert uh scene 47 in that code

if i wanted applied for the whole app i

put any

um that's basically how it works

now i'm gonna give you

an example

here is one that i have an issue with

often and i often use code

this is for modal pop-ups which i did a

recent video on

but in next default

if you call up a modal pop-up you're

putting in information during the form

if you click off to the side it will

uh get rid of that it'll go back to the

scene before

now if you fill out a bunch of

information um you're gonna lose it all

and i have several clients who just

don't like that so they say can we not

have this when you click to this side

get rid of well

there isn't a native function that where

you can click a button say don't do that

you gotta

pop in uh that code so

here's what i did first of all where you

find to do that

up on any of your apps there's going to

be this gear

and right down it says api encode

click on this and you're gonna have to

know you can look through that and see


uh different stuff is for javascript

and css

but in this case i've taken that code

over there

and i've copied it it initially had a

particular scene if i only wanted that

to happen in one

scene i would replace any with the name

of that scene

in this case i don't care what the modal


shows in the app because we have a bunch

of them i put

any and it will apply to any

so you just plop this in and by the way

this hash

and these these mean instructions

um so you can title what you're doing so

you know what it is

then underneath starts the real code so

i've applied it i put it in here

made my little adaption click save


probably in the live app you're going to

have to refresh it


that's applied let this get refreshed

and if i put in a modal pop-up

and click off to the side it does not

go away great little trick

using a little bit of code you don't

need to be a coder

to take that and make it work um

some other examples that i use all the

time i like to make all the instructions

italics i don't know if i have a good

example there i think i have it in here

normally next default is and i just

don't like it the instructions

in forms hey you need to put this in


this box uh or watch out for this or

make sure you do that

comes up as a straight non-italics

larger text

and to me and a lot of users it just

looks like it's another

uh field or something you have to put in

so i like to make it a little different

so it appears to be

instructions well in this app i believe

i did that

that that case css is generally more for


of the page javascript is generally more

for uh for serious functionality

um now a coder probably have much better

explanation than i just give but

that that's the general thing so here

i can this is for change instructions

on all fields where you know

instructions exist

i've made that a 12 point font again you

can get this right from that

that document

from mac and style italics

that's simple if i wanted to make it 14

9 i can just do that

and that will apply to everything uh and

in this case

there was one uh change inventory on all

transact this is a particular screen

that has a lot

on it it's a history of all the

transactions for an inventory app

and i wanted to see all the columns on a


uh and the only way i can do that so

they don't have to scroll over it was to

make the font smaller

in that case that view of the inventory

was scene

79 so i made this font where it worked

now if i wanted the smaller font to

appear on

all pages i would have put any

there instead a specific scene

uh you can also hide chrome trails

uh and even on instructions which

wouldn't appear here at pier

um let me go do it

a field

if i i could put

markup language or it might even

actually be code and honestly i don't

know but i could put a specific

uh string here which you could find that

has it's just not words it has a i

usually put a hyperlink in it

you might want someone to refer to

something else before they're answering

you can put a hyperlink in there and you


tell to open a new page so

uh that can be useful too i might do

more on

on that topic in another video um

so that's a general overview of how a


will use code it takes a little bit of

getting used to but do not be afraid of


uh you can tackle it if you can figure

out some of this behind the scenes

or more advanced snack functionality you

have the capability to

deal with the basic coding

some other resources to

to get code you can go to uh nax


and search for things there's a lot of

folks in there that write

uh how how do you do this with custom

code or the custom code i have isn't

working quite right

right and other knack folks who are

active will

will help you figure that out

or you'll just find code that works or

you can adapt

to yours a lot of times that stuff is a

little more

advanced but you might be able to figure

it out and then that

if you read through that those knack

articles uh

that that i showed about how how to use

code how to structure them

what you know different things made in

all those examples if you just dedicate

a little

time your uh learning will go up quite a


and there's another place if you want to

even do more

it's called code academy spell that

right it's a

uh one of the main places on the

internet where you can learn things

about code

a lot of times these courses are free so

hey here's code academy

i want to learn more about javascript

okay that's one we use a lot so

and here's a bunch of courses they offer

and i think pro is you gotta pay for it


right here learn javascript part one

part two uh

sign up for it it takes you through a


um it's just it's not it's not simple in

terms of

they've taken their time to structure a

real course

um and so if you really want to beef it

up you can do that you can do it on

javascript css and probably even api

stuff which api

i really have not included in this

uh explanation that might be another

another topic i have that's for

integrating two different cloud apps

and you can use stuff like zapier

or integromat to do that in a non-coding

manner or if you need to do something

specific you're going to write some


uh api code so that is what i got

that's my uh as a non-coders

guide to coding in a knack app

hope you found that at least a little

bit interesting and useful

if uh if you like it you know where to

like it below

look at the links below if you want to

learn more and again

this was orientated for folks that

really don't know much about code

and i bet i got some stuff wrong in here

because i'm not a coder and a

seasoned coder would say what did he

just say

well you know what i'm going to live

with that because it's working for me

i appreciate it have a great day and i

will talk to you soon

thank you

51 views0 comments

Recent Posts

See All
bottom of page