Yeoman backbonejs with pushstate causing issues with grunt-contrib-connect - backbone.js

I have a backbonejs application in my yeoman dev environment. My application uses pushstate, however this causes the connect server to issue 404s when the page is reloaded (via live reload) or when I try to directly access a url. This is somewhat annoying right now, as I have pushstate support working under an nginx proxy, but I would like to have this ability in my dev environment too.

I've been having a similar issue with my AngularJS application and Yeoman. I used the 'connect-modrewrite' middleware to rewrite all URLS that weren't pointing to specific resources. Found the solution here => http://ericduran.io/2013/05/31/angular-html5Mode-with-yeoman/

Related

Does npm server is necessary for ReactJS with django on production?

I have developped the application with DJango + ReactJS
when in developpment,
using
$python manage.py runserver
and
$yarn start
which launche the two servers on localhost:8000 and localhost:3000
However in production environment, I need to launch two servers??
When I use webpack before I run two server in developpment environment, but in Production just building in advance and use only on one server uwsgi
Could run under one server directly, I'll share other ways too.
Have your yarn build done and serve under Django's static files + listen for js/css/image assets. Now about your routing, you need to capture frontend routes such a way that (when direct url is entered), Django responds back static assets itself.
The downside in above is that your APIs' urls have to be following some pattern which won't interfere frontend URIs (routes).
Running two servers + CORS
Pack your react build with expressjs and serve it with some production grade server like pm2/ could use nginx + static files too but to tackle routes issue (of React), you'll need to tweak nginx to listen to not only "/" but also other routes in frontend.
Now, calling django APIs, do enable CORS config to support calling APIs from your React site.
Can also use serverless to send your static files + CORS behind the scenes.
If you're not having access to root of server, would need extra one to spare in former case. Otherwise to spin up a frontend + backend process in same server machine won't do much weight.
Good luck!

Run angularjs front-end web app on codenvy

How do I run an angularjs front-end web app on codenvy? The app uses angular-route.js for routing between pages. I have tried using the preview function, but that one seems to not work due to the routing...
One way is to use a workspace which has a web server like apache httpd installed. For how to do that see How do you install an apache server (httpd) on codenvy?
Another thing to try is to unbound the app from localhost, i.e. use host as 0.0.0.0

Cordova and AngularJS cookies don't work

I am working on a Cordova app developed with AngularJS.
I find that $cookies is not working in an Cordova/Phonegap app since the pages are served as a file URL. In an normal desktop browser it is also not working if you serve the pages from the filesystem - it's WORKING when served via a server or localhost.
So I get to the assumption that angular $cookies don't work for Cordova apps.
Maybe theres a workaround for that? I just don't know, maybe someone nows an answer.
Cordova not allows to use cookies
but you can easily move them to localStorage
try: bower install angular-cookies-mirror

How to set up BrowserSync and/or Angular $http to work together without cors issues

I have BrowerSync setup who serves my AngularJS application. It works great till I want to call my REST-API which is MS Web-Api project running on IIS Express.
So, I have JS application running on locahost:3000 calling through $http rest-api run localhost:4000 so I do have CORS issues.
How to set up BrowserSync or any other software (on Windows 8) to get rid these issues?
The perfect way to me would be some grunt profile.
Since you're on two separate domains, you will have CORS anyway.
What you could do is enabling CORS on your API with config.EnableCors() on your WebApiConfig.cs
More info here: http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api
What I did, and what was the easiest thing to do without touching anything was running chrome without cors.
PS C:\Program Files (x86)\Google\Chrome\Application> .\chrome.exe --user-data-dir="C:/Chrome dev session" --disable-websecurity

Angular in production

I've made an angular app. Not fully completed, but it's working fine on my localhost.
I bought a DigitalOcean droplet and I've pushed my app in there.
The problem is that when I click on a link, everything is loaded properly. But then the link just goes to the root link. Is there something you have to set in some kind of configuration for angular apps from development to production mode?
Maybe it has something to do with my apache2 config? Again, everything is working fine on localhost.
FYI: I'm using the Laravel framework as REST api.
My server is accessible at: http://95.85.10.155/
Hope someone has a solution.
Do you have mod_rewrite installed/enabled? Laravel requires it. See the installation documentation for more information.
http://laravel.com/docs/installation
Well, it's solved. The .htaccess didn't rewrite the .index.php in the url. So I've tweaked it and it all good now.

Resources