How to get started with jQuery Mobile? (Programmers background) [closed] - javascript

Closed. This question is off-topic. It is not currently accepting answers.
Want to improve this question? Update the question so it's on-topic for Stack Overflow.
Closed 10 years ago.
Improve this question
I have a background in C++/C# and Java (Android). Now, I want to pick up what seems to me the best solution for mobile web applications: jQuery Mobile.
I know some of the very basics of HTML/DOM/CSS, but not in a structured/thorough manner.
Javascript-wise, it seems to be a rather different programming approach than I'm used to.
Where do you recommend I start? Javascript (and possibly Ajax) or jQuery or could I afford by immediately starting with jQuery mobile?
Plus, could you recommend me some good learning/example sources as well?
Thank you in advance.
-Thomas

jQuery mobile is a plugin written using jQuery in order to Enhance html5 elements appearance and behaviour to match iPhone design pattern for application behaviour (Progressive enhancement).
Whilst it is fairly easy to get started filling the templates jQMobile provides as a C# developer you need to understand that working with JavaScript and jQuery has some significant differences.
jQuery was a community necessity and is basically nothing but an abstraction layer on top of JavaScript to rectify the difficulties programmers were facing which mainly had to do with the difference of JavaScript implementation in different browsers and also the weakness in the DOM which is an API which allows JavaScript to access elements inside the document.
What jQ basically does is it takes care of those differences for you and exposes methods to you that are pretty much guaranteed to deliver the same results across supported browsers.
This will greatly help you get started by still wont allow you to learn the fundamental differences between the world you are coming from and the world you are getting into.
JS does not have classes only functions. However functions can have methods and be instantiated. The inheritance in js is Prototypal Inheritance.
new f()
produces a new object that inherits from
f.prototype
more info here
To learn the basics and understand more about this language before you use it! please watch this also

Related

Node.js drawing on screen [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 5 years ago.
Improve this question
I've been looking all over the internet for this. I'd like to know if there is any Node.js packages/bindigs/libraries that allow you to make an application that draws on the screen without node-webkit(NW.js)/Electron or other implementations based on browsers. Maybe something that binds to opengl with support for 2D graphics?
Let me know if you know some names or links. If not I might have to write something myself.
Thank you guys.
There is an experimental project : https://github.com/creationix/node-sdl
This basically provides bindings to the SDL library:
Simple DirectMedia Layer is a cross-platform development library
designed to provide low level access to audio, keyboard, mouse,
joystick, and graphics hardware via OpenGL and Direct3D.
If you can get it compiled, you can try the example scripts in nodejs.
node-opencv or OpenCV in general should allow you this. At least it has a HighGUI class, which gives you native window contexts to display image data. With a lot of hacking you can build something you require. But I would suggest using browser contexts and HTMLCanvas anyhow. It gives you all you need out of the box. You just need to set it up properly.
Edit:
As per #Zorgatone's suggestion, GTK could be a very good library for that purpose, though node bindings are very stale.
There are projects that brings
QT bindings to node.js - https://github.com/arturadib/node-qt
GTK bindings - https://github.com/Tim-Smart/node-gtk
WxWidgets bindings - https://github.com/joeferner/wxNode
but unfortunately the last commits seem to be for old node.js versions.
It will be substantial work to make the bindings work with a recent version of node but those a interesting starting points.
V8-GL intends to provide bindings for creating 2D-3D graphics on the desktop with javascript.The Status is not completed yet, but maybe it is enough for what you are trying to do https://github.com/philogb/V8-GL
Another thing i just found out is, that it actually uses immediate mode, which is deprecated but still works.

What is Modernizr, Normalize and HTML5Boilerplate [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 9 years ago.
Improve this question
when i download a free theme or a demo tutorial in the web. I just noticed that now a days i always see those modernizr, normalise, and boilerplate thingy.
I have researched them but still i cant understand what they do? Maybe you guys can explain more or maybe use an analogy to explain it better.
It's like "Explaining New Web Development thingy for Dummies" Really appreciate it.
Due to the differences in browsers and platforms, these libraries try to make is so that you don't have to use browser-specific code to take advantage of all the new HTML5 features.
Another way of saying it is, since all browsers "interpret" the HTML5 standard differently, these libraries help to smooth out the differences between interpretations.
Modernizr: http://modernizr.com/
Taking advantage of cool new web technologies is great fun, until you have to support browsers that lag behind. Modernizr makes it easy for you to write conditional JavaScript and CSS to handle each situation, whether a browser supports a feature or not. It’s perfect for doing progressive enhancement easily.
Boilerplate: http://html5boilerplate.com/ (If this is the one you are referring to)
HTML5 Boilerplate helps you build fast, robust, and adaptable web apps or sites. Kick-start your project with the combined knowledge and effort of 100s of developers, all in one little package.
Basically this gives you a framework for laying out your webpages so you don't have to start from scratch every time.
Normalize.css: http://necolas.github.io/normalize.css/ (Again, assuming this is the one you're talking about)
Normalize.css makes browsers render all elements more consistently and in line with modern standards. It precisely targets only the styles that need normalizing.
Basically, this CSS file allows you to write standard CSS and then it helps to render it consistently in all browsers.
TL;DR Version
These frameworks/files make it so that you can focus on writing standard-compliant website code (HTML5, CSS or JS) without having to worry about browser-specific tweaks. In addition, a front-end framework like Boilerplate gives you some nice "style-helpers" to make your website look great from the start.

Why is AngularJS called a poor fit for GUI editor apps? [closed]

Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 9 years ago.
Improve this question
While evaluating AngularJS for a project, I noticed the following paragraph in its documentation:
Games, and GUI editors are examples of very intensive and tricky DOM
manipulation. These kinds of apps are different from CRUD apps, and as
a result are not a good fit for Angular. In these cases using
something closer to bare metal such as jQuery may be a better fit.
But the docs continue without really explaining why this is so. In order to make an informed decision about what technology we use for our project, I'd like to better understand where this statement comes from and what facts are behind it.
What specific problems would hamper someone trying to build eg an illustration tool, or a video editing suite, in AngularJS?
This is a good question. Angular provides great declarative facilities for your run-of-the-mill web page work. To do this it relies on a watchers and constantly checks for changes on watched properties, then updates the UI with changes. The FAQ claims this process is "snappy" with hundreds or thousands of bindings which is good enough for most uses. Games and GUI editors can have complex interfaces with frequent or constant user interaction, so constantly re-evaluating a huge collection of watchers may not be the most performance-conscious way of doing things. Contrast this to a site like Stack Overflow where a user only clicks/presses something every few seconds and cause a re-eval of the watch list. Using a more imperative approach and library(jQuery et al) would cause less overhead.
Angular has a few limits that come into play here.
First, ng-view doesn't support nested views. So that limits more complex UI design.
Next a "GUI Editor" is usually built around the concept of widgets and dialogs. Angular is built around very different concepts. You can simulate widgets with directives somewhat. But it will feel like you're fighting Angular the whole time.
Basically nested scopes, isolate scopes, and declarative data binding aren't common paradigms for complex GUI work.

Does Google use GWT for their projects? If not what do they use? [closed]

Closed. This question is off-topic. It is not currently accepting answers.
Want to improve this question? Update the question so it's on-topic for Stack Overflow.
Closed 11 years ago.
Improve this question
I know this has been asked before but I'd like to ask it here and see what happens.
What do Google's developers use to implement their sites like http://translate.google.com/ for instance. When I look at the source of the page, I'm not immediately seeing anything GWT.
I've been working on a few GWT projects and my experiences with it have been mixed. The advantages are obvious, and I've created dynamic scheme making client-server communication even more transparent. But the downsides have been nagging PITA pretty much. Erroneous hard to find anomalies. Slow building process (I'm familiar with the optimizations and tuning to improve development cycles). Layout hell (css). Plus problems developing for mobiles. No devmode, need various tricks to let me debug and probe inner state. Problems with specific mobiles (eg. Acer A500 disappearing keyboard problem). Mobiles not scaling UI properly. The list of issues goes on and on.
I have the feeling that Google is perfectly well aware of the pitfalls of GWT and use something much better internally for their own apps. Does anyone know how they develop their sites?
The admin pages for Adwords is as far as I know done with GWT, as was wave.
For some projects they have used the Closure library
Gmail is one of these I think.

Are there any GUI toolkits built on top of HTML Canvas like swing,swt,gtk or qt? [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Questions asking us to recommend or find a tool, library or favorite off-site resource are off-topic for Stack Overflow as they tend to attract opinionated answers and spam. Instead, describe the problem and what has been done so far to solve it.
Closed 9 years ago.
Improve this question
Are there any GUI toolkits built on top of HTML Canvas like swing,swt,gtk or qt? So that it is possible to build applications like applets or flex gui:s inside the html canvas.
Mozilla Labs' Bespin project currently uses their own toolkit called Thunderhead. It's written by and for the Bespin developers, but it's a separate project that could be used for anything. You will need a (free) Bespin account to try it, since there aren't any other projects that I know of that use it.
I've never used it, but I know it uses the DOM and a subset of CSS plus it's own CSS-like properties. I doubt the API is very stable though since it's experimental and evolves with the needs of the Bespin developers.
EasleJS is a great framework!
http://www.createjs.com/#!/EaselJS
Raphael looks really interesting too.
Take a look at Ample SDK JavaScript UI Framework. One of the UI technologies it enables cross-browser is XUL, styleable in CSS and programmable in JavaScript with XUL DOM or jQuery APIs. You can also create your own UI technology on top of the framework.
kineticjs is a good one, uses layers dragndrop collisiondetection events sprites etc
KineticJS and Three.js are both good ones. I am using KineticJS now and it makes life much easier especially for sprites/animations or general stuff you might use in games.
It seems, Cappuccino is what you want. But the speed isn't so impressive, not yet anyways.
http://cappuccino.org/learn/tutorials/
Take a look at the demos. I really hope the project will find the support it deserves.
Getting a firm overview of the best frameworks out there took me over a month. I will write a summary shortly.
Canvas is NOT SVG. Read this link
Be aware that is noy fully supported by all browsers

Categories