Building one page apps with angularjs and sails.js backend - node.js

I just found out about sails.js and i think it's really awesome. I want to build apps with sails and angular, but i haven't found any guides on doing this. I found this site which is supposed to have a talk on using sails.js instead on express in the mean stack, but there's not video there.
I would be glad for links to videos or blog posts on how to do this.
Thanks all.

This is getting downvoted because its not a direct question about code.
I have a boilerplate sailsjs app that you can use to model your own off of..
https://github.com/mikedevita/sailsjs-v10-angularjs-requirejs-boilerplate
This is based on v0.10 which is in beta right now, but the same concept applies.

I've created a simple yet powerful angular service, published as a bower component: https://github.com/diegopamio/angular-sails-bind
It basically:
Creates the model inside the $scope for you.
Retrieves the model data from the backend using socket.
Watches for changes made by the user in the UI and updates the backend immediately.
Watches for changes made in the backend and updates the UI immediately.
And it does it with just one line of code in your angular app, like this: $sailsBind("", $scope);
I made it as part of a personal project and then I decided to publish it as it could benefit others. It works with sails 0.10. Let me know if it suits your needs or if you'd like to see something else on it.

Related

Single executable for React App and Express API

I have a React App and a Express API. I want to package those two components into one single executable. Is there a way to do this? I don’t want a solution to my problem I want a hint into the right direction if this is possible.
I believe what you mean is not to keep the bundler running as well as the express server, unfortunately that's not possible if you're in developer mode (and) you're expecting realtime updates in your browser, but if you were in production, then it's not even the case that you need to run your bundler, cause your main.bundle.js is already built and ready.
I think this is what you are looking for. https://electronjs.org/
Electron or similar libraries help you to create an executable application which can be installed an run like a desktop application.
The only point you have to keep in mind is for accessing the database you will have to create a REST API and communicate via that.
Link for a simple tutorial.

Creating modules/HMVC in sails.js

I am trying to make a separation in my new SailsJS app by creating modules/HMVC, just like ASP.NET MVC, and Codeigniter PHP. These frameworks provide a mechanism for handling such a separation. Do any one have an idea how to implement this in SailsJS?
There is some development taking place in that direction, I'm not quite sure whether or not anything usable already exists, at least I haven't been able to find anything final so far. Two threads where adding HMVC to sails was discussed are
https://github.com/balderdashy/sails/issues/1191
https://github.com/balderdashy/sails/issues/594
I think the most recent sails plugin/backend components system discussion is balderdashy/sails/pull/2083.
It looks like the most viable module solution today is balderdashy/sails-hook-subapps, an example of a sails hook. Hopefully, it works with 0.12.x and gets some attention/docs soon!
Additionally, the project sailorjs/sailorjs appears to do exactly this as a fork of sails from version 0.10.x, though I don't know if there are plans ot utilize that work in sails.js.

How can I properly structure my NodeJS, Express, and MongoDB code?

I am new to all three but I do know javascript well. I understand basics of them all but do not understand what the best way to implement the NodeJS server javascript with the express MVC and MongoDB database querys. I want to break up all this into their own files obviously but I am not sure how everything fits into the pre-created project template created by Express. Does anyone have a good solution or resource to share with me? Thank you
I recently started with node.js, express and mongodb myself and it's true the resources out there are mostly outdated. First of all, express is not an mvc framework. It has no opinion on the structure which you'll find out that it makes it so great. Your question is how to organise the code? It's clearly a personal preference but you can create a model folder where you can put your db queries for specific resources, your lib folder where you can establish a connection to your mongodb instance and call it wherever you need it and use the routes folder for your more specific needs like controllers on a traditional MVC. Another thing is that you have to decide how to interact with mongo. You can either use the native mongodb driver, perhaps with mongoskin as suggested, or mongoose for easier interactions such as defining schemas. Personally i prefer the native but it took me a while to get what it does and how it works. Finally for resources what i can suggest from personal experience and it's still my own opinion, is that the best thing you can do is buy the book Node.js in Action which was what made me realize what node.js is all about and how to use it. Hope it helps...

Re-using backbone routes, models, and views on the node.js server

I am trying to build an application which both works as a SPA and as a normal application without re-writing any of the code as much as possible. My research has led to believe that this could be very possible using node + backbone (on both the server and client). I have found some resources on how to do this but nothing truly complete. Have anyone tried a full solution to re-using all the code?
The resources that I found:
Re-using backbone models on the server: http://blog.andyet.com/2011/feb/15/re-using-backbonejs-models-on-the-server-with-node/
Re-using backbone views and layout manager on the server:
http://vimeo.com/46033641
I have also found some frameworks that achieve this such as (bones, derby, meteor), but I dont feel like using such a framework is the best solution since I still want to have full control over backbone and node.
What you are trying to implement is Resource-View-Presenter model. Please read this article completely http://blog.nodejitsu.com/scaling-isomorphic-javascript-code. It provides much needed insight for isomorphic code that can execute both on the client and the server. It also helped me understand various models and architectures.
What backbone.js uses is traditional MVC framework, which cannot work on both client and server without modifications. So if you want to stick to backbone.js you will face this disadvantage sooner or later. I tried backbone too and found no easy way to do that.
I tried looking for RVP frameworks on node.js, but it is still new. I would suggest you look into flatiron.js http://flatironjs.org/. It is based on Resource-View-Presenter model, the only one I could find for node.js. Some changes will be required to implement on both server/client, but it is not much. You will find it is similar to backbone.
Hope it helps you to find the right path.
I recently did some research on the field and found some interesting projects that are using the same backbone code on the client and server (nodejs).
Project 1
The first one was introduced by Keith Norma from Groupon. He managed to reuse backbone router + templates on the client and server.
App demo: https://github.com/keithnorm/SpainJS-Pipedream-Demo
Presentation at SpainJS talk: http://www.youtube.com/watch?v=jbn9c_yfuoM
Project 2
The second project is Rendr presented by Spike Brehm from Airbnb but not released yet to the public. It seems a bit more ambitious as it also trades backbone model and collections to the nodejs server. You can read more about it here: http://nerds.airbnb.com/weve-launched-our-first-nodejs-app-to-product
UPDATE: Rendr code has been released: https://github.com/airbnb/rendr
Project 3
There is another project that also allows to share backbone code between client and server: https://github.com/developmentseed/bones

Yeoman and ExpressJS

I want to know if there is some boilerplate code to use a frontend workflow tool like Yeoman with a backend framework like ExpressJS, if I want to maintain the same codebase for both the front and back ends.
Basically I want to know -
How do the boilerplate code produced by yeoman and express fit in together. Is there a way to integrate the two? (How does the gruntfile fit into the express project)
Can I substitute yeoman's default watch with an express server which reloads pages on update?
Yeoman is currently focused on front-end app development, but we're going to explore back-end integration in the future.
No, actually there isn't any right now.
But you can combine express.js with the component package manager. There is some work left, and you cant use yeoman components in component.
To answer your questions
You can look for components in the component repo that you have used in yeoman. Not the same, but might be a solution.
Use the module supervisor for this. You can get it via npm
I haven't found an easy way of integrating my own Express + H5BP + Angular + Grunt skeletons into Yeoman, and eventually just settled for creating a repo here: https://github.com/ericclemmons/genesis-skeleton
From what I've read, there are projects underway to add express generators, but eventually stacks are going to get complex enough to where you'll have to maintain your own starter app, rather than generating it.
There's an experimental branch with yeoman + express.js G+ Yeoman/Express Article
I found yeoman.js to be very cool for rapid prototyping but does require some ramping up to get used to the various tools it's "opinionated" about. I've decided to go over each of the core tools in some vids that are hopefully helpful: yeoman.js related videos
Yoeman fullstack generator now generates both front end and back end. Other interesting frameworks which do the same are Sails JS and StrongLoop
It is worth noting there is an express-generator project:
official docs
npm page
I am going to give it a go - because I'm folling this tutorial - but other than that I cant comment on its value.

Resources