Which HTML5 engine/framework and coding language to choose?

[fsquier]

Hello! I am a 14 year old student from Estonia (so English is not my mother tongue ).

I have choosen to make a computer game as a school project and decided to use HTML5. I understand basic programming and how code works, but syntax is problem for me. I know a bit of JS and some Python. I kind of dislike Javascript syntax, but really like Pyhton syntax since it is easy to undesrstand and I don't know how to code in HTML5 and CSS (but that is not a problem because they are easy to pick up, right?).

Anyway I have tried Construct 2 and can easily make a game in it and I am also willing to buy it's license, but I feel that this engine is a bit limited so I don't know what to do. I will probably use Construct 2 to prototype my game but would like to try Turbulenz engine to build full game, since Turbulenz seems most advanced. On the other hand Turbulenz engine wants me to use JS or Typescript. I understand that Typescript has better syntax than JS but Coffeescript has even better and more Python-like syntax. Is it possible to code in Coffescript, translate to Javascript and use code in Turbulenz engine or is it impossible/too hard?

Also, after I have picked up JS/Coffescript/Typescript, should I move on to the haXe because if I can code in haXe, I can basically develop games/software in C++ ? (C++ syntax is killing me -.-) Thank you! -Sorry for grammar mistakes.

[skiffcz]

Mother of god!

 

How could I miss coffescript? Seriously, thank you good sir for showing me the way.

 

To clarify a bit, my own progression was following:

 

1, C++ (just because everybody was doing it)

2, C (after stumbling upon this - I dont say you should code in C, but its worth a thought)

3, Python (I was resisting this one for a long time - but seriously, there is no reason for having tons of braces in the 21 century. Once you see it, you cannot unsee it)

4, Forced to work with Java (Job. Mutually agreed hatred inevitable)

5, In school touched Haskell (Useless, but some concepts are exceptionally beautiful)

 

And yet, here I am, hacking code in Javascript. I tell you what. HTML5+js+css is a platform with awesome idea, but terrible implementation. I mean, Javascript is one really ugly bastard (at least for a person with the mindset progression as above).

 

Btw, no real help here I guess. This is an unanswerable question, and what one hates, another might love beyond reason. Its like this - when you start walking, you just pick a pair of shoes and walk. Only after you have tried a lot of pairs and walked a few hundred kilometers you know what you hate/love about shoes and can make an informed decision when buying a new pair. There is no shortcut to first hand experience.

[Quetzacotl]

If this a school project, then its purpose is learning. So I would definitely go with pure JavaScript, TypeScript or Coffescript are not really a tool your future employers will desire, but JS will be for sure one of it.

If you know already Python (or other langage oriented about classical class-instance dualism) then you have to know, that in JS there are no classes or instance, and you shouldn't try to simulate them. Read about Self, Io or Smalltalk, it might clarify lot of things.

[fsquier]

I understand but JS might be a bit too hard for me especially when coding a game so maybe it is possible to use Coffeescript with Turbulenz^? and learn pure JS afterwards? And since I have learned Coffeescript, mastering JS would be much simpler?

[Quetzacotl]

I'm pretty sure that Coffescript knowledge won't help you learn JS, it might even slower things down.

[fsquier]

Well lets just say I want to make a game and don't want to handle with JS's weird and a bit aged syntax right now. Is it possible to use Coffeescript with Turbulenz engine?

 

BTW. I think that Dart or Coffeescript/Typescript is the future, not Javascript.

[arnuschky]

Well, Typescript compiles into vanilla Javascript, that means, any language that can incorporate JS libs can use projects written in Typescript. If you are sure that Coffeescript can use other JS libs without any special requirement (such as Dart needs them), you can certainly use Turbulenz with Coffeescript.

 

If you want to go with a altJS lib and Turbulenz, I would go for TypteScript though. Doesn't make much sense to start using two altJS libs. Personally, I strongly dislike Coffeescript - I think it trades readability for brevity, and doesn't add much conceptually as it mostly focuses on syntax.

[agmcleod]

Personally, I think CoffeeScript just isn't worth it anymore. You'll need to use guard or something in your process to compile the files to JS first, then run them through the build process with turbulenz. If you just run a simpler engine like MelonJS or Phaser, then you can at least use something like Middleman or Sinatra to run coffeescript files for you in real time. The benefits of CoffeeScript are slipping away, and really writing javascript isn't that tricky. Just have to be careful on how you use inheritance.

[ozdy]

My thoughts about HaXe + OpenFL - http://blog.ozdy.com/post/67749482493/thoughts-about-haxe-openfl

 

In short, haxe has bugs and has a significant learning curve (even for me as an ex-Actionscript 3.0 developer), and support can be lacking, but I don't think I'll switch from it soon - the more I debug and learn about it - the more I like it

[fsquier]

Okay, so using Coffeescript with Turbulenz in possible but pointless. I think that TypeScript is officially supported by Turbulenz and learning TS would be a better option since in the future JS will probably fade.

So it is down to JS vs TS. TypeScript has better and shorter syntax, but if I want to learn haXe, Python, Java, Dart... in the future, would Javascript be much better?

And what about documentation using Turbulenz with Typescript?

[YellowAfterlife]

TypeScript stays quite close to JS syntax but adds, well, types (and classes). In a sense, it also saves you a headache or two, as long as you don't stumble upon any bugs in it. Software like Visual Studio also has excellent support for both JavaScript and TypeScript.

CoffeeScript option is discouraged, since the syntax is less similar to original JS, and the resulting code may end up looking even odder than JS for certain kinds of applications.

Haxe is an amusing option since it permits you to not deal with "target" languages directly - you always write the healthily typed class-based Haxe code, which then translates into binaries or sources most appropriate for purpose. It can take slightly longer to get hang of (as opposed to JS) but I would say that it's well worth it.

[Paul-Andre]

For your first project, I would recommend using plain javascript and plain canvas.

Using intermediate languages and complex libraries may be tricky to set up and may turn you off.

(What I really liked with javascript is that you needed nothing more than a text editor and a browser to start.)

Learning HTML/CSS is also a great idea. You can use HTML/CSS without javascript, but you can't really use javascript without a base of HTML.

Also I'd like to note that HaXe isn't a good choice to make html5 games. Flash games - yes; Html5 games - no.

[fsquier]

Since this is a school project, it can't be ... crap so using plain JS and canvas isn't a choice. Anyway, if I start learning a language for Turbulenz, Typescript would be better, since it is more modern and easier but what about Turbulenz's documentation? Will i be able to understand it if I learn TS?

What about Typescript's own documentation? Are there any books for beginners or websites (Codeacademy for JS is extremely good )?

Also what abou IDEs? I would really like to develop in Ubuntu.

[Quetzacotl]

Since this is a school project, it can't be ... crap so using plain JS and canvas isn't a choice. Anyway, if I start learning a language for Turbulenz, Typescript would be better, since it is more modern and easier but what about Turbulenz's documentation? Will i be able to understand it if I learn TS?

What about Typescript's own documentation? Are there any books for beginners or websites (Codeacademy for JS is extremely good )?

Also what abou IDEs? I would really like to develop in Ubuntu.

Who told you that JS is a crap? it has different feeling from OOP because it's not OOP. I have to admit that it has some odd things, like "new" keyword, which is a mistake of JS creator (they wanted to make JS easier to use by Java programmers), but it's still a great language. You have to face it or you can waste your time on Coffeescript/Typescript or whatever. 

Javascript is continously developed by many companies and it won't stop, while TS or CS might be buried anytime.

[alex_h]

in the future JS will probably fade

 

I'd have thought that if anything javascript is on the up right now, not fading. What with Actionscript developers turning to javascript, and Node.js allowing you to you use javascript for the back end as well as front end stuff it seems to me like there is more and more javascript going on, not less.

[fsquier]

 

Who told you that JS is a crap? it has different feeling from OOP because it's not OOP. I have to admit that it has some odd things, like "new" keyword, which is a mistake of JS creator (they wanted to make JS easier to use by Java programmers), but it's still a great language. You have to face it or you can waste your time on Coffeescript/Typescript or whatever. 

Javascript is continously developed by many companies and it won't stop, while TS or CS might be buried anytime.

 

No, you totally misunderstood me. My game would be crap if I would only use pure JS and canvas (no game engine) because using game engine built by professionals is way easier and better than building my own engine.

And also why is TS/CS a waste of time? It's not the most popular language but the pure language itself is still better than JS.

 

I'd have thought that if anything javascript is on the up right now, not fading. What with Actionscript developers turning to javascript, and Node.js allowing you to you use javascript for the back end as well as front end stuff it seems to me like there is more and more javascript going on, not less.

Yes, I know but I believe that every language will fade some day because better and more modern languages with same functionality will come (Dart). For example Pascal was once a big programming language but it was released more than 40 years ago. I definitely don't think that JS is a bad language but there are just better alternatives.^{- My opinion.}

 

And could we please stop bashing TS/Coffescript and praising JS, I feel like I am the protector of  the underdog .

-----

Do you know good and beginner friendly TS tutorials or books? And since I can't and don't want to use Visual Studio on Windows are there any good Ubuntu IDE's.

BTW. I am very thankful to the ones who have replied. 

[alex_h]

I'm using Web Storm by Jet Brains for coding in javascript and I highly recommend it. I've not used TS myself but Web Storm supports it, and can also come in a Linux version.

Only costs about $50 for an individual license. It has a great feature set:

 

https://www.jetbrains.com/webstorm/features/index.html

 

[EDIT] - oh yeah, just remembered that you are a 14 year old student! Well they offer an academic price of $29 for students, which might be more affordable.

[fsquier]

I'm using Web Storm by Jet Brains for coding in javascript and I highly recommend it. I've not used TS myself but Web Storm supports it, and can also come in a Linux version.

Only costs about $50 for an individual license. It has a great feature set:

 

https://www.jetbrains.com/webstorm/features/index.html

 

[EDIT] - oh yeah, just remembered that you are a 14 year old student! Well they offer an academic price of $29 for students, which might be more affordable.

 

 

It's actually 55 euros (inc. VAT) = 75 USD in Estonia and academic is only^? for university students. Even 75 dollars isn't that expensive but I doesn't seem to justify its price since there are good free alternatives like NetBeans and in future if I buy PyCharm I can basically the WebStorm's functionality, but thank you for suggestion.

 

But since lack of documentation and good/beginner friendly tutorials I decided to make this project in JS and learn TS afterwards. If I do the CodeAcademy's tutorial on JS and read 

Core HTML5 Canvas, I can get my hands on Turbulenz?

[Quetzacotl]

Why you won't use Phaser, which is using plain JS?

[fsquier]

What do you mean by using plain JS? In Turbulenz I can code in JS or TS (both of them are officially supported).

Phaser and other similar engines seem too ... I don't know light, limited but Turbulenz is basically HTML5 Unity and is made by a group of professionals while other engines are often made/maintained by one person.

 

For example Polycraft - http://polycraftgame.com/  is made in Turbulenz engine.

[YellowAfterlife]

Also I'd like to note that HaXe isn't a good choice to make html5 games. Flash games - yes; Html5 games - no.

Oh stop it, you.

[fsquier]

Well, since the lack of beginner friendly documentation for Turbulenz, I have decided to use Construct 2 for prototyping and I think Quintus, Phaser or ImpactJS for actually developing a game and "port" game to Turbulenz later. Out of all these three: Quintus, Phaser and ImpactJS, which would be suitable for me? Quintus seems easy and lightweight but what about the sound, physics and collision detection? ImpactJS has good documentation and nice level editor but it costs about 70 euros (I can afford that but for 70 euros I could get a graphics tablet which would be good for making game art). Phaser seems also nice and is with a decent amount of documentation.

TY in advance!

___________

 

BTW I basically want to make a roguelike platformer with moving platforms that would make people cry...  but with unique and mixed graphics style, so the engine must support layers. Making this in Construct 2 would be easy, but I wouldn't learn as much.

[Quetzacotl]

one of roguelike characteristic is permadeath, this in connection with platformer is hardcore 

[fsquier]

Yeah . Well, I actually try to make "x levels behind" saving system. For example - you die at level 6 and respawn at level 4, you managa to get to level 7 then die and respawn at level 5.

On the other hand, hardcore edition with no saves would be rather epic.

 

[EDIT]

Phaser is starting to look better and better - syntax seems nice but lack of actual documentation might be a problem altough Davey's "Tutorial: Making your first Phaser game" is really nice and I am looking forward to part 2. Also Phaser has a community support right here.

So would Phaser be the best choice?

 

[fsquier]

Okay, so one month from last post - I've made some research and found out that every library/engine has it's own problems, but I think that Phaser or Pixi would be the best choice. I have also purchased Construct 2, which is my tool for prototyping or plan B when writing a code doesn't work out. 

Anyway, I need 5 things from an engine:

*Easy syntax (Phaser and Pixi have, Turbulenz doesn't)

*Documentation (Turbulenz basically has, Phaser, with examples basically has, Pixi doesn't)

*Convincing examples/projects (Turbulenz has, Pixi has but Phaser kind of does not have - it's used by Photon Storm's projects but their games are mostly games made for kids)

*WebGL for perfomance

*Support for filters, effects... (Pixi has, Phaser probably has and don't know about Turbulenz)

 

So I can't decide between Phaser and Pixi

Phaser pros/cons

+

*Has enough documentation

*Easy syntax

*Has more support

-

*After doing the platforming tutorial, it felt somewhat glitcy. I really don't know why but probably because of my lack of skills.

*Older than Pixi, since Phaser is built on Pixi so it doesn't receive updates so fast, and as I understand Pixi is for making multimedia, Phaser is 'Pixi strictly for making games'. 

 

To me Phaser feels like simplified Pixi, because games made in Pixi have better graphics and so on - I know, I am probably wrong.

On the other hand Pixi has no examples and lacks tutorials.

 

I guess, I need somebody to confirm me that I can make games in Phaser that are as good as Pixi games, quality wise and tel me what is the difference between Phaser and Pixi.