Use backbone routing without changing url - backbone.js

I have developed a webapp using backbone.js and more importantly a backbone router. Now I have been asked if this app that changes the URL depending on what section you visit, can be used within a single div as mini module on a website. Almost like a widget within a dashboard.
Any ideas how I could quickly implement this..... I feel like i'm missing a simple solution here.
Thanks,
Gary

Related

Add an additional page to an Angular SPA

The Scenario
I'm developing the front-end (CSS only) of an Angular SPA.
I'm not especially familiar with Angular routing.
I'd like to add a standalone page containing Bootstrap components just for development purposes (yes, I know this means it won't be a single page application anymore). This way I have one unified view with all the components so I don't have to switch back and forth while working on the CSS. It also acts as documentation for the Bootstrap for the other devs to refer to.
What I've tried
I originally added a bootstrap.html page to the app folder, alongside the app's index.html This worked at first, but has now stopped working. What would be the best/standard way to achieve something like this?
Update: I've managed to fix some of the JS errors, so the page is up and running again. My question remains though: "is there a way of adding a standalone page that is considered standard/best practise, or is it literally just add a separate HTML page at the app root?"
If you use a target='_self' in your linking anchor tag, this should force a full page reload, and that will avoid the angular routing - which is where I expect your request is getting hijacked (by design).
e.g.
link
Answering your updated question
Not to my knowledge, since (as you correctly pointed out) this mixes the SPA design pattern.

AngularJS: Trying to understand the technology behind loading new content without reloading a page

Using AngularJS 1.5.8 and Django/Django REST Framework as the back-end.
At this points have two URLs (app/ for login and app/dashboard as the main content); would be great to just have app/.
login and dashboard I have as components; navbar and sidebar I have as directives.
Using ngRoute currently and somethings I am reading lead me to believe I should be using ui-router to accomplish this.
Just some basic things that came to mind.
My sidebar has several tools I am developing. I want the user to be able to click on them, and then have the content related to that tool load in the main content area without the page refreshing or the URL changing.
Some of what I have read suggests ui-router might be better for this purpose? I am not, sure as I am just learning AngularJS and still struggling with its concepts. Thus, I don't have any code to post that needs to be fixed. Primarily just trying to understand the concepts and technology I need to look into to accomplish this. Makes it hard to lookup results on Google and SO when you aren't even sure what the terminology and tech is that you should be looking for.
Not sure if ngRoute or ui-router should be used; whether the modules should be built as components or directives; if the content for each tool stays in its own HTML template; etc...
This is a somewhat broad question but what you are looking for is client-side routing. Both ngRoute and ui-router offer this functionality and in very similar ways except ui-router offers significant extensibility with nested routes and multiple named view containers.
My advice is to start with ngRoute and learn it's ins and outs and then switch to ui-router if you find you need this extra functionality.
Client-side routing can either be used with the hash-bang (#/) or using html5 mode you can use a base URL that would function visually like server-side routing.
Now you've got the terms to search at least so happy Googling!

Rewrite the code to handle the views in an Angular-Laravel App

I am working on an App which is going to be huge.This app is using Laravel for backend and currently uses Angular to load views which i believe is not suitable for a large application.I would like to rewrite the code to load the views using Laravel's Blade engine.
I have gone through this:
What application structure to use with AngularJS and Laravel?
I am interested in the second option provided in the answer but have no idea how to implement it in my existing application.
Please suggest me what changes do i need to do.
Thanks in advance.

How to structure and architect an angularjs application

I am trying to develop an angularjs based web app but I am a little bit confused on how should I structure my app. For example I am used on using JSP pages when it come to the front end so for example every different component is a different jsp page let's say a home page, contact page etc. My question is what is the suggested way to do so in angularjs since the angularjs should be a single page web app should I create my content in directives and depending on the flow hide or show other directives or what ?
Any direction or suggestions for reading will be more than appreciated !
I highly recommend to you reading about Angular Style Guide made by John Papa.
View Angular Style Guide here
It's a very helpful guide which provides Angular best practices to deliver a testable, scalable and extensible app.

Setting up example app within directory path

I have a Shopify store, which uses the liquid templating engine. I'm trying to setup a blog on within this site / theme.
I would like to design the blog with angular. The blog has it's own directory within the site, and it's not on a subdomain of it's own.
http://holstee.com/blogs/themes
http://holstee.com/blogs/themes/111111-article-title
I'm wondering if this is something that can be done with angular, and why it's the example that's up isn't binding? Is it a base url thing?
If your wondering why your example on that page isnt working, bring up your Javascript console (Command + J) and you'll see the error. You need to initialize the myApp module.
Something like
angular.module('myApp',[]);
The error can be found here:
http://tinyurl.com/mbvhc5a
And to answer your question, yes you can use angular for your blog, but the question is more likely to be is it the right choice? For most blogs, the answer would be no, unless your planning a high amount of user interaction with the UI.

Resources