This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Koen Bok
Posted Apr 19 - Read on Facebook

How many people here are using Coffee Script over Javascript for Framer?

I like Coffee Script better but always just stuck to Javascript for Framer content because there is so much more knowledge about js. So it's easier to find other examples and people to help you out.

The downside of Javascript is that is can seem very complicated to beginners. Coffee Script solves some of that. Consider these examples:

- "for (var i; i<l.length; i--) {}" vs "for item in list"
- "function() {}" vs "->"
- "var myVar = 1" vs "myVar = 1" (no var)

I think I might do some tests on people trying to learn coding for Framer to go with Coffee Script directly. If you have an opinion on this, Id love to hear it.

To learn more about Coffee Script see:

15 Comments

Florian Pnn

I begin to be quite fluent on Javascript because of Framer and MeteorJS but always ask myself if I should learn CoffeeScript. Is that can really speed up my development?

Koen Bok

Hard to answer. If you're fluent in JS I'm not sure it's worth it. I'm mostly curious how it will work out on beginners.

Harold Kim

I write my prototypes in JS because it doesn't need a preprocessor. I've avoided Sass and SCSS for this reason too-- it's nice to share my code with another designer, who can make some quick changes in a text editor and refresh their browser without the need to compile anything.

Harold Kim

Though I find that many folks I introduce to Framer trip up over small things like matching curly braces { }, and CoffeeScript would definitely be a cleaner alternative for them.

Gary Jacobs

I'm not fluent in JS. I'd class myself as between beginner and a novice. Honestly I prefer the raw JS. Makes a bit more sense to me personally. Might be a different story for someone who has never touched JS.

I think the biggest hurdle for beginners is to convey the concept of if statements and for and while loops etc... Being a visual person I had to teach myself java using Alice to marry up what the code was doing. Once I started thinking in functions and how I could use them to bring designs to life, it is exciting to start thinking how js will work. I look forward to coding more than designing. In fact I consider it apart of my design flow

Koen Bok

Another big problem for beginners that I see often is that Javascript (or any coding language) is so unforgiving. You type a "," instead of a ";" and everything just stops working. If you then don't know how to use the console to figure that out you are basically screwed.

Live feedback while coding with clear inline errors (much like xcode) would really help here I think.

Stephen Crowley

I'm writing JS for my prototypes but to be honest never really wrote Coffee Script. For me it's just faster to write/read and easier look for resources to hack something together. The fact that there are so many resources for straight JS would be my argument for beginners and out of sheer ubiquity.

William Hutter

I've never tried CoffeeScript and I'm getting confortable in JS.. I have to say I'm always a bit confused when you link to a Codepen in CoffeeScript: I always turn on the JS compilation to see how it looks but then the JS seems more complicated than expected!

Noah Levin

I think CoffeeScript is the way to go in the long term, and I personally much prefer it, but may be a bit too soon at the moment for wider adoption. Particularly as debugging needs to be way better. I still find myself using tools like http://js2coffee.org/ and the coffeescript.org console, which just feels funny. Definitely agree about live coding

Ryhan Hassan

^^ Agreed - while I prefer CoffeeScript, I find myself continually thinking about what it's getting translated into while debugging. I'm not sure I could recommend learning CoffeeScript to someone who isn't already familiar with JS.

Rasmus Andersson

JavaScript have way fewer primitives than CoffeeScript, which is an important attribute for beginners.

And to be fair, in your example you'd probably write "list.forEach(function(item){...})" in JS rather than a for loop (when teaching beginners.)

Thomas Aylott

I find CoffeeScript syntax too ambiguous. It's hard to understand at a glance what the heck is going one when you have nested objects and function calls and all this stuff going on. But I'm no doubt biased from my many years of JS and I only have CoffeeScript a few hours of my time.

I found it to be a little too brittle also. If you don't indent it perfectly it means something totally different. Lots of subtle bugs and frustration.

I use the web inspector a lot. It doesn't support CoffeeScript (yet)

Thomas Aylott

I do really love all the ES6 stuff we use at work now. Mostly fat arrow function syntax classes & modules. It still has some of the complexity of using a compiler though, so I don't use that stuff when teaching people JS (unless they work here too)

Aaron Carámbula

In teaching beginners, the code completer obviates most of the punctuation and syntax hurdles in js/framer.

Also js requires no set up and has tons of getting started opportunities.

I learned coffee script and love it but find it's just a bit more work to read (probably because I know js better and have to translate).

Tisho Georgiev

I agree with the overall sentiment that JavaScript is more appropriate for absolute beginners. In my experience, people new to JavaScript immediately get hung up on the syntax, so equipping them with the right tools to deal with problems in their code (and teaching them that it's OK to have those problems in the first place) is more important than actually trying to avoid those issues by introducing them to CoffeeScript.

One of the things I do in my workshops is spend a few minutes going over basic use of the developer console whenever someone encounters an error. They don't need to understand what the errors mean just yet, but having the filename:line-number information is usually enough to get them to focus on the part of their code that's causing a problem. As others have mentioned, as it stands, CoffeeScript makes basic debugging tasks like this needlessly complicated.

That said, I've often wondered if introducing people to Framer through CoffeeScript wouldn't be easier if the Framer exporter app just did the CoffeeScript compile/watch part for you automatically with the proper sourcemap generation and livereloading (essentially merge Cactus w/ Framer), so that people 1) still had (sortof) proper debugging and 2) didn't have to worry about what a JS preprocessor is and how to use it. This would have other unwanted side-effects (e.g. prototypes wouldn't be so easy to edit by other people without some additional setup), but is maybe worth exploring.

Read the entire post on Facebook