Moving from ExpressJS apps to ElectronJS apps - node.js

I'm trying to understand the transition from Web Apps in Nodejs with Express to making similar apps on the Desktop with ElectronJS.
The thing I can't understand is how you change a view, for instance in Express if I have a basic CRUD app I have an index controller and view and a create thing controller and view, and I can switch between them my clicking links renders in the browser via Express.
How does that work in ElectronJS?
Am I supposed to run Express within Election? Is Electron somehow the Routing framework.. or do I have to drop that way of thinking all-together and use something like AngularJS or ReactJS?

You have to understand why we use express first. It's a server that reads http requests which in ElectronJS doesn't make sense because you can directly communicate via IPC. So, no you don't run express in electron. And think of electron as a packaged nodejs that ships with your app. It's not a routing framework or anything. It's literally nodejs but with the ability to talk to Chromium as it's view where you can write HTML, CSS etc.
And lastly, yes, you can use whatever client library/framework that you'd use on your web app in electron too.

Related

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.

React- Router vs Node.js

I am fairly new to the web development and I am still learning.
I am trying to build a back end for my web application. I am currently using react with redux for my front end. My question is, in order to create a back end do I need to use the react-router or do I have to use a completely different platform like Node.js. Thank you in advance!!
In order to create a backend, you will need to build a server-side application using Node, .NET Core, Java, PHP... and the list goes on. Seems like you're into JS, so Node would likely be your choice. You have a few options, such as embedding your frontend application in views served by your backend, or keeping them separate, like a frontend talking to API endpoints using the Fetch API.
React-router, on the other hand, will allow you to move through the different screens of the single-page app you've created. It won't help you to make API endpoint calls.
So, as you can see, the two things aren't related even though they sound similar. In short, use react-router to navigate around your app, and use the Fetch API (or a component like Axios that has better compatibility for older browsers) to make your API endpoint requests.

Which will be the best way to adapt an web app running in Express to mobile?

I have make a simple web application in express (Node.js) with ejs as a template/view system.
Very simple. For some reasons I need to make that app working on mobile devices just to have some push notifications: chrome notifications works great but some devices (android) have this feature blocked by default also IOS blocks chrome notifications
So the only way is by converting this simple web app into some kind of mobile app. Ionic look's great but you need to adapt your view tags and code..also I don't know if you can combine it with express.
Which will be the best way to adapt an web app running in express to mobile?
I was currently solving the same problem for my new problem you can Convert your Web App to a Mobile App with Apache Cordova , specifically using the Ionic framework, you won't change much on Server side(node.js), however few change as to be made on angular js and very little on view to adapt on ionic design view which very similar to bootstrap tags

How do React & NodeJS work together?

Can you tell me more about the relationship between the two? I want to (for example) write a little tool which plays audio files on my raspberry pi. Would I then do the player and the players interface completely in React, and then just connect to node in order to get the actual files?
Or, more generally but the same thing, if I would want to write an application that does certain things (writes files, records audio, changes system settings etc.) that would all be done in nodejs, but if I want to have an interface I would use something like React?
I am a bit confused, but I hope this question is valid!
Node and React can be used together.
There is even the MERN stack that helps with that:
MERN is a scaffolding tool which makes it easy to build universal apps using Mongo, Express, React and NodeJS. It minimises the setup time and gets you up to speed using proven technologies.
See: http://mernjs.org/
But you can use React with any other Node framework, not only with Express. React can work with any REST API so whatever you use to build a REST API can be consumed by the frontend written in React.
Some other options include: Hapi, Restify, LoopBack. For more see:
http://nodeframework.com/
from the official React Documentation React is "a JavaScript library for build user interfaces". In very watered down terms (and I mean watered down) React could be thought of as a templating library (please don't shoot me for that).
What I've learned about React is it is more like the "V"iew in MVC. It provides you a way to present the user interface using JavaScript and JSX. With the little I know about from various tutorials, I really like working with React.
Yes, this two thinks can work together, I am currently working at such project. I will point out main think here. That is where you put your routing. Does it goes to Node.js server or to React Router. This is important because it defines where you application logic should be.
ReactTS is a scaffolding engine for React on ASP.NET Core. Very powerful, and very fast - will generate your entire application with a single button click. You can also customize the templates. Check it out here... http://bssdev.biz/DevTools/React-Turbo-Scaffolding-Free-Download

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