What are good ways to write organised JavaScript code for a single page web application project?

You will need to split your code into many small pieces and assemble your web application from those small pieces.One way to split the project is to employ the Model–view–controller or Model-view-viewmodel architecture patterns [1,2]. Here you would split your code into views (and sub-views), controllers and models.But above pattern is not enough as it does not give you guidance on: how to structure your code into modules, how to do dependency management of your modules, how to do unit / functional testing from browser or command line, how to test your widgets separately from your web application, how to model client to server interaction, how to implement component to component interaction, how to mock your server so that you will be able to develop and test without the actual server, how to lint, document and build your production code (minify). I would suggest you to check donejs [3] project to learn what is required for a large client-side web project. It supports a lot of good practices packaged in one install. An example of organizing source code into modules is described in [3].Once you learn more about what you require, then proceed to tools selection (frameworks, template language, testing tools, headless browser, etc).[1] https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller[2] https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93viewmodel [3] https://donejs.com

Asynchronous Module Definition or AMD. I use require.js personally. Nothing helps in managing large scale client side js like AMD

You might find http://angularjs.org useful, especially the http://docs.angularjs.org/tutorial/step_07 functionality, which lets you define a URL structure for your single-page app This is really great for you AND users because it makes you think about what your actual views are, and it gives your users a way to bookmark a place within your single page app. More generally, to use MVC to get a really organised structure in AngularJS: Views are written in HTML, with any kind of dynamic DOM manipulation rigorously kept within http://docs.angularjs.org/guide/directive Controllers are very short and contain no DOM manipulation, so they are a very clear link between your view and business logic in the form of http://docs.angularjs.org/guide/scope Your model/business logic should be encapsulated in http://docs.angularjs.org/guide/dev_guide.services.creating_services. Services are a bit of a free-for-all right now, so [shameless plug] I recommend using a library like my own https://github.com/mbertolacci/angular-service-utilities to give them a bit more structure. I'm sure other frameworks would do the trick too, I just have more experience with AngularJS, and I like that it's written and supported by Google!