Jump to content

  • Log In with Google      Sign In   
  • Create Account

Interested in a FREE copy of HTML5 game maker Construct 2?

We'll be giving away three Personal Edition licences in next Tuesday's GDNet Direct email newsletter!

Sign up from the right-hand sidebar on our homepage and read Tuesday's newsletter for details!


We're also offering banner ads on our site from just $5! 1. Details HERE. 2. GDNet+ Subscriptions HERE. 3. Ad upload HERE.


C++ Developer moving to Web


Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.

  • You cannot reply to this topic
16 replies to this topic

#1 Riztro   Members   -  Reputation: 240

Like
2Likes
Like

Posted 12 July 2013 - 02:03 PM

Hi all,

 

I am looking for a bit of advice and possibly some guidance. I programmed in C++ for a good three years. I also used SFML and OpenGL for 1 of the 3 years.  I haven't programmed in it in about 6 months though because I have been so concentrated on trying to learn some web programming. Now what I did was I went on Code Academy, finished the Web fundamentals, Jquery, and Javascript courses. 

 

I am at a point where I feel I have a grasp on how to program for the web, but no clue really how develop for the web. I can open a text editor, include the needed documents, and a bow grow when clicked, but where do I learn how to make an actual good looking website? Code Academy taught me how to do some neat things with my code, but never how to make a nice, full fledged website.

 

So I am at the point where I want to try making a small 3D sandbox game and a nice website to encase it. I know this will require WebGL, server side programming, maybe a few helper libraries, and website designing knowledge. I was wondering if someone could point me in the right direction of where to learn those skills. 

 

TL;DR?

 

My Goal: 3D Web Sandbox Game

 

I have learned thoroughly:

C++

OpenGL

SFML

 

I have sort of learned:

HTML

CSS

Javascript

Jquery

 

I want to learn:

Node.js or PHP? (Some server side language)

General Web design (I kinda know CSS but that doesn't mean I know how to make stuff look nice)

WebGL

Three.js? (I have heard of this, not sure if I should learn it or WebGL, or both)

 

Any advice, links to great tutorials, or guidance on completing my goals would be greatly appreciated.

 

Thanks in advance! smile.png


Edited by Riztro, 12 July 2013 - 02:05 PM.


Sponsor:

#2 LJ_1102   Members   -  Reputation: 979

Like
1Likes
Like

Posted 13 July 2013 - 07:26 AM

The server side language depends on what you want todo,

if you want it to communicate with your game(f.e. using websockets) you should go into node.js

also because you do not have to learn another language then since node.js is javascript.

 

Also creating a game using plain WebGL will propably take you ages since you have to write a lot of boilerplate code.

 

imho using three.js is also not a good idea, since everything more complex i've seen that was made with it was pretty slow.

I would recommend taking a look at other frameworks out there, google will help you find them.

 

In addition to that I highly recommend that you read JavaScript: The Good Parts and use a jslinter to achieve some proper javascript skills,

I dont know the quality of code academy but there are huge differences in the opinions about what is good javascript.

 

Giving a pointer to general web design is not that easy, its actually an intuition thing i guess.

Take a look at Twitter Bootstrap and see how they're structuring their code and how their design elements look like.

 

Hope that helps. 


Jan F. Scheurer - CEO @ Xe-Development

Sign Up for Xe-EngineBeta

 


#3 Matt-D   Crossbones+   -  Reputation: 1467

Like
1Likes
Like

Posted 13 July 2013 - 07:56 AM

Since you already know C++, perhaps you can also consider playing with Wt: http://www.webtoolkit.eu/wt

// and/or CppCMS: http://cppcms.com/

 

Wt has WebGL support:

http://www.webtoolkit.eu/wt/doc/reference/html/classWt_1_1WGLWidget.html

 

Here's a tutorial on using Wt with WebGL:

http://demos.vicomtech.org/x3dom/test/functional/Wt_WebGL/Wt-WebGL_Lessons.htm

 

You may also find the following thread helpful:

http://comments.gmane.org/gmane.comp.web.witty.general/8883


Edited by Matt-D, 13 July 2013 - 08:05 AM.


#4 Serapth   Crossbones+   -  Reputation: 5580

Like
2Likes
Like

Posted 13 July 2013 - 09:12 AM

PHP is the devil, its a crap language that succeeded because it was at the right place at the right time with the right price tag.  Now there is a huge volume of code available for it, but that is about the only positive.

 

Node is the current buzz-word darling, but truth is, I am a huge fan of it.  There are some huge benefits of having JavaScript on the server as well as the client.  I actually did a tutorial series you might be interested in.  It covers creating A simple JavaScript app using Node, cocos2D, YUI and Heroku.  On top of that, I've done a series of math tutorials in EaselJS as well as a Cocos2D tutorial series.  Apparently the Cocos2D api has changed again though, resulting in a few things not working.  Cocos2D is one of those love or hate it style libraries.

 

 

The earlier recommendation of "The Good parts" is solid, but that book is mostly useless to you until you've used the language for a little while.

 

Picking up a good editor is also a big help.  I highly recommend you try the 30 day trial of WebStorm, it's excellent and makes working in JavaScript a delight, especially if you are used to working in an IDE.

 

 

There are a few things you are going to have to get used to with JavaScript programming.  First is the fact DOM programming is a horrible experience.  It really is, working across browsers is just miserable, there is a reason people use jQuery or YUI and similar libraries.

 

Second, learn to think asyncronously... that is the biggest stumbling block with C++ programmers moving to JavaScript.

 

Third, JavaScript is not C++...  it feels a hell of a lot like C++ at first, but it isn't and the faster you can come to terms with that, the happier you will be.  Probably the worst part of it is the fact you can basically turn JavaScript into C++... DONT.  JavaScript is a prototype based language and a dynamic ( not compiled ) language.  There is a lot of power in those two traits.

 

Fourth, JavaScript is a horrible language.  It's the kernel of an excellent language with some really really really really stupid design decisions.  The book ( The Good Parts ) covers a lot of the warts and strengths of JavaScript.  The biggest flaw with JS is it's wayyyyyyyyyyyyyy to easy to create a global variable or clobber an existing variable...  there is no concept of namespaces, modules or private variables and it hurts the language.  ( There are work arounds and changes to the language in the works ).  There are languages built over JavaScript that make working with it much more pleasant, such as TypeScript, Dart and Coffeescript, but when starting out, I suggest sticking to straight JavaScript.

 

 

Fifth, embrace Microframeworks, its a common trend with JavaScript and its a very cool one.  Instead of large overarching libraries that do everything and the kitchen sink, you slot in a small focused library, that work with other libraries.  There are a few that you simply need to know though...  jQuery is all but ubiquitous now, although I actually prefer YUI.  On top, check out Underscore ( a library that extends the language of sorts ) and Require.js ( a module system... that is all but *groan* required ).  I also highly recommend the previously mentioned EaselJS.

 

 

 

 

 

Finally, have fun.  The browser is infuriating to work in, but JavaScript is a ton of fun and remarkably powerful in certain regards.



#5 LJ_1102   Members   -  Reputation: 979

Like
1Likes
Like

Posted 13 July 2013 - 10:42 AM


Third, JavaScript is not C++...  it feels a hell of a lot like C++ at first, but it isn't and the faster you can come to terms with that, the happier you will be.  Probably the worst part of it is the fact you can basically turn JavaScript into C++... DONT.  JavaScript is a prototype based language and a dynamic ( not compiled ) language.  There is a lot of power in those two traits.

 

Couldn't have put it better! Word up for that one!


Edited by LJ_1102, 13 July 2013 - 11:53 AM.

Jan F. Scheurer - CEO @ Xe-Development

Sign Up for Xe-EngineBeta

 


#6 Karsten_   Members   -  Reputation: 1634

Like
2Likes
Like

Posted 13 July 2013 - 10:56 AM

If you already know C++ then you might want to bypass learning a web language and use something like Emscripen (https://github.com/kripken/emscripten‎).

It is basically a C++ to Javascript compiler. It works quite differently to things like coffeescript and typescript but the outcome is even better. You put in typical C++ code including smart pointers, STL etc... and it generates either a .js file or a .html file complete with a console, webgl rendering context or canvas component as output. Can't get simpler than that ;)

 

Quite a few companies are using this now, it is also getting popular in porting well known game engines to the web such as Epic's Unreal engine and Unity's web player engine.

I use it at work and for my personal projects and it is pretty awesome since it provides development libraries for things like SDL, glut, GL out of the box.


Edited by Karsten_, 13 July 2013 - 11:03 AM.

Mutiny - Open-source C++ Unity re-implementation.
Defile of Eden 2 - FreeBSD and OpenBSD binaries of our latest game.


#7 Riztro   Members   -  Reputation: 240

Like
0Likes
Like

Posted 13 July 2013 - 06:17 PM

Thank you very much for all of your replies! I have mixed feelings in the posts here. Most people here seem to think JavaScript is useful, but also full of traps that will land you in a pile of crap! :D. Some others also seem to push towards using C++ for Web, which actually sounds very appealing because I LOVE C++. So now I am at a point where I think I should learn java script for Node.js and web pages. Then use C++ and Wt or Emscripen for the game. 

 

Some questions:

  1. Does the above sound reasonable?
  2. Should I use Emscripen or Wt for web pages? Or will regular java script work better for small interactive things on the web page?
  3. Does Emscripen or Wt easily support external JS libraries?

 

BTW I have found this to expand my website design knowledge. Does it look like it will be useful?

 

Thanks again! All your words and advice are very helpful :)



#8 Karsten_   Members   -  Reputation: 1634

Like
1Likes
Like

Posted 13 July 2013 - 06:54 PM

It is my understanding that Wt is more for server side related code but am not sure how well it integrates with server side node.js.

 

Emscripten integrates with Javascript pretty well. Below are a few ways officially supported by the project. You might want to have a browse through and evaluate if this additional effort is worth it. (For my uses, it definately is! ;)

 

https://github.com/kripken/emscripten/wiki/Interacting-with-code

https://github.com/kripken/emscripten/wiki/embind

 

Though not supported by the Emscripten project, I made a small tool to allow me to inline Javascript within C++ code (in a similar way to how you can with ASM). This pretty much offers best of both worlds in that you can do the majority of your work in C++ but also get a 100% javascript environment to interact with libraries and APIs etc...

 

http://www.mutiny3d.org/doku.php?id=iffe


Mutiny - Open-source C++ Unity re-implementation.
Defile of Eden 2 - FreeBSD and OpenBSD binaries of our latest game.


#9 Serapth   Crossbones+   -  Reputation: 5580

Like
2Likes
Like

Posted 13 July 2013 - 09:44 PM

Simply put, people using C++ on the web, are doing so because they are unwilling to learn another language.  

 

 

... this is not recommended.



#10 Riztro   Members   -  Reputation: 240

Like
0Likes
Like

Posted 13 July 2013 - 11:51 PM

Simply put, people using C++ on the web, are doing so because they are unwilling to learn another language.  

 

 

... this is not recommended.

Okay so then I guess I will just continue learning java script. I am willing to learn another language. I guess now I just have to weed out the bad of java script with the help of the resources suggested above and then learn the Micro-frameworks. Any recommendations on micro frameworks that I can use to help me make games (mostly in the graphics section of things but sound would be good too)?


Edited by Riztro, 14 July 2013 - 12:13 AM.


#11 Karsten_   Members   -  Reputation: 1634

Like
1Likes
Like

Posted 14 July 2013 - 03:20 AM

Simply put, people using C++ on the web, are doing so because they are unwilling to learn another language.  

This is certainly true, it allows them to get productive quickly with whatever languages they already know.

 

For me, it is a portability issue. I know with C++ I can write my game once and know it can be compiled on every platform under the sun with minimal rewrite of the core boilerplate (boring) bits. I cant seem to find a single javascript platform that works on more than one or two platforms (including 3D) whilst still offering me enough flexibility to also use native libraries when required.

 

Plus the javascript emitted by Emscripten has the LLVM optimizations as a bonus so runs much faster than what I could manually write.


Edited by Karsten_, 14 July 2013 - 03:37 AM.

Mutiny - Open-source C++ Unity re-implementation.
Defile of Eden 2 - FreeBSD and OpenBSD binaries of our latest game.


#12 Matt-D   Crossbones+   -  Reputation: 1467

Like
1Likes
Like

Posted 14 July 2013 - 09:11 AM

Yeah, JavaScript (or its subset, asm.js) is just another target, what's the big deal *shrugs* ;-)

 

There's a reason subsets like asm.js are created to make the Web a viable target:

http://mozakai.blogspot.com/2013/06/what-asmjs-is-and-what-asmjs-isnt.html

http://en.wikipedia.org/wiki/Asm.js

 

Wt has tight integration with several modules, like JSON, or WebGL: http://www.webtoolkit.eu/wt/doc/reference/html/namespaceWt.html

If you have some prior experience with Qt and OpenGL, you should find a familiar ground with Wt and WebGL.

 

OP: as for Emscripten, see these two links, should explain most:

http://isocpp.org/blog/2013/03/cpp-to-javascript

http://isocpp.org/blog/2013/04/cpp-on-the-web-run-your-big-3d-game-in-the-browser

// the last one links to this: http://slideshare.net/andreweissflog3/quovadis2013-cpp-ontheweb


Edited by Matt-D, 14 July 2013 - 09:19 AM.


#13 Riztro   Members   -  Reputation: 240

Like
0Likes
Like

Posted 14 July 2013 - 01:06 PM

Okay so I think I am getting two recommendations here, unless I am reading this all wrong... :D. From what I can tell Serapth I think is pushing towards straight JS while Matt and Karsten are pushing me towards C++ JS. I really don't see why I can't use both. I mean learning JS will be great for me because I will understand the outputted code of emscripten and for managing input on my website. Emscripten would be great for optimized code that is used to make a game. So what do you guys think, should I just learn both and use both where they fit best? :) 

 

I mean Karsten does have a point Serapth. Emscripten doesn't look like its only meant for lazy people who don't want to learn a new language. It also provides optimizations that would be time consuming to manually write. So if I could get more speed from it, why not use it for games? :)

 

And if I have C++ code, it would be a lot easier to make a desktop version or a mobile version of the game.

 

Thanks again for the replies :)



#14 Matt-D   Crossbones+   -  Reputation: 1467

Like
1Likes
Like

Posted 14 July 2013 - 01:21 PM

I really don't see why I can't use both. I mean learning JS will be great for me because I will understand the outputted code of emscripten and for managing input on my website. Emscripten would be great for optimized code that is used to make a game. So what do you guys think, should I just learn both and use both where they fit best? smile.png

 

Yup, that would actually be my recommendation! :-)

 

// Well, except that I wouldn't expect to gain much from looking at the output codegen, since it relies on asm.js and mostly looks like this:

asmjs1.png


Edited by Matt-D, 14 July 2013 - 01:24 PM.


#15 Riztro   Members   -  Reputation: 240

Like
0Likes
Like

Posted 14 July 2013 - 01:37 PM

 

I really don't see why I can't use both. I mean learning JS will be great for me because I will understand the outputted code of emscripten and for managing input on my website. Emscripten would be great for optimized code that is used to make a game. So what do you guys think, should I just learn both and use both where they fit best? smile.png

 

Yup, that would actually be my recommendation! :-)

 

// Well, except that I wouldn't expect to gain much from looking at the output codegen, since it relies on asm.js and mostly looks like this:

asmjs1.png

 

Ahh I can read that just fine! ;). Now I am hoping I can make a nice website with the help of the CSS, Jquery, and HTML skills taught here and here and a fun little sandbox game with Escripten and some micro frameworks using inline JS!



#16 Serapth   Crossbones+   -  Reputation: 5580

Like
1Likes
Like

Posted 14 July 2013 - 03:40 PM

If course these tools all have their purposes or they wouldnt exist.

That said, you are just starting out and want to learn web technology. In that case, recommending a C++ cross compiler is just bad advice.

Had you said "i have C++ code I want to port to the web" I would have a different suggestion.

#17 LJ_1102   Members   -  Reputation: 979

Like
0Likes
Like

Posted 15 July 2013 - 10:53 AM


I cant seem to find a single javascript platform that works on more than one or two platforms (including 3D) whilst still offering me enough flexibility to also use native libraries when required.

 

There are plenty of shells out there f.e. node-webkit that runs on windows, osx and linux, you can also easly plugin NaCl modules or NPAPI stuff in there to use your native code.


Jan F. Scheurer - CEO @ Xe-Development

Sign Up for Xe-EngineBeta

 





Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.



PARTNERS