Building web,mobile architecture with firebase, angular4 - node.js

We were doing survey like web app in rails framework adding API functionality to support iOS and Android in future.
Recently I learned about firebase and I really liked it. It fits for iOS and Android very well. I am not sure does it fit for web.
My plan is to use Angular4+Ionic+Firebase frameworks to build hybrid app.
Then to build web app using Angular4+Firebase. As far as i know implementing whole business logic in frontend is not secure in N-tier architecture. Because survey results will be calculated in front end.
Simply I want to use firebase for web app:
There are two options for me. Not sure which one is more preferred.
1. Angular4+Firebase
2. Angular4 + Nodejs + Firebase
Can you suggest preferred way to build web app using firebase?

Firebase is a serveless technology, however you can use Firebase Cloud Functions to keep your business rule.

you can use Angular 4 as your Frontend, Node as your backend to create WebApis, and FireBase to store your data as it can work as Realtime Database

Related

How can I create a mobile applications which react that can also serve as a website

I just finished my JavaScript course and I understand pretty well how things work.
I have started my React journey with a project in mind
So I want to create a mobile application using React Native and I also want that same application to be a website with domain and url since I want the website to work with with Google adsense.
I'm a little bit confused about things cause I want to use mysql database, node for back end and React for the front end, but I don't know if this is possible to just create one application that work as both mobile app and a website.
Thank for your assistance and advice in advance.
A way to use practically the same code for a web frontend and mobile app is using tools like Capacitor. It make it quite simple, and also allow you to use some mobile native API's.
Here's how to integrate it with react js Using Capacitor with React

Is MVC in node.js important for deveolping a restful api?

I am learning node.js but I am not interested in web development, I learn it to use as a server or a backend for my mobile apps.
The course I follow includes a module about MVC (Model View Controller) and I want to know if it is important for developing an api using express and then use it in my app or not?
I am a flutter app developer.
If your goal is to develop only a backend without a view then you need not follow the MVC model since you don't need the V in MVC. You can just develop routes in express which call your controllers.

How nodejs work with Angular ? Is it api or something different?

I have a question already search on google but not find a good answer.
What is the job of nodejs & ExpressJS in mean stack development ? Like is it some thing like php to create api and angular will call it ? Or something else
You're exactly right, Node.js is used in MEAN stack to create backend code and APIs that are called from a frontend Angular app.
Angular is the way to create an SPA (Single Page Application).
Wikipedia:
A single-page application (SPA) is a web application or web site that
interacts with the user by dynamically rewriting the current page
rather than loading entire new pages from a server.
ExpressJS
What is Express.js. Express is a fast, assertive, essential and
moderate web framework of Node.js. You can assume express as a layer
built on the top of the Node.js that helps manage a server and routes.
It provides a robust set of features to develop web and mobile applications.
So on top of node-js which is your server side application where you can build your apis that your angular SPA will consume, you have Express JS which is a ready solution to help you.
This way, you will not need to solve problems like routing which have already been solved by the framework in an "optimal" or at least commonly agreed "good enough" way.
There is an excellent answer on express js in stackoverflow here
Yes, you right it is like so. NodeJs is used to create a server, then APIs and Angular call those API from the Front-End.
Detailed Description:
What is NodeJs
You can create a server using NodeJs where you will have a bunch of APIs.
These APIs can be called from an Angular app.
Official Definition: Node.js is a runtime environment that executes JavaScript code outside of a browser. Outside of a browser means Server.
What is ExpressJs
ExpressJS is a prebuilt NodeJS framework that can help you in creating server-side web applications faster and smarter.
Note: It is not necessary to use ExpressJs if you are using NodeJs.
What is Angular
Angular is a framework for building Single Page Application(SAP) web
applications.
SAP means your site does not reload the page when you move from one page to another.
Your Angular app calls NodeJs API.
Angular is a library for building Single Page Applications which (typically) run inside a web browser.
Node.js is a way of running software written in JavaScript outside of a browser. It has many uses.
Software written to run under Node.js — that is strictly relevant to the topics you are asking about — includes:
Build tools used with Angular (converting code is written in ways optimal for developers to edit and debug to ways optimal for delivering to and running in a browser).
Other helper tools for software development (such as #angular/cli which creates a skeleton set of code for an Angular project)
HTTP servers used to provide web services (a type of API) for client applications (which may be written in Angular) to access
Express.js is a library for Node.js which provides prewritten solutions for many of the tasks an HTTP server needs to perform.
You can write many kinds of software in Node.js. I have some code lurking around that loops over all the images in a directory and spits out a PDF of them. It doesn't even go near the Internet.

How can I convert a HTML template into a Node.JS web app

I'm starting out on my Node.JS journey and I discovered a fantastic boilerplate over at https://github.com/azouaoui-med/pro-sidebar-template. I'm unsure though how to turn the static html into a web app. Just wondering how someone with more experience would do this?
Do I take the html and translate it into a PUG template file? I'm guessing to then make the onclick / links actually run some code, i'd need to point them at the routes setup in the web app?
Sorry to ask such inexperienced questions, web apps seem to take a vastly different approach to the desktop apps i'm familiar with programming
I'm wanting to create a web app that runs on a server, which I will later put on the desktop via electron.
thanks
The project you have is using browser-sync which indirectly uses NodeJS to run a local server and host the web application files.
Do I take the HTML and translate it into a PUG template file?
I am not sure about this question unless you specifically want to use server-side rendering I am not sure I would recommend this to start with especially if you plan to later convert this to a desktop application.
[Note* - Assuming you are referencing this library PUGJS in statements above ]
Now For this requirement I'm wanting to create a web app that runs on a server, which I will later put on the desktop via electron.
This will require you to make your data serving layer which is most commonly called backend separate from that of the data viewing layer which is most commonly referred to as front-end. Thus a case for using the same data layer across different types of clients viz. A web application and/or A desktop application ( electron if you choose so )
Step 1 - Define what sort of web application architecture you want to follow or use. This will be based on your project and business requirements. From what information I have so far I would suggest a simple client-server architecture where your frontend or web-application is the client which makes REST API calls to the backend (API Server) and thus produces a meaningful result.
Step 2 - Start with the creation of 2 projects a frontend where your HTML, CSS JS, etc will be and a simple NodeJS script to serve this static web app when deployed on the server. I am going with NodeJS since the context of this question is suggesting the same.
Step 3 - The other project which will only be an API Server or Backend. This server will provide only REST API to the frontend. This server will talk to the database and provide other services like authentication and logging etc. You can use expressJS for this also in the frontend project.
Here is a simplistic representation of the client-server model which you can reference.
Some additional links for you to digest.
What is the difference between a web application and a client/server application?
https://medium.com/codiumclub/web-application-architecture-part-1-guide-to-become-full-stack-developer-cc9526a3519b

Native apps, Web apps communicating with same application server

Hello guys i was learning web developments and have a simple question. If i built a e-commerce web page using node.js and ejs template engine and everything works fine. The next decision is to build a native app for the same e-commerce site either android or IOS. I want the native app to also communicate with the same application server designed in node.js. Do i have to redesign the application server?
My approach or thought:
Native app will have to consume data either xml or json. So i will have to change the business logic of my endpoints. And if i do it this way, i will also have to change the way the web ui interacts with the application server and it also has to consume json or xml response using ajax call. Is my thinking or approach on the right track? But if using node.js, should i avoid the template engines?
Yes, you have to redesign the application server logic by exposing API endpoints. As mobile apps (iOS/Android) will interact with the server using these API endpoints, via JSON. And this will affect your web page also, as everything thing now has to be done via AJAX calls.
Best practice is to built a single page web application using Angular or React.
That way both your mobile app and web app would behave almost the same.

Resources