Home - gregoryagu/jacuzzi GitHub Wiki
## Jacuzzi: The easiest way to write an MVC single page app.
###When your at the SPA, be sure to check out the Jacuzzi.
Single Page apps are great, but they have a lot of moving parts, and they are all in Javascript.
Jacuzzi throws out most of the JavaScript in favor of server-side MVC views. The one piece it keeps is the router.
The router, instead of serving up local views, fetches partial views from the server and serves them up. So from a user perspective, it's a single page app with all it's glory. But the ease of a standard MVC app.
The download is a sample project using Jacuzzi. It's a MVC 5 application just like you get from creating a new project in Visual Studio 2013 except for a few added bits to wire up the router. But if you are familiar with MVC, you can do a Jacuzzi single page app.
Here is all you need to remember: 1. Return Partial Views, not views.
- Do not use @Html.ActionLink. It creates improper urls. Instead, just use a standard anchor tag with a leading # in the url. For example href="#/Home/About" (I plan to write an HTMLHelper that does return a properly formatted URL.)
- Use Ajax.Begin form instead of Html.BeginForm in order to post Forms. Here is an example:
The sample app has all of the above done to it so it is a full fledged single page app. The browser back button works with #tags, and the views are swapped out elegantly without flicker.
## Helpful Hints:
Put all your javascript in external files. You already knew this, but you may not have known why: When you put your javascript in an external file, then you can set breakpoints in Visual Studio and they will be hit. This is not the case for inline JavaScript which must be debugged in an external tool such as F12 Developer tools. But you lose the integrated debugging experience.
If you must put javascript in an html file, use separate script tags for each script.
Example:
<script> runNonExistantFunctionWhichWillFail()</script>
- `<script>
- runExistingFunctionWhichWillNotFail()
</script>`
If those where in the same script, the interpreter would stop on the first and never run the second. Separated, the interpreter will fail on the first, but still run the second.
Turn on JavaScript debugging in IE to have it automatically break on JavaScript errors. Options/Advanced/Browsing Disable Script Debugging). You will want to turn this off when you are done debugging.
Set a hard breakpoint in your javascript with:
<script> debugger;</script>