I created a web app in mvc 5, using angularjs as controller but the problem is, all my code of my app will be shown if i click on inspect in google chrome, i don't want to show my coding to any user, how can i prevent the user to view my coding,
and is angularjs is less safer then c# and is there any way (by coding) to prevent all the users to view our code in insect element
i know this is not exactly related to coding, but my app has the
transacion related to banks
This is normal with any web application that depends on client side scripting language.
JavaScript should be only used to handle the user interface flow and interactions, the business logic and persistence should be handled in the back end.
You should never trust any data coming from the UI, always validate it before retrieval or saving.
As for the code that is visible, you can always minify the JavaScript files, this will make it at least harder for anyone to inspect and understand the code
Related
I am learning MEAN Stack. I started from learning Angular(from angular.io) now I am learning node.js and express.js
My question is, if there is angular for front end in MEAN Stack then why there are views and template engines in express.js at back-end? Are they alternative for each other or complements each other? what is the boundary for the role and responsibility of these two?
I am looking forward for someone's help in clarifying of my concept for role these two technologies(express' views and angular) used in mean stack.
In order to answer your question, let me explain what is angular and what are template engines in express?
What is Angular?
Angular is a platform that makes it easy to build applications with the web. Angular combines declarative templates, dependency injection, end to end tooling, and integrated best practices to solve development challenges. Angular empowers developers to build applications that live on the web, mobile, or the desktop.
what is template engine?
A template engine enables you to use static template files in your application. At runtime, the template engine replaces variables in a template file with actual values and transforms the template into an HTML file sent to the client. This approach makes it easier to design an HTML page.
Some popular template engines that work with Express are Pug, Mustache, and EJS. The Express application generator uses Jade as its default, but it also supports several others.
So,
Angular is a framework with a templating component baked in. You use it to create Single page Web Applications which means that DOM modification is happening on the client side and the app exchange with server only data. If your concern is template it is plain HTML.
Whereas, template engines' rendered views are sent to client each time by server whenever request is made each time a new page is rendered on server and sent to the client which is Great for static sites but not for rich site interactions.
If there is angular for front-end in MEAN Stack then why there are views and template engines in express.js at back-end?
This is because not every time generating views from angular is recommended sometimes it is better to use Template Engines to generate views and send the rendered page to a client, generating views at client side has its own pros and cons and generating views at server side has its own.
Generating views using template engines (i.e. at server-side):
pros:
Search engines can crawl the site for better SEO.
The initial page load is faster.
Great for static sites.
cons:
Frequent server requests.
An overall slow page rendering.
Full page reloads.
Non-rich site interactions.
Generating views using angular engines (i.e. at client-side):
pros:
Rich site interactions
Fast website rendering after the initial load.
Great for web applications.
Robust selection of JavaScript libraries.
cons:
Low SEO if not implemented correctly.
The initial load might require more time.
In most cases, requires an external library.
So, after knowing the pros and cons, you yourself can better decide that in particular case which one is better for you. Mean Stack has provided options for developers.
As far as your question regarding the role of these two technologies is concerned, Angular is a lot more view generator only, It has features like routing, it as services two-way data binding etc while the template engines are meant to render HTML so that it can be sent to the client.
I hope you will find this answer useful.
References:
what is the template engine?
what is angular?
pros/cons
Angular is a full-fledged front-end framework that comes with its own way of doing templating, using angular-specific markup in your HTML. If you use Angular as your framework, you're more or less stuck with their way of templating within the Angular portion of your application.
Angular Features
It is a framework written in Javascript language
Manages state of models
Integrates with other UI tools
Manipulates DOM
Allows writing custom HTML codes
It is meant for javascript developers to create dynamic web pages in a quick time
NodeJS
It serves the web
It is runtime built on javascript engine in google chrome
It can be considered as a lightweight server which can serve client requests in a more
simpler way than java does
It performs communication operation with databases, web-sockets,
middleware etc.
Why we use angular for Tempting not Express/Node tempting Engine
Server-side rendering is the most common method for displaying information onto the screen. It works by converting HTML files in the server into usable information for the browser.
Whenever you visit a website, your browser makes a request to the server that contains the contents of the website. The request usually only takes a few milliseconds, but that ultimately depends on a multitude of factors:
Your internet speed
how many users are trying to access the site and
how optimized the website is, to name a few
Once the request is done processing, your browser gets back the fully rendered HTML and displays it on the screen. If you then decide to visit a different page on the website, your browser will once again make another request for the new information. This will occur each and every time you visit a page that your browser does not have a cached version of.
It doesn’t matter if the new page only has a few items that are different than the current page, the browser will ask for the entire new page and will re-render everything from the ground up.
How client-side rendering works
When developers talk about client-side rendering, they’re talking about rendering content in the browser using JavaScript. So instead of getting all of the content from the HTML document itself, you are getting a bare-bones HTML document with a JavaScript file that will render the rest of the site using the browser.
This is a relatively new approach to rendering websites, and it didn't really become popular until JavaScript libraries started incorporating it into their style of development.
See Examples HerePratical Example
Basically template engines in Express are mostly used for displaying 404 and other server error messages. I find them ideal for such use cases. Using template engines for complex front end rendering is bad and not a good practice.
Express JS is a web framework on top of nodejs http module. Whereas Angular JS is a front end framework which doesnot depend on NodeJs server to run. Conceptually both are similar in few features like routing whereas implementation is different
We have a website that's running AngularJS 1.*
but one of our main clients are military personnel and they frequently attempt to use the site via Department of Defense computers. These, of course, have javascript disabled.
I've heard of doing server side rendering, but the majority of the examples and research just mention using it for the initial load. We would need the entire site to run off that principle. Essentially acting like an old MVC site. Is this even possible? And I don't mean with just angularJS. Angular 2(5, whatever version we're on now), or react. I just really don't want to back track to .net MVC
Edit: I realize this is, for all intents, a silly question. I was just hoping there was some awesome new tech that had solved the issues that would be present in even attempting this (as stated below, data-binding. I realize this concept completely defeats the purpose of SPAs)
Thanks anyways. I may just delete this question. Didn't have too many expectations to begin with.
This is very possible! Don't let the rest of the people here fool you.
We have a few websites that work just fine with or without JavaScript enabled. My company website https://bitgenics.io is a React app. If you disable your JavaScript the only thing that won't work is the client-side video player.
Now I have no experience with Angular 1 (and I have heard SSR is hard there), but support should be better in the later versions of it.
Getting the GETs to work is the first challenge. But the next one is that you have to have a fallback for your HTTP POSTs. SPAs often use straight REST calls to do any state changes, but you can't do that because it requires JS on the client.
So your forms have to a fallback of a regular FORM post. So you might need some server-side logic to receive these POSTs and respond with a Server-Side Rendered page again.
I was going through React tutorials and on the web I saw a lot about isomorphic React. Just got confused on what it is and how it works.
My understanding is that "isomorphic React" is an application is that it loads all the data required at start-up and then it keeps rendering on the client side as per user's request, holding the complete data in store (Redux architecture).
Now what if I have a scenario like I need to load my complete HTML form using webservice from a 3rd party application where I get the data from it as a json (schema of what fields need to be rendered on the screen) and upon performing some action I need to send the request back so that I will get some other schema to load it as my next screen.
In this scenario how do I use isomorphic, as every time I need to make a server call or an ajax call (which I do not like to do as it might expose the APIs).
So in this case can I say this application as isomorphic or my understanding with regard to isomorphic is completely wrong?
Isomorphic: "corresponding or similar in form or relations".
With regard to web apps, this means that the server is somehow similar to the client - in the sense that the server is capable of rendering as much as the client. In a way, isomorphic web apps are a return to the old paradigm where the server would render data and then send it pre-rendered to the client (think PHP templates or Ruby erb).
Specifically with isomorphic React, this means that the server renders the initial HTML for the client using React components and React.renderToString(). This eliminates double work such as having erb templates on the server side when using Rails but then using Handlebars for client-side templates and also avoid the FOUC. You can just use React for everything.
Now, if you're using a 3rd party service, you'd just use the json data as usual. What would make your app isomorphic or not would be whether your own server uses the same templating engine as your front-end. Any third party services you might consume have no bearing on whether your app is isomorphic or not.
Understand Isomorphic at high level.
Server driven world : In this world, when user open a page in the browser, there are lot of interaction happened between client(browser) and server. In order to load page in the browser, the browser and server go to work by sending request and rendering to provide a webpage to the user. In this world, server was in charge of rendering each page in response to user interaction. For example; if user click on submit button then request goes to server with the data user entered in the form and in response server will return the new HTML with data to the browser to show next screen. Here server is responsible for UI too along with business logic and data model. This approach has many advantage and disadvantage.
Client driven world or Single page application world
In this world, webpage rendering responsibility was handed over to the client (browser) and server was responsible mostly for business logic and data model. This again has lot of advantage and some disadvantage.
Client side and server side rendering world each has its own benefits and 'Isomorphic JavaScript’ is the way to obtain the best of both the worlds.
And React is a framework to provide isomorphic support out of the box.
I was wondering if anyone could help me at all.
I posted a previous question in regards to this title but I didn't receive much of a response (probably due to lack of information).
I started out with an Ionic Application and built the view files using state URLS to navigate from page to page in the WWW folder. I've then created corresponding controllers for the view files, for basic calls and functionality that I want my app to do in the front-end via Ionic.
My question is how do I setup MongoDB + Mongoose so I can have access to the models I have created?
I have scoured the internet but to no avail, I mean I know there is no set way to define a model within this type of application but some general guidance would be really appreciated.
I understand that when building an application with Angular you're essentially building 2 applications, the front-end where your CSS, JS and HTML goes with the front-end frameworks on top of them.
Then the backend application that runs the server, stores data and runs the business logic. This is where I have created the User Schema model for my application and have inserted a document into my database via the MongoDB shell whilst running mongod.
However I also created a users.js in another models folder in my front-end where I'm returning a resource following a url with either a get, save, query, remove or delete.
First of all I would like to say I'm relatively new to building mobile applications so this may even be entirely wrong and secondly up to this point I get lost as to what to do in my application.
I have tried setting up an express server in my app.js file and I can connect to it via my terminal as it is listening on the port number, but in the browser it is coming up with cannot /GET.
If you need any more information please feel free to ask, I know I haven't really gone into any technicals, but I'm really not sure even if I'm asking the right questions to begin with.
Thank you in advance.
I want to build a mid-size application using NodeJS and NW.js (formerly known as node-webkit). The application will grab some data from the internet but isn't talking with one special service which is under my control.
Is it a good idea to use AngularJS nevertheless or is the MVC approach of Angular oversized if there isn't neither a database nor a webservice on the controller layer?
I think Angular would be really fine for databinding and GUI handling, but I'm not sure if it's the right approach for this kind of application.
I see no reason not to use Angular in an nwjs project. I do it myself in the app I just finished building. It's a local-only deck tracking app for hearthstone that never communicates over the internet at runtime. It only ever monitors a log file that is generated by the Hearthstone game. Since the way I'm display information to the user is still technically a web page with a full DOM, Angular makes perfect sense since I'm already comfortable using it.