I am asked to project a web solution to allow vote casting in public assemblies.
The solution shall be written with node.js on the server, and javascript, possibly using angular.js on the client (since javascript is the language I know best, today :-).
The app shall run on mobile devices, and will be quite simple: it shall handle some sort of authentication, to identify the owner of the device (the 'user'), and shall show a form with two buttons (Yes and No).
The button press shall be sent to a central server (on the LAN).
The server shall collect and store the votes from the users, and shall choose when to enable the buttons (voting session opened), and when to disable them (voting session closed).
Trying to be clearer, the app shall replace current devices, which look like this one:
It's not so clear from the picture, but the device has two buttons, one for "Yes" vote, and one for "No" (there are more buttons, but their use is irrilevant, here).
Initially the app will handle only the vote casting (not the audio).
I'm totally new to web realtime programming, so I'm in doubt about which software stack of libraries to adopt for the project.
Googling around, I see socket.io could be a good solution, but I prefer asking the community, to try to find the most suited solution for the job.
So the final question: do you know of any open-source project, tutorial, bolg post, anything I could study to start designing the app I tried to describe?
Any solution, observation, opinion, real-life experience would be welcome, too...
I would also look at PubNub, which is a realtime global data stream network--here's a good voting app tutorial to get started: https://www.pubnub.com/blog/2014-11-18-power-a-realtime-voting-app-with-live-results-using-d3js/
There's great developer resources to get your started, for help, and lots of add-ons, like presence, history, and realtime charts, like EON: https://www.pubnub.com/developers/eon/
Socket.io is used essentially when you need something in realtime. The tradition RESTful APIs are a better/proven method.
To get started I would suggest reading up on the MEAN stack (also allows you to use the MongoDB database), A couple of tutorials should be a good starting point :
https://scotch.io/tutorials/setting-up-a-mean-stack-single-page-application
https://thinkster.io/mean-stack-tutorial
https://www.npmjs.com/package/slush-meanjs is a good resource to scaffold out your project. Slush is a generator that uses GULP as compared to yeoman generators which are only just beginning to implement gulp as its task-runner (currently uses grunt as the default task runner). Yeoman still doesnt have a great generator for the MEAN stack. If however you plan to exclude the database a good starting point would be to just use express on the backend and angularjs as the front end. To do this you can scaffold out a express project using generator-express (https://github.com/petecoop/generator-express) and once express is setup you can add angular to it using https://github.com/yeoman/generator-angular.
The directory would look something like this :
-app
---*client side libs*
-bin
--- www /* npm start to start the server */
-routes/ /* for all your express routing */
-test/
...
-app.js
...
For authentication you could use the scaffolded out CRUD model. If using socket.io for all the client server communication this is a good resource -
https://auth0.com/blog/2014/01/15/auth-with-socket-io/
Related
So, I have been learning Vue.js as my first js framework for some time and after I made some simple SPA:s without much interactions with a server I started to wonder: What should a backend be like with Vue? For education purposes I gave it a try and came up with some pattern on my own and now I can't imagine anything else, maybe I got some wrong idea.
What I came up with: I made a simple API with PHP which was receiving requests from the frontend (Vue component methods reacting on UI events) and requesting data from the model or updating data through it.
There are a lot of different Backend Solutions and you should take what fits your websites purpose and also personal preference the best.
If Backend includes Hosting in your case then you basicly have the 2 big options:
a) A Server where you run it ex. via an Reverse Proxy (example: Digital Ocean)
b) A cloud computing Platform (example: AWS, Heroku, App Engine)
But you only need to host it that way if you actually run the app and retrieve dynamic updates on the page, new routes get added when you for example publish a new Post.
If that is not the case then a static hosting provider would be enough, there are 1000´s of them and they are pretty uncomplicated.
If you mean which Database to use, then it also comes down to preference, do you want a SQL Databse or a NoSQL Database like MongoDB? As a personal recommendation I would suggest you to use Firebase as your backend for your experimental app, the free plan is far than enough for testing purposes, you also have a smooth and easy to integrate Authentication System avaliable and you can also take quick advantage of things like Push Messages, Cloud Storage Buckets and more.
Note that Im not related to FB by any means and this is just a personal recommendation, but I feel like your Question is pretty opinion based so maybe be more specific about your goals or just comment down below if you got any more questions.
I'm new to Javascript frameworks and looking for framework for my new projects. Until now i created simple apps using MVC framework Django with Bootstrap frontend. Thanks framework i got everything in one package with best-practice well know. For Javascript i used some jQuery libraries without understanding, just configured with doc help.
When i tried to write some Javascript on my own and found there are big changes in JS world (like ES6, TypeScript) i found it very usefull. When i found JS frameworks, i felt in love.
I have read about frameworks, watched some tutorials. As many other, i found React nice. But what i'm completely missing, is the server part. Especially React tutorials creates components or functions, nice UI, but don't cover what happens with data next. I know that React is ment as "V" in MVC. But what is the best-practice or wide-used extension for server part? Are there tutorials or book to take me further than just creating actions and UI?
Thanks for any links, i just need to point best direction. Or is React ment for just specific project parts and better to look elsewhere?
As you said, yes there are quite a number of tutorials and most of them don't cover how do you deploy node apps on the servers. I'll assume you have some server admin knowledge so I'll skip straight to the meat of the setup.
The Server Setup
Regardless of it being a simple static page, a single page API or a react app, you will need to have Node.js installed on any server you will want it to run. Second you will need a production process manager for Node.js. My personal favourite is PM2. The process manages makes sure your app is always on and restarts it if it goes down for whatever reason. You will also need a reverse proxy server (you need this for security and SEO purposes). Again, a go-to for it is Nginx (it's a competitor of Apache)
Two very good tutorials for setting up your server are
Tut #1
Tut #2
The App Setup
Apart from all the server setup you need to handle routing for your app (what happens when you to go to /blog or /login). A stable standard right now is Express.js. You can do without but then you will need to write a lot of the manual routing by hand in Node.js You will set up Express to server back your Index file and any others you may need.
A good tutorial for configuring your Express for a React app is Video Tut.
He does show a bit more but that is on later videos. You can stop once you get the gist of it.
Advanced Stuff
There's also the matter if you want the JavaScript to be rendered on the server or on the client side. For that you will need to make some more configuration for you app. The video tutorial I linked above should show you how to set that up as well if you are interested.
I'm evaluating Sails.js for my next project. I think it is a very well laid out project and the framework for Node that mostly resembles Django, that I'm used to.
One thing that every Django developer is gonna miss from any framework not providing it, is the admin page, a very quick and powerful way to administrate the site as you go, test out things, input the initial data and so on.
I've found out Drywall and it looks amazing. Only, it is a framework by its own. I'd just like to use Sails for the site and have a backend administration page provided by Drywall.
How to integrate the two, or: is there any admin plugin for Sails.js?
Thanks
Sails.js Admin Page Scaffolding has been an open issue for a few months now. I think it may come after associations which would make sense - what is User administration if you can't change its Role presented by its label rather than its id.
It shouldn't be too hard since Sails already produce a REST API for each model you set up.
Using Drywall with Sails seems pretty difficult. Sails is DB agnostic while Drywall wants you to use MongoDB.
Drywall seems more like a tool to build website where Sails is more like a framework to build api based webapp.
I am the co-creator of Strapi.
Strapi is a Node.js framework based on Koa. It ships a complete user system management and an auto-generated admin panel.
Feel free to try it and let us know if you have any question.
Pierre
I've been developing a web app using Node.js, Express, MongoDB, Mongoose and Socket.io for some time now. Version one has just been released and is working great. For version two however, I want to completely redesign the UI and use a front-end framework such as AngularJS. I've been looking at the (MEAN stack) and it looks really promising. Before goin into too much details, I will try to explain the purpose and working of the app so hopefully you will understand my question later on.
My app is a streaming service and has 4 simple models: user, room, song, playlist. These are modeled through Schema's in Mongoose and are stored in the MongoDB database. When a user visits the app, it serves all the HTML through Node.js and Express (and Jade as templating engine). If the user then registers, Socket.io lets the server know a user register, that is then saved to the database and the user is joined in the lobby room. In this room, users can chat, listen to music, etc. This is what I've been using Socket.io for, the communication between users themselves and my server (the server sometimes serves html too through Socket.io). Basically all the messages between Socket.io and the server are really small (chat messages, room objects, song objects, etc).
I'm quite happy with this approach, however, on the client side, the code is not really separated. There are currently two JS files serving the logic. One handles the Socket.io events and manipulates the dom. The other one is a common JS file that does a bit of everything. These two files are now about 5000 lines each. This worries me and I want to find a solution for this in v2.
So I've been looking at AngularJS in the MEAN stack and how to incorporate it in my app. My question is, will this solve my client side problems and can would you recommend taking the effort to do so. Also, how well will Socket.io work with AngularJS? Having both of them might be an overkill for what I'm doing. Do you know of any possible other framework that might be easier to integrate with my current environment? I know it's a bit of a subjective question but if you have any tips or do or don'ts, thanks for sharing! I really appreciate your feedback and if you need more information, I'd be happy to share it with you!
Jordy
I think that real example will be sufficient: https://github.com/btford/angular-socket-io-seed
im looking forward to build RT web apps with NodeJS. Coming from Rails, I've felt in love with NodeJS and Async JS programming.
Run a few experiments with Node, and then as I search tools and resources to get used with, I got overwhelmed with the lot of stuff over there.
I found lot's of libraries and components over there, and pretty much got confused on how a large-scale well-writen and implemented RT web app should be built.
So the app will run over NodeJS, using Express framework.
I read about knockout.js, a client-side library to provide realtime stuff like automatic UI refresh, and I guess I could conbine it with jQuery.
Also, I found socket.io.
The author says:
Socket.IO aims to make realtime apps possible in every browser and mobile device, blurring the differences between the different transport mechanisms. It's care-free realtime 100% in JavaScript.
So socket.io is about compatibility.
What about backbone.js? Where does it goes to?
With so much stuff, I got shocked. What should I learn? Which modules worth studing?
Im focusing on NodeJS and Express but most books/screencasts covers old versions of nodejs. So im being guided by its official API.
Now im here asking your advice and to organize somehow all the info out there.
Correct me if my assumptions are not precise, please point me to the right direction and feel free to suggest any other module that could help on my learning.
Thanks in advance
It might be useful for you to separate the node.js server side libraries (via npm etc...) from all of the client side (browser) libraries and technologies like jquery, backbone, knockout etc... when you think about it. Even socket.io which exposes a persistent socket connection between the browser and the server (to avoid polling) does not dictate what client side technologies you use.
Focus on exposing a solid web-api ( random example ) from your server and your client technologies can be swapped, augmented etc... with no effect on the server. The only place they intersect is if you're using a view technology like Jade. It's also an option to have a pure separation where the server is just serving up the client files and your client is a thicker javascript application (using knockout, jquery etc...) calling a good server web api.
Some folks try to unify the client and server models - for example, this article using backbone and node. It depends on how much data you work with to say whether that's feasible but it does couple the client and server and makes the server stateful which can have downsides (scale out, requires affinity etc...). Personally, I get wary of that much magic (binding, state, syncing etc...). Node is about keeping things simple, light and fast. It's a fast front end network server.
My 2 cents (and some may disagree). Start with node on the server and pick your storage (mongoDb etc...). Design a solid RESTful (hypermedia) API - a good webapi regardless of the client. Then start with a basic html/css/js, maybe jquery client and add things like knockout etc... as you expand your client skills. That will allow you to replace your client technologies independent of your server as the new technology winds change (and they will).
That's the hallmark of a well designed system - the ability to replace componets/sub-systems without rewriting everything :)
Hope that helps clear up some of the fog :)
You may want to look at Meteor if you are focussing on real-time Javascript apps: http://meteor.com/