We Keep Coding

What are the risks of described approach to developing web application?

We want to write a UI that consists of HTML, Javascript (JQuery) and CSS. Although the initial starting point will be served up by a web server, there won't be any sever side templating. The browser will interact with the server via a restful interface and render its UI.
What are the risks of this approach?
Ideally I'd like a nice, straightforward javascript OO api which underneath makes http calls to the server to get JSON representations of resources. Any suggestions as to how this could be structured?
Anyone have experience with browser side templating?
Is there a framework to make this style of development easier?
We will also be defining the server side resources and my thoughts are to follow ruby on rails conventions. For example, if you define a Users resource in routes.rb, you have 7 uri templates. Any thoughts?
By the way, the server side functionality will be developed in java.

I have plenty of experience with this approach. I can guarantee you that it works - how well in the long run, I don't know yet but I'm extremely happy with it (as a developer).
You do need to make sure that you've mastered Javascript. Read up on the state of the art, at least check Douglas Crockford's work, and most notably JSLint.
As for frameworks, this is where your vision comes in. We've built one from scratch because we need a combination of tools that existing frameworks don't and because we think we have the vision and expertise to carry it through. You have to compare the pro's and con's. If you use an existing framework you have very little control over it's direction or the speed at which bugs are found and fixed. If you build one yourself you could run the risk of making wrong decisions and ending up with a framework that doesn't quite work.
I have noticed that in our applications the custom server side code is only very small. This means the importance of the backend is only very small (validation, sanity, authorization). We use PHP, but simply because we have loads of experience with PHP.
There are definitely risks. In the startup and early transition I have noticed that 'lesser' programmers have trouble catching up. There is a very steep learning curve for anyone not too familiar with Javascript and it's many elegances.
Another risk is performance. We're advising our customers to use Google Chrome, simply because
And then there is compatibility. The idea of a framework is that it's able to hide this complexity. Luckily browsers are increasing in-tune in accordance to standards but backwards compatibility with (for instance) IE6 is incredibly difficult.
I would advise against using jQuery. I find jQuery more of a 'plugin' than an actual framework. jQuery really shines when you have a website and you want to sprinkle on some fanciness. It has some very good general tools (DOM manipulation and all that) but it's very lacking in the business-modeling area.
I would also advise against an OO approach. For some very small number of domains OO is the perfect solution. For most businesses, it's not. And Javascript is capable of so much more than just OO.

The #1 problem (and, perhaps, the only problem) is search engine. It is not sure how well will your content be recognized/crawalble/searchable. The underyling cause is that the search engine is not necessarily going to understand your content (since it is only revealed once Javascript gets executed).
Other than that, it is a great approach. I tried it several times and it works great (assuming you're not intimidated by Javascript). The resulting web-site is usually much more responsive than traditional web-sites since the server -> client traffic is quite small - only the raw data is transmitted. All the UI stuff is generated, by Javascript, on the client side.

Wicket vs Vaadin

I am torn between Wicket and Vaadin. I am starting a micro-isv and need to make a choice of web framework. I have narrowed down my choices to Wicket and Vaadin. I have used both frameworks and I love them both. however I need to make a choice.
If If I choose Vaadin:
I wont have to worry much about the look and feel. It comes with nice themes.
I will do all my programming in Java which am very good at and wont have to spend time hacking CSS which am not very good at.
And most of the components that I will need for a business applications are there OUT OF THE BOX including, desktop like layout, tooltips, Keyboard shortcuts, tables with draggable and collapsible columns to name a few.
However, if I go the Vaadin way:
I will loose the ability to create UI declaratively.
I wont have the fallback feature if the browser doesn't support JavaScript - e.g most non Webkit mobile browsers.
Vaadin company is selling some components - e.g the JPAContainer so am not sure the company will be committed to offering full open-source framework. Business interests will always come first.
Vaadin applications will be mostly for the intranet. They are not very suitable for the internet with a web look and feel.
If I go the Wicket way:
I will have to style my applications and I can hardly give them a desktop look and feel.
Any advice? Anyone with experience on either framework kindly tell me the cons and pros and how you made your decision.

I think I've invested some time for both frameworks. I really like both because they bring the Swing-alike coding to web development. And I don't know easier ones for me (although there is click but I don't like the velocity templating thing)
And yes, there are differences.
I wont have to worry much about the look and feel.It comes with nice themes
true, but every serious company will style its app differently (unless you are prototyping)
I will do all my programming in java which am very good at and wont have to spend time hacking css which am not very good at
Then Vaadin would be 'better'.
i will loose the ability to create UI declaratively.
What are the advantages of that? (BTW: you could code declarative in groovy ;-))
But ok. I know what you mean: if you can afford a few separate designers then wicket is 'better'.
i can hardly give them a desktop look and feel.
Why not? Or what do you mean here? Wicket supports ajax and there are components which supports nice 'desktop-alike' things (ajaxlink, lazycomponent, autocompletion, progressbar, see wicket stuff + extensions). ok, for any more complex component you'll have to code in javascript BUT BTW did you know that you could even use GWT within wicket
Some minor experiences:
Vaadin is surely faster while coding (no css, html stuff). But if you go production keep in mind that the ease of programming can come to the cost of performance on the client side: e.g. if you use the 'wrong' layouts such as Horizontal/VerticalLayout, ... the massive use of javascript could slow down old browser.
But Vaadin is not slow! Use appropriate layouts such as CssLayout or FastLayout and also old browser can serve it. (Although if you would use CssLayout your coding-style is really wicket-alike.)
One issue with Vaadin is that it is a bit harder to profile, because you don't see easily where the client needs all the CPU and the nested divs gets cryptic id-names.
One great thing about Wicket is its warp persist integration
(Guice can be integrated in Vaadin and Wicket)
Testing the UI should be easy with Vaadin (although I didn't found unit testing stuff) and is very easy with wicket.
Last but not least creating lists/tables is VERY easy in Vaadin compared to wicket.

I've worked extensively with Wicket but I've not had any experience with Vaadin so this might be (a little) biased.
I'd recommend Wicket for obvious reasons, but what's probably of interest to you is Wickets openness. As Gweebz rightly pointed out, Wicket uses basic HTML markup as its foundation, so any structural or cosmetic changes are often trivial to implement.
Personally one of the things I really enjoy about out wicket work is the flow between front end presentation and the data backend, we've implemented Spring & JPA/Hibernate which means that any changes in the front end can be translated back into the data base with a single line of code thanks to Wickets model based architecture.
Again I can't say much for Vaadin having never worked with it, but if you're looking for architectures to start off with, I'd also recommend you have a look at GWT.

(continued from the comment in the first Wicket-related answer)
The major difference between Vaadin and Wicket is with how UI composition and client side code is written. With Vaadin you usually compose your UI without any templates or HTML at all and you get a sleek, fully Ajax'ed UI out of the box. However, if you prefer the templating approach just use CustomLayout which does exactly that.
Client side coding is rarely needed, but when it is you do it with the Java-based GWT which is IMO a lot more nicer than writing Javascript by hand. Besides, with GWT you automatically get cross-browser compliant solution instead of having to deal with those issues yourself.
When comparing frameworks you also should take a look at community activity and documentation. With Vaadin both of those are excellent. Also note the Vaadin Directory which currently contains 100+ very useful UI components and other addons.

I have a limited amount of experience with each but I prefer Vaadin. It allowed a richer experience with the web application I was developing. The main benefit that sold us though was how easy it was to write unit tests around our UI classes, ensuring the components functioned correctly when interacted with in the expected ways. This is also possible with Wicket however it was more difficult in my experience.
I will also mention that either framework will require some styling. Wicket starts off as plain old HTML and Vaadin starts off with a MacOSX-like theme by default but almost any web-app you write will require at least SOME customization. With this in mind, customizing the CSS of a Wicket app is SIGNIFICANTLY easier than Vaadin for the simple reason that you control the markup. Vaadin hides the markup from you and generates elements with weird IDs and structures so it is harder to customize the look. Just remember this when making your decision.

I am currently working with Wicket and I have worked in the pass with Vaadin. I wil be short in my observations:
Vaadin is entitled to be free but IMO, is not so beautiful like that. If you need support, help, documentation for that painful and tricky problems that you encounter, then you are screwed because you do not have so good documentation/community when compared with Apache Wicket. Vaadin have guys to help you, but you have to pay for it.;
To program in wicket you need to be a strong programmer. Vaadin also requires good Java knowledge but you can easily do some spaghetti code if you want (just saying, not doing..);
Apache Wicket really separate the web technologies (Javascript, HTML, etc.) from the framework technology (Java). Vaadin also try to do it, but IMO is not so elegant and transparent on that.
Appart from that, we are talking about two different types of frameworks, two different approach, which have pros and cons that I advice you to search and compare and see what really fits your needs.
Edit: Oh, and about the look and feel, for instance you always have Wicket Bootstrap

Also do notice that even though Vaadin base framework is free, for some additional functionality you might need to buy extensions.
Ex - If you need to integrate a good charting solution such as Highcharts, you'd have to pay and buy the vaadin charts extension (even though highcharts is available free for FOSS apps, the vaadin charts plugin built on that is not given free for FOSS apps).

Thank you for your question.
The answer is short and simple
Vaadin is a great tool for java developers who needs to develop web apps, but it is a powerful WAR Machine if you have moderate javascript knowledge, and some basic css skils.
Vaadin is not slow, it is even faster than React and Angular.
If your app is slow, it's because you designed it wrong, and that's true to any framework you use.
Keep in mind this, Vaadin uses web components, so most of the UI is built on the client, no heavy rendering on the server
In your case you said you don't have css knowledge, two options:
Use Vaadin, or hire frontend developer.
I am a web developer for more than 10 years, and I have started as a php developer and a javascript developer.
I can tell you that once I've got into Vaadin, I can not develop another way.

What to choose depends primarily on the business requirements (see points 2 and 4 of your question)
However, if I go the Vaadin way:
I will loose the ability to create UI declaratively.
You can try using the ZK framework - similar to Vaadin with a declarative user interface in XML

Writing a web application gui. Which technology should I use?

I would like to write a somewhat complex web gui application.
It will be used to edit certain content by displaying panels and allowing the user to drag items to edit the content.
The explanation is somewhat abstract, but the point is that i'm looking for a modern gui writing technology, the more standard it is the better odds of me finding information and samples to using it.
I've been using JavaFaces to write some simple web pages and have taken a look at RichFaces for purposes of writing the app described above.
I would love to hear recommendation of similar technologies (For example - What was used to write this website?)
Thank you!!!
Update: Thanks for the answers so far, Since I was asked for more clarification I'll try to explain the use of the app:
It will be used to edit a complex script. There will be one panel with the actions of the scripts (The phases) and the other panel will show the content of the currently selected action. To each action type there will be a different set of attributes to modify.
You will be able to reorder actions by dragging them to a new location (Kinda like powerpoint slides organizer or flickr photo organizer) and also copy them that way.
The content of the action attribute panel will be able to display various types of content such as html text and buttons and all kinds of stuff.
Hope that helps. Thanks Again!
Update2: After reading this StackOverflow Thread I'm leaning towards RichFaces for it's vast support and standardization.

It seems you need a RIA. The Java worlds offers the following options:
Google Web Toolkit - a powerful RIA technology, which will require you to go through a steep learning curve. Nice component frameworks are SmartGWT, gwt-ext and ExtGWT. In my opinion all of them have some drawbacks, but in your case you might not observe them.
RichFaces - quite powerful as well, and since you have JSF experience, I'd recommend this.
ZK - never used it and I don't like some aspects of it (at least a while ago when I last checked it), but it's still an option.
Echo3 - similar to GWT in the way of development, but very different in the actual result. I'm not sure, however, whether it's still in development
JavaFX - if you are adventurous, and your application won't be used by the open public, try it.

ASP.NET MVC was used to write this site.
To your question: you should use the technology you like. If you've used to Java, you may wish to explore various MVC frameworks for that. Or you can try out new unfamiliar to you (yet) technologies.

Take a look to GWT and SmartGWT. Together are quite a powerful combination to write RIA webapps.

An interesting framework that I would be glad if I had the time to look deeper into is Cappuccino. Look at 280Slides for an example.

Flex is also nice open source option to create Rich Internet Applications. If you would like to stick to the JavaScript then you can use JQuery, YUI etc

There is also one very interesting thing called Vaadin check it http://demo.vaadin.com/sampler/

ICEfaces is one possibility. Demos here.

I used richfaces including drag and drop functionality, realy nice to offer good usability.

If you like the Java Web Technologies take a look at zk. It promises the same things as ICEFaces. I don't know if it can live up to that promises but IceFaces coul certainly not for me.
ZK should enable you to build your web app like a common swing app.

I'd suggest that you do not invest into technologies/frameworks which are based on integration of browser side ajax capabilities with server side frameworks if you'll need advanced functionality in the browser.
What is advanced and what is not is a completely different topic of course, but just to give you a heads up, as you start facing more and more complex UI requirements, you'll discover that the connectivity to back end framework (like JSF) will become more of a problem than a capability. Especially with things like JSF lifecycle, and most of the server side frameworks being based on the idea of an HTTP post (for client-server communication), you'll have issues.
An example: you'll be requested to develop a very specific UI widget that has drag and drop capability. If the Ajax-jsf integration framework of your choice does not contain this widget, your problem is born at this point. You'll start looking for ways of injecting data into existing channels, and it will get messy.
To avoid further speculation, let me just repeat that if you are sure that your chosen technology setup will give you 90%+ of the capabilities you'll need, that is ok. If you end up developing too much custom stuff, then consider an integration between a powerful client side (javascript or flex or silverlight) layer and a simpler server side layer (resteasy etc) Initial development may not be as fast as the other options, but if you'll need flexibility, this will end up being a much cleaner setup. I'd suggest you take a look at DOJO, and ExtGWT .
Cheers
Seref

It looks like XHTML + JavaScript could be enough for the dragging & dropping functionality you describe. This means you can use just about any web framework of your choice. If you need frequent asynchronous server calls (AJAX) then GWT is the most standard Java framework I think, although it has its peculiarities. Personally I like Wicket because it does not use XML configurations, relies heavily on code and has a nice community around it. Wicket also offers good AJAX support btw.

Difference between Apache Tapestry and Apache Wicket

Apache Wicket ( http://wicket.apache.org/ ) and Apache Tapestry ( http://wicket.apache.org/ ) are both component oriented web frameworks - contrary to action based frameworks like Stripes - by the Apache Foundation. Both allow you to build your application from components in Java. They both look very similar to me.
What are the differences between those two frameworks? Has someone experience in both? Specifically:
How is their performance, how much can state handling be customized, can they be used stateless?
What is the difference in their component model?
What would you choose for which applications?
How do they integrate with Guice, Spring, JSR 299?
Edit: I have read the documentation for both and I have used both. The questions cannot be answered sufficently from reading the documentation, but from the experience from using these for some time, e.g. how to use Wicket in a stateless mode for high performance sites. Thanks.

Some relevant differences as I see them:
Tapestry uses a semi-static page
structure, where you can work with
conditionals and loops to achieve
dynamic behavior. Wicket is
completely dynamic; you can load
components dynamically, replace them
at runtime, etc. The consequences of
this are that Tapestry is easier to
optimize, and that Wicket is more
flexible in it's use.
Both frameworks
are roughly equally efficient in
execution, but Wicket relies on
server side storage (by default the
current page in session, and past
pages in a 'second level cache' which
is default a temp file in the file
system). If that bothers you, think
about how many concurrent sessions
you expect to have at peak times and
calculate with say ~100kb per session
(which is probably on the high side).
That means that you can run roughly
support 20k concurrent sessions for
2GB. Say 15k because you need that
memory for other things as well. Of
course, a disadvantage of storing
state is that it'll only work well
with session affinity, so that's a
limitation when using Wicket. The
framework provides you with a means
to implement stateless pages, but if
you're developing fully stateless
applications you might consider a
different framework.
Wicket's goal is to support static typing to the fullest extent, whereas Tapestry is more about saving lines of code. So with Tapestry your code base is likely smaller, which is good for maintenance, and with Wicket, you much is statically typed, which makes it easier to navigate with an IDE and check with a compiler, which also is good for maintenance. Something to say for both imho.
I have read a few times by now that people think Wicket works through inheritance a lot. I would like to stress that you have a choice. There is a hierarchy of components, but Wicket also supports composition though constructs like IBehavior (on top of which e.g. Wicket's Ajax support is built). On top of that you have things like converters and validators, which you add to components, globally, or even as a cross cutting concern using some of the phase listeners Wicket provides.

REVISED after studying Tapestry 5.
Wicket's goal is an attempt to make web development similar to desktop GUI one. They managed to do it really well at the expense of memory usage ( HTTPSession ).
Tapestry 5's goal is to make very optimized (for CPU and memory) component oriented web framework.
The really big pitfall for me was responses "Wicket supports stateless component!" to the arguments "Wicket is memory hungry". While Wicket indeed supports stateless components they are not "a focus of Wicket development". For example a bug in StatelessForm was not fixed for a very long time - see StatelessForm - problem with parameters after validation fails.
IMHO using Wicket is a bit eaiser until you are going to optimize/ fine-tune web application parameters
IMHO Wicket is harder to study if you have programmed web applications and want to think in terms of request processing
Tapestry 5 automatically reloads component classes as soon as you change them. Both frameworks reload component markup.
Wicket forces markup/ code separation, Tapestry 5 just give you this ability. You can also use less verbose syntax in Tapestry 5. As always this freedom requires more cautions to be taken.
Wicket's core is easier to debug: user components are based on inheritance while Tapestry 5 user components are based on annotations. From the other side that could make transitions to the future versions easier for Tapestry then for Wicket.
Unfortunately Tapestry 5 tutorial does not stress that Tapestry code example like 't:loop source="1..10"...' can be a bad practice. So some effort should be put into writing Tapestry usage conventions/ good practices if your team is not very small.
My recommendations:
Use Wicket when your pages structure is very dynamic and you can afford spending 10-200 Kbs of HttpSession memory per user (these are rough numbers).
Use Tapestry 5 in cases when you need more efficient usage of resources

Here's a pretty thorough comparison from IBM's Developer Works.
http://www.ibm.com/developerworks/java/library/os-tapestrywicket/index.html?ca=drs
Update: link is dead, but you can find the page on http://web.archive.org/web/20131011174338/http://www.ibm.com/developerworks/java/library/os-tapestrywicket/index.html?ca=drs

I think Wicket is a simpler framework to use.
Also, Wicket does allow for class reloading via your IDE's hot-code replace system. This is all that is required for Wicket to run off modified versions of a currently running application's classes. The usual restrictions apply for hot-code replace, such as having to run in Debug mode (Eclipse) and not being able to change structural aspects of a class (i.e. class name, changing method signatures etc...).

I don't like the Tapestry programming model and I know of many developers leaving Tapestry because of too much changes and incompatibilities in development. See: http://ptrthomas.wordpress.com/2009/09/14/perfbench-update-tapestry-5-and-grails/

Wicket is very good web framework. Best from all what i'm know. I'm use it since version 1.3 and always get what i'm want.
Wicket has excellent integration with Spring - just use #SpringBean annotation in you code to inject any spring bean to your classes.

Try http://incubator.apache.org/click/ .
It is amazing java web framework.
Some people call it “Wicket made right” ;-)

As I said when 4.1 was the official stable release:
You should take a very good look at the development history of Tapestry before committing to use it. Tapestry has done a lot of non-compatible upgrades, with no continuation of support of older versions. Patches to 4.1 are not processed anymore within a reasonable timeframe. That is in my point of view not acceptable for the official stable version.
Committing to use Tapestry 5 means:
you should become a committer;
you need to keep up with all new development, abandon old versions as fast as possible;
maintain stable versions yourself.

Using java (desktop) codebase in a webapp

I have a rather large (80k loc) java desktop app that talks to a database. We're now looking at exposing some parts of the database via a web application, using the existing codebase and preferably not having to modify it.
I have good separation between the data access, business logic and presentation layers, but we haven't used enterprise java beans or anything like that (if that's important).
What's the best way forward? Which of the java web frameworks will be best suited to the problem? Learning curve isn't terribly important, since I haven't done any java development on the web...

To be true, it depends what you already have, and how well is the design of your current desktop application. You might not be able to use any or may be minimal of your existing code without modifying it, if its designed badly, and everything is tightly coupled.
Assuming that you are having a system with a good design, everything is de-coupled well enough. You can look into Stripes to make your presentation for the web, and use your existing data access and business code. I wish you all the luck.
Few other goodies to look into are, Groovy on Grail, Wicket.
I don't recommend anything like Seam and Spring they are more of a container and sophisticated large frameworks, which give you almost everything, solution for almost all of your problems. As you mentioned that you already have a complete system, and you just need to make a web interface to publish it for the web, these are not recommended, IMO.
JSF, is a good framework, but it might drive you nuts and has a big learning curve, according to few folks.

The two frameworks I would recommend would be Grails and Struts 2.
Grails comes with a whole bunch of stuff that it configures under the covers including Hibernate and Spring. It makes generating dynamic pages to send to the browser ridiculously easy. What you are probably going to need to do is set up controllers that call Grails services which reference your existing code as you probably don't want Grails managing your database interactions. The disadvantage with Grails is not so much that it is written in Groovy, which is easy to learn for Java programmers, but that the IDE support for Groovy is still maturing. Still if you want quick productivity this is the route to go down.
Struts 2 offers a clean command pattern framework implementation that talks to JSPs (or velocity or FreeMarker templates) on the front end. To use this you would configure actions to call your existing code. You may want to investigate adding Spring to the mix depending on what you need to do.
There are other choices but these are two that I have had some success with.