[HOW-TO] Create a custom Calendar using repeating group

While you can do all sorts of web stuff in a variety of languages, JavaScript is the thing you want to focus on. Here’s why:

At the end of the day, Bubble is simply a very powerful and easy-to-use system for building websites and web applications (which one might just call “really fancy websites with dynamic stuff and a database backend” :wink: ). Backend technologies can vary widely, but websites and web apps really just boil down to the following (simple but powerful) technologies:

  • HTML (the basic markup language of web pages)
  • CSS (cascading style sheets/styling properties of HTML things)
  • JavaScript (the universal language of web browsers and other web clients)

Web browsers as we know them today aren’t just simple applications that display information in HTML. They are, in fact, powerful programming environments. You can think of them as a program that runs programs. Those programs are composed mostly of the three elements above.

Bubble makes it really easy to build pretty complex things on the backend/server side, while also helping you style/design pages and do some pretty fancy stuff in the browser. But like any web site/app authoring tool, you can extend it a HUGE amount with a little JavaScript. (In fact, you won’t get far with ANY web authoring tool or service without learning – even just by osmosis – how websites work.)

(Even if you’re just authoring a static-ish site with something like Squarespace or Wix, a little knowledge of these core web technologies greatly extends what you can do. So Bubble’s not unique in the respect. What you’re doing with Bubble is building web things.)

A while back, I made a very simple video that shows how easy it is to do very basic, simple stuff with just a tiny bit of JavaScript and the Toolbox plug-in. Check this out and you might get hooked:

JavaScript is basically the thing you’d want to learn vis-a-vis building more advanced websites and web apps in Bubble. And really, you can learn it piecemeal – you might be surprised how development in any language actually works in many cases. Basically, someone’s always done more-or-less exactly what it is you want to accomplish. And somewhere, someone has already asked "how do you do ‘X’ in JavaScript?'… and multiple someones have provided answers on various approaches.

So Google (and StackExchange and sites like that) are your pal!

As far as APIs go. If you know some JavaScript you can write not just browser-side stuff now, but server-side stuff as well. JavaScript is so well understood (and has become a really great, very modern, and more-or-less easy to write programming language) that there’s a thing called “node js” that is JavaScript, but for using on a server or any sort of device that’s NOT a web browser.

Node is basically just JavaScript. It’s a way of running JavaScript in other places than in a web browser. There are a variety of ways that you can run JavaScript on a server running Node that are fairly easy to get started with: Namely Amazon Web Services “Lambda” and Webtask.io. These are what’s called “function as a service” services. They basically just let you plop down and run some code and return the results of that code over the web. So they can be used to make what are essentially your own APIs really quickly (Webtask is the much easier of the two, in my opinion).

Without going on for much longer: What makes Node so awesome is that there are tons of libraries for doing fancy things that are open source. These libraries are all available in a thing called NPM that’s completely integrated with Node. (And in Webtask there’s actually a point-and-click environment for loading libraries from NPM – you can install anything that’s in NPM super easily without mucking around with command-line stuff.)

BTW, most NPM libraries are also available in plain-old-JavaScript and can be loaded in a web page and used right in your Bubble pages (in the browser). But I find looking for things on NPM to be much easier than looking for things on GitHub (which is the service where everyone posts and hosts their open source projects).

Here’s a post of mine that gives you a specific example of how loading a library and using it in a Bubble page works (not a tutorial, but I’m saying, “Here’s a line of code you can use to do what seems like a very hard thing” [you’d execute that in a Run Javascript action from the Toolbox plugin] and then I note what libraries you need to load to be able to execute that line of code):

Note: perhaps I should branch this thread. :stuck_out_tongue:

10 Likes