Web UI for a REST API - javascript

I wrote a REST API in Node.js (with Express)that implements a queue with some dequeue/enqueue functionality, and the next step is creating a web view for that API.
I am really new to javascript and Node.js , can i have some pointers on how to implement it? is there a framework I can use to integrate the api.js i built with a front-end?

When you wrote a REST api using nodejs and the expressjs framework, you are perfectly prepared to use the complete MEAN stack, which implements angularJS for frontend services.
Angular offers a complete REST implementation (called ngResource). Install via npm.
With the angular resource service you get your frontend interface (to interact with your backend) out of the box (except a few adaptations you'll have to make, e.g. to make it work with Mongoose, which is used to make the access to your MongoDB more comfortable).
You'll find a few superb tutorials, as this one and others on scotch.io are some of them. Google for 'api rest angular resource mean ...' in different selections ;-)
Other links that helped me a lot:
Tutorial from Angular itself
Thinkster.io - complete MEAN stack overview with examples
a helpful tutorial with good examples from Frederik Dietz
Buecheler comes out with this great tutorial, but its more about the backend side - as you might check your code againt the basic standards of a REST backend implementation.
Those are some of the links I noted and that could find ad hoc.
EDIT:
As your headline suggests you are searching for an UI, I suppose IBM Strongloop might be a good hint for you. IBM is strongly interconnected with the development of ExpressJS and offers this API and UI for probably all data concerning questions of your Webapp.

Related

I have 3 questions that cause me to conflict and not understand their terminology

I am new to Angular and I have an initial understanding of the special basics and these questions are facing me and I want to understand them well.
I've been reading around trying to understand what RESTful API is all about.
1- In Angular, can we say about (Fetch Data Using HTTP Client With Angular) it is an Api or Rest
2 - Using Json obj taken from a page that gives us the obj and using the data in it and showing it in my web page Can it be called using api
3- Is the creation of the API related to the tasks of front-end or back-end in the case of dealing with the framework of Angular
I will answer simple to you and shortly:
RESTful transfers a representation of the state of the resource to the requester or endpoint. Check it out for more info here REST API
API stands for (application programming interface) is a connection between computers. It is a type of software interface, offering services to other pieces of software.
HttpClient in Angular is a module helping developers to do http requests to that API for accessing/manipulating recourses.
Keep going, hope to help you a little bit.

is it possible to built REST API without knowing about frontend for mobiles apps

This could be a silly question but I want to confirm about it. I am a backend Laravel developer and have created my website. Now I want to create mobile mobile apps but have no knowledge of front-end.
Due to lockdown situations I want to use this time to create the backend API for my apps. Now I want to know is it ok or a normal practice to create APIs without knowing anything about front end. (Like is it possible that I just create all the endpoints now that are throwing data in JSON and then the front-end developer will use them to integrate in the front-end? Thanks
P.S: I dont know how the app front-end will look like but I know what data will be needed in each page/view.
I think you can do this easily with graphql.
A Frontend dev and also beginners with Apollo in the frontend can easily introspect and build the stuff.
If you can choose your Frontend stack there is no problem with rest either.
I always do the Frontend first approach.
Mocking the data for graphql types and building the api later seems to me the best workflow ever.
See ya. Much fun with your project
Yes it is possible very possible to do that it would be nice is the API is well documented using postman or swagger for a better experience when frontend engineers want to integrate
Many API's in the world today are never consumed by a browser or app on the frontend, sure it can make life easier knowing why you are building it.
But at the end of the day, a good API is simple and easy to understand. It just allows a developer to fetch data from a system but normally with some idea about each type of request.
For example, if you had an API for a university the endpoints could be as follows:
/pupils => Get/Sets pupil data.
/teachers => Get/Sets teacher data.
/classes => Get/Sets class subjects and references ID's of both Pupils and Teachers.
So if you wanted all the Pupils in a given class you would query the /classes endpoint and then for each Pupil ID you would query the /pupil endpoint.
Sometimes not having a frontend makes the API even more generic because you might think differently when you do not have a frontend.

Loopback with ExpressJS

I have examined and practiced on creating Rest Api's with loopback and ExpressJS seperately
While Using Loopback;
It was really time consuming to read all the documentation and learning loopback specific stuff
It also enables you to create your Api in a short period of time and has lots of magic things inside it.
I saw that if I face problems while developing with loopback. I usually get stuck in finding answers from community.
While Using ExpressJs
You write almost every api endpoint in same format with lots of copied code.
You are comfortable with it and can do anything with ease.
But time consuming if compared with loopback.
My point is to utilize best parts of both ExpressJs and Loopback
So my question is "Does it make sense to use Loopback with ExpressJs and also use Mongoose?"
Related with my question Loopback has a documentation about adding ExpressJS route in Loopback application. Loopback with Express Route
If it makes sense is there any recommendation for folder structuring ?
As #Jspdown wrote in his comment to your question Loopback is really based on Express, so you don't need to make choice between them.
When you work on your application using Express and produce 'lots of copied code', soon you start to optimize it and in fact develop your own framework. So this is exactly what Loopback team already have done for you.
Thus the choice is not Loopback or Express but it is - to invest into study ready-made framework or to develop your own framework. As for me I think that if you are working on relatively simple projects and/or quick prototypes or going to change your programming tools soon - don't study, just do. But if you are working on large, mission critical system in long-lasting project - Loopback is helpful.

Integration of Node.js and Backbone.js

I have done considerable reading on both Node.js and Backbone.js; I've read some tutorials and done the relevant courses on Code School. I feel that I've got a pretty good idea of the functions that each technology serves in the context of a web application.
My problem is that I don't really know how to integrate the two technologies and use them in tandem. I would really appreciate if someone could point me to a resource which goes through the entire development of an application using Node, MongoDB, and Backbone together.
Many thanks
This is a good tutorial that shows how to setup that entire stack.
http://backbonetutorials.com/nodejs-restify-mongodb-mongoose/
In short...
Node.js
You can use a library like restify to provide a restful API for your client-side Backbone application. It can also serve your static assets for your Backbone application. The example uses restify, but could be accomplished with other libraries like express.
Mongoose
Mongoose is a javascript abstraction layer for MongoDB. This provides an easy way to interact with MongoDB from Node.js.
Backbone
Your Backbone application can utilize your restify node.js backend to handle the model synchronization. You should have plenty of control to setup the routes via restify in a way that makes Backbone happy.
This ebook could be useful (it's on Backbone, but uses Node for the backend):
http://addyosmani.github.io/backbone-fundamentals/
You also may want to look at this book:
http://www.amazon.com/Building-Node-Applications-MongoDB-Backbone/dp/1449337392
There is also Node Cellar Source.
There is not much explanation about the code, but the app is simple enough to get started and understand the basics layouts of node / backbone
It is, i think, just between an 'Hello World' code and a full app.
I use for ap in backbone yeoman https://github.com/yeoman/generator-backbone and you use it with node.js too
create rest api: http://coenraets.org/blog/2012/10/creating-a-rest-api-using-node-js-express-and-mongodb/
code backbone on the client: http://coenraets.org/blog/2012/10/nodecellar-sample-application-with-backbone-js-twitter-bootstrap-node-js-express-and-mongodb/
the backbonetutorials.com restify one is out of date. It's best to use express, especially if you plan to do any authorization. It's also more widely used
This is a comprehensive tutorial on rolling your own blog with Nodejs, Mongodb and expressjs
http://howtonode.org/express-mongodb
It's old but with a little effort you can get it to work and learn at the same time
I have found this to be the most up to date material on using Backbone.js with node
http://amzn.to/1DygKlJ

How can I use Backbone.js with ASP.Net MVC?

I'm preparing to implement a Backbone.js UI (client-side MVC) within ASP.Net MVC 3+ web application (server-side MVC).
I've read plenty of Backbone tutorials, but none that illustrate how the technology may or may not be useful in an ASP.Net MVC scenario.
What strategy should I follow when combining these two pieces?
To be fair, Backbone.js (client application) and MVC (server application) should have nothing in common. The only thing Backbone.js requires is a Restful Api. So what I would do is take a look at MVC 4's Web Api (Example). There are quite a few tutorials on the subject, but the one I listed gives quite a good overview.
Once you understand how to implement a Restful API, look at any tutorial on backbone.js that integrates with a server application. Just substitute your api with the tutorial's api and you should be in business. Read this book, it is priceless and contains brilliant examples on how to implement a backbone.js application locally and with a server.
On a side note, MVC 4's Web API integrates perfectly with backbone. Have a look at a plugin developed by Addy Osmani, Backbone.Paginator. It helps make filtering, pagination, skip, sort etc extremely easy with MVC 4's Web API and odata filters.
After learning Backbone.js and using it on a few projects, I've found that most of my time is spent figuring out how to use it, and not what my backend is doing. In terms of ASPMVC, you setup a few controller actions that return JSON.
Rob Connery uses Backbone.js with MVC3 in his series Real-World ASP.NET MVC3 on Tekpub.
Episode 6 - BackboneJS - is spent entirely introducing you to backbone and ASPMVC3 integration. Unfortunately, you must purchase the entire series for $32 and it helps to watch the whole thing to get a sense for whats being built. Further, I don't agree with the way he approaches everything in the videos but his use and description of Backbone.js is very helpful if you are new.
DocumentCloud (the project from which Backbone.js emerged) maintains a page entitled Tutorials, blog posts and example sites. They don't always list the backends used so you may have to browse all the links to see if you find anything.
This is quick little tutorial from real-world experience, basically wiring a backbone application to some ASPMVC endpoints.
Finally, here is a recent post on Microsoft's own ASP.NET Weblogs called "Integrating Backbone.js with ASP.NET Web API".

Categories