<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: JJohnson45</title>
    <description>The latest articles on DEV Community by JJohnson45 (@jjohnson45).</description>
    <link>https://dev.to/jjohnson45</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F284346%2F317aa345-f14f-4985-906d-9711403a85e2.jpeg</url>
      <title>DEV Community: JJohnson45</title>
      <link>https://dev.to/jjohnson45</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/jjohnson45"/>
    <language>en</language>
    <item>
      <title>Creating a pdf.file using react</title>
      <dc:creator>JJohnson45</dc:creator>
      <pubDate>Mon, 23 Mar 2020 16:30:37 +0000</pubDate>
      <link>https://dev.to/jjohnson45/creating-a-pdf-file-using-react-1lgj</link>
      <guid>https://dev.to/jjohnson45/creating-a-pdf-file-using-react-1lgj</guid>
      <description>&lt;p&gt;Assuming your a mid level software developer, you know that react components are separated code that is better transmitted across UI and even through many other projects. This blog will discuss how to create a PDF component for your one of your projects.&lt;/p&gt;

&lt;p&gt;Step 1 - Install Dependencies&lt;br&gt;
First of all, I need an environment to create our component in. For this example I will be using create-react-app to generate a project. Navigate to an empty directory and run the following command:&lt;/p&gt;

&lt;p&gt;npm i create-react-app --save-dev&lt;/p&gt;

&lt;p&gt;Step 2 - Create the Project&lt;br&gt;
Use the following commands to generate your React project:&lt;/p&gt;

&lt;p&gt;npx create-react-app my-app&lt;br&gt;
cd my-app&lt;br&gt;
This will install React and any other dependencies you need.&lt;/p&gt;

&lt;p&gt;Now you can start your local server by running:&lt;br&gt;
npm run start&lt;/p&gt;

&lt;p&gt;Navigate to &lt;a href="http://localhost:3000/"&gt;http://localhost:3000/&lt;/a&gt; and you should see the default create react-app welcome screen.&lt;/p&gt;

&lt;p&gt;Step 3 - Project Setup&lt;br&gt;
Next I need to set up our project.  Start by clearing the templates that create-react-app provides. Navigate to src/App.js and delete all the code inside the render function, except the outer div. The file should now contain:&lt;/p&gt;

&lt;p&gt;import React, { Component } from 'react';&lt;br&gt;
import './App.css';&lt;br&gt;
class App extends Component {&lt;br&gt;
  render() {&lt;br&gt;
    return (&lt;br&gt;
      &lt;/p&gt;
&lt;br&gt;
      );}}

&lt;p&gt;export default App;&lt;/p&gt;

&lt;p&gt;Now I need to create our PDF viewing component. Let’s create the file src/components/PDFViewer/PDFViewer.js and start by writing a basic React component.&lt;/p&gt;

&lt;p&gt;import React from 'react';&lt;br&gt;
export default class PDFViewer extends React.Component {&lt;/p&gt;

&lt;p&gt;render() {&lt;br&gt;
    return (&lt;br&gt;
      &lt;/p&gt;
&lt;br&gt;
        Hello world!&lt;br&gt;
      &lt;br&gt;
    )&lt;br&gt;
  }&lt;br&gt;
}

&lt;p&gt;Now, back in App.js, lets import this component and render it. App.js should now look like this:&lt;/p&gt;

&lt;p&gt;import React, { Component } from 'react';&lt;br&gt;
import './App.css';&lt;br&gt;
import PDFViewer from './components/PDFViewer/PDFViewer';&lt;/p&gt;

&lt;p&gt;class App extends Component {&lt;br&gt;
  render() {&lt;br&gt;
    return (&lt;br&gt;
      &lt;/p&gt;
&lt;br&gt;
        &lt;br&gt;
      &lt;br&gt;
    );&lt;br&gt;
  }&lt;br&gt;
}

&lt;p&gt;export default App;&lt;/p&gt;

&lt;p&gt;If you take a look at &lt;a href="http://localhost:3000"&gt;http://localhost:3000&lt;/a&gt; , you should see a little “Hello world!” on a white background.&lt;/p&gt;

&lt;p&gt;Step 4 - Defining Our Backend&lt;br&gt;
when creating your first backend that renders a PDF using pdf.js. Create the file src/backends/pdfjs.js and export a class that contains an init function.&lt;/p&gt;

&lt;p&gt;export default class PDFJs {&lt;br&gt;
  init = () =&amp;gt; {&lt;/p&gt;

&lt;p&gt;}&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;Let’s make the init function accept both of these things as parameters.&lt;/p&gt;

&lt;p&gt;export default class PDFJs {&lt;br&gt;
  init = (source, element) =&amp;gt; {&lt;/p&gt;

&lt;p&gt;}&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;In App.js, import the pdfjs.js backend and pass it as a prop to our PDFViewer component. We’re also going to need a PDF source, so lets pass that as well. App.js should now look something like this:&lt;/p&gt;

&lt;p&gt;import React, { Component } from 'react';&lt;br&gt;
import './App.css';&lt;br&gt;
import PDFViewer from './components/PDFViewer/PDFViewer';&lt;br&gt;
import PDFJSBackend from './backends/pdfjs';&lt;/p&gt;

&lt;p&gt;class App extends Component {&lt;br&gt;
  render() {&lt;br&gt;
    return (&lt;br&gt;
      &lt;/p&gt;
&lt;br&gt;
        
          backend={PDFJSBackend}&lt;br&gt;
          src='/myPDF.pdf'&lt;br&gt;
        /&amp;gt;&lt;br&gt;
      &lt;br&gt;
    );&lt;br&gt;
  }&lt;br&gt;
}

&lt;p&gt;export default App;&lt;/p&gt;

&lt;p&gt;Now in our PDFViewer component, lets implement the backends init function. First we start by creating an instance of the backend and storing it to the component.&lt;/p&gt;

&lt;p&gt;import React from 'react';&lt;/p&gt;

&lt;p&gt;export default class PDFViewer extends React.Component {&lt;br&gt;
  constructor(props) {&lt;br&gt;
    super(props);&lt;br&gt;
    this.viewerRef = React.createRef();&lt;br&gt;
    this.backend = new props.backend();&lt;br&gt;
  }&lt;/p&gt;

&lt;p&gt;render() {&lt;br&gt;
    return (&lt;br&gt;
      &lt;/p&gt;

&lt;pre class="highlight plaintext"&gt;&lt;code&gt;  &amp;lt;/div&amp;gt;
)
&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;}&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;No pass it a reference to the #viewer div , as well as the PDF source. We can also remove the "Hello world" from the render function while we're at it. PDFViewer.js should now look like this:&lt;/p&gt;

&lt;p&gt;import React from 'react';&lt;/p&gt;

&lt;p&gt;export default class PDFViewer extends React.Component {&lt;br&gt;
  constructor(props) {&lt;br&gt;
    super(props);&lt;br&gt;
    this.viewerRef = React.createRef();&lt;br&gt;
    this.backend = new props.backend();&lt;br&gt;
  }&lt;/p&gt;

&lt;p&gt;componentDidMount() {&lt;br&gt;
    const { src } = this.props;&lt;br&gt;
    const element = this.viewerRef.current;&lt;/p&gt;

&lt;pre class="highlight plaintext"&gt;&lt;code&gt;this.backend.init(src, element);
&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;}&lt;/p&gt;

&lt;p&gt;render() {&lt;br&gt;
    return (&lt;br&gt;
      &lt;/p&gt;

&lt;pre class="highlight plaintext"&gt;&lt;code&gt;  &amp;lt;/div&amp;gt;
)
&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;}&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;The final step is making our init function  do something. Lets test it out by making it render some text.&lt;/p&gt;

&lt;p&gt;export default class PDFJs {&lt;br&gt;
  init = (source, element) =&amp;gt; {&lt;br&gt;
    const textNode = document.createElement('p');&lt;br&gt;
    textNode.innerHTML = &lt;code&gt;Our PDF source will be: ${source}&lt;/code&gt;;&lt;/p&gt;

&lt;pre class="highlight plaintext"&gt;&lt;code&gt;element.appendChild(textNode);
&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;}&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;&lt;a href="http://localhost:3000"&gt;http://localhost:3000&lt;/a&gt; should now display "Our PDF source will be: /myPDF.pdf".&lt;/p&gt;

&lt;p&gt;Step 5 - Implementing pdf.js&lt;br&gt;
We will start by using the open sourced pdf.js library to render a PDF. Download the library from &lt;a href="https://mozilla.github.io/pdf.js/getting_started/#download"&gt;https://mozilla.github.io/pdf.js/getting_started/#download&lt;/a&gt; and extract the contents inside the public folder of our project.&lt;/p&gt;

&lt;p&gt;src/backends/pdfjs.js should now look like this:&lt;/p&gt;

&lt;p&gt;export default class PDFJs {&lt;br&gt;
  init = (source, element) =&amp;gt; {&lt;br&gt;
    const iframe = document.createElement('iframe');&lt;/p&gt;

&lt;pre class="highlight plaintext"&gt;&lt;code&gt;iframe.src = `/pdfjs-1.9.426-dist/web/viewer.html?file=${source}`;
iframe.width = '100%';
iframe.height = '100%';

element.appendChild(iframe);
&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;}&lt;br&gt;
}&lt;/p&gt;

&lt;p&gt;If you check out &lt;a href="http://localhost:3000"&gt;http://localhost:3000&lt;/a&gt;, you should see your PDF displayed inside the pdf.js viewer.&lt;/p&gt;

</description>
      <category>react</category>
      <category>reactnative</category>
      <category>javascript</category>
    </item>
    <item>
      <title>Artificial Intelligence</title>
      <dc:creator>JJohnson45</dc:creator>
      <pubDate>Mon, 16 Mar 2020 13:25:43 +0000</pubDate>
      <link>https://dev.to/jjohnson45/artificial-intelligence-2kmm</link>
      <guid>https://dev.to/jjohnson45/artificial-intelligence-2kmm</guid>
      <description>&lt;p&gt;Artificial Intelligence (AI) is a branch of Science which deals with helping machines find solutions to complex problems in a more human-like fashion. The interdisciplinary field of cognitive science brings together&lt;br&gt;
computer models from AI and experimental techniques from psychology to construct precise and testable theories of the human mind. This generally involves borrowing characteristics from human intelligence, and applying them as algorithms in a computer friendly way. A more or less flexible or efficient approach can be taken depending on the&lt;br&gt;
requirements established, which influences how artificial the intelligent behavior appears. Artificial intelligence can be viewed from a variety of perspectives. From the perspective of intelligence&lt;br&gt;
artificial intelligence is making machines "intelligent" -- acting as we would expect people to act. The inability to distinguish computer responses from human responses is called the Turing test. Intelligence requires knowledge expert problem solving - restricting domain to allow including significant relevant knowledge.&lt;/p&gt;

&lt;p&gt;From a programming perspective, AI includes the study of symbolic&lt;br&gt;
programming, problem solving, and search.&lt;br&gt;
o Typically AI programs focus on symbols rather than numeric&lt;br&gt;
processing.&lt;br&gt;
o Problem solving - achieve goals.&lt;br&gt;
o AI programming languages include:&lt;br&gt;
– LISP, developed in the 1950s, is the early programming language&lt;br&gt;
strongly associated with AI. LISP is a functional programming language with procedural extensions. LISP (LISt Processor) was specifically designed for processing heterogeneous lists -- typically a list of symbols. &lt;/p&gt;

&lt;p&gt;Features of LISP&lt;br&gt;
are run- time type checking, higher order functions (functions that have other functions as parameters), automatic memory management (garbage collection) and an interactive environment. Also, Object-oriented languages are a class of languages more recently used for AI programming. Important features of object-oriented languages include: concepts of objects and messages, objects bundle data and methods for manipulating the data, sender specifies what is to be done receiver decides how to do it, inheritance (object hierarchy where objects inherit the attributes of the more general class of objects). Examples of object-oriented languages are Smalltalk, Objective C, C++. &lt;/p&gt;

&lt;p&gt;Artificial Intelligence is a new electronic machine that stores large amount of information and process it at very high speed. The computer is interrogated by a human via a teletype It passes if the human cannot&lt;br&gt;
tell if there is a computer or human at the other end. The ability to solve problems. It is the science and engineering of making intelligent machines, especially intelligent computer programs. It is related to the similar task of using computers to understand human intelligence.&lt;/p&gt;

&lt;p&gt;Importance of AI&lt;br&gt;
Game Playing&lt;br&gt;
You can buy machines that can play master level chess for a few hundred dollars. There is some AI in them, but they play well against people mainly through brute force computation--looking at hundreds of thousands of positions. To beat a world champion by brute force and known reliable heuristics requires being able to look at 200 million positions per second.&lt;/p&gt;

&lt;p&gt;Speech Recognition&lt;br&gt;
In the 1990s, computer speech recognition reached a practical level for limited purposes. Thus United Airlines has replaced its keyboard tree for flight information by a system using speech recognition of flight numbers and city names. It is quite convenient. On the other hand, while it is possible to instruct some computers using speech, most users have gone back to the keyboard and the mouse as still more convenient.&lt;/p&gt;

&lt;p&gt;Understanding Natural Language&lt;br&gt;
Just getting a sequence of words into a computer is not enough. Parsing sentences is not enough either. The computer has to be provided with an understanding of the domain the text is about, and this is presently possible only for very limited domains.&lt;br&gt;
 The world is composed of three-dimensional objects, but the inputs to the human eye and computers' TV cameras are two dimensional. Some useful programs can work solely in two dimensions, but full computer vision requires partial three-dimensional information that is not just a set of two-dimensional views. At present there are only limited ways of representing three-dimensional information directly, and they are not&lt;br&gt;
as good as what humans evidently use. &lt;/p&gt;

</description>
    </item>
    <item>
      <title>Redux</title>
      <dc:creator>JJohnson45</dc:creator>
      <pubDate>Mon, 09 Mar 2020 12:46:04 +0000</pubDate>
      <link>https://dev.to/jjohnson45/redux-4pg0</link>
      <guid>https://dev.to/jjohnson45/redux-4pg0</guid>
      <description>&lt;p&gt;Redux is a JavaScript library for application state management. Redux-Saga is a  middleware  from the Redux library that allows for the application side effects to be easier to manage, control, and test. The architectural model describes the control flow in the system. While separation of concerns is achieved through a modular structure. Modeling the use cases of the system as sagas makes them more readable and supports automated testing. The implementation of the architecture is described through code listings. One of the most important attributes of a software codebase is the readability of the code. When we're talking about a software project that lasts for many years and has a large amount of developers working on it the readability of the code will have a important effect on the speed and quality of the development effort. Developers are constantly reading old code when they are developing new code. Managing the application state and control flow properly has a huge impact on the readability. If the codebase and the flow of control in the application is easy to follow and understand for the developers, then developing new features or fixing existing bugs will be faster and less error prone. &lt;/p&gt;

&lt;p&gt;Architectural complexity has detrimental effects on development productivity. Reducing the complexity of the software will also definitely help alleviate the burden on the developers allowing them to be more productive as well as less frustrated in&lt;br&gt;
their work. And of course, all the time saved on development work can be directly mapped to cost savings as well. It is important to be able to automatically test as many parts of a system as possible. &lt;br&gt;
New technologies, techniques and tools are constantly being introduced for handling common challenges in the field of software development field. So, most of the time there will be a very limited amount of research available. In Redux-saga 8 introduces a new kind of a pattern for handling application side-effects and flows. Proper state management is vital for keeping track of all the data in your application. Failing&lt;br&gt;
to do so will most likely result in some kind of problems during the development of the software. Some of the most common problems are issues with duplicate and out-of-sync data. Letting the application to get into that kind of a state will increase the effort it takes to maintain the software and it will most likely also introduce bugs along the way. It is hard work to try to manage multiple instances of a single piece of data and developers – being human – tend to miss some of the instances when making modifications to the codebase. Worst case scenario is that you might end up with presenting or storing wrong data if there are multiple instances of the supposedly same piece of data. &lt;/p&gt;

&lt;p&gt;You can keep your application much simpler if you take care and make sure there is a single source of truth for the data. A successful software project must focus on the needs of a customer. There are different&lt;br&gt;
ways of modeling out the domain to make sure you are truly developing something that produces value for the customer. Good architecture should be one that enables the use of different domain models and supports the developers in implementing the required features and use&lt;br&gt;
cases. In other words, the architecture should provide a proper way for handling pieces of the application logic and use case workflows. &lt;/p&gt;

</description>
      <category>redux</category>
      <category>react</category>
      <category>javascript</category>
    </item>
    <item>
      <title>BackBone Js</title>
      <dc:creator>JJohnson45</dc:creator>
      <pubDate>Mon, 10 Feb 2020 15:17:59 +0000</pubDate>
      <link>https://dev.to/jjohnson45/backbone-js-1iko</link>
      <guid>https://dev.to/jjohnson45/backbone-js-1iko</guid>
      <description>&lt;p&gt;Let's assume you're a skilled JavaScript front-end developer or just diving into  the world of frameworks, you've definitely heard of Backbone.js. Backbone.js is a outdated but still useful and unique framework. This blog post is here to give you an insight on Backbone.js. After reading this guide, you should learn what this framework is, it's features and how to get started.&lt;/p&gt;

&lt;p&gt;Backbone.js, often referred to as Backbone, is an open-source JavaScript library aimed to provide a structure to client-side web applications based on the Model-View-Controller (MVC) design pattern. This allows for communication between the client and server to be carried out through restful API's.&lt;/p&gt;

&lt;p&gt;Web applications used to be static HTML pages and required programmers to change the HTML, CSS and JS code just to make its changes in the content. But with advancement of server-side programming languages, these static HTML pages have became dynamic. Therefore, most web applications use this approach today.&lt;/p&gt;

&lt;p&gt;However, there is a main problem with this approach. It's the heavy use of JavaScript, that makes the application code extremely difficult to organize and maintain. That’s where Backbone.js fixes the problem. It provides developers a more organized approach to build JavaScript-heavy web applications.&lt;/p&gt;

&lt;p&gt;Backbone models contain data for an application as well as the logic around this data. Models can be created by extending Backbone.Model&lt;/p&gt;

&lt;p&gt;The initialize() method is called when a new instance of a model is created.&lt;/p&gt;

&lt;p&gt;Model.get() provides easy access to a model’s attributes.&lt;/p&gt;

&lt;p&gt;Model.set() sets a hash containing one or more attributes on the model. When any of these attributes alter the state of the model, a “change” event is triggered on it.&lt;/p&gt;

&lt;p&gt;Backbone views are used to reflect what your applications' data models look like. They are also used to listen to events and react accordingly.&lt;br&gt;
Views in Backbone don’t contain the HTML for your application.&lt;br&gt;
Instead, they contain the logic behind the presentation of the data to the user. A view’s render() method can be bound to a model’s change() event. Allowing for the view to instantly reflect model changes without requiring a full page refresh.&lt;/p&gt;

&lt;p&gt;Controller.extend() can be used to do class inheritance. So your controllers(collections) are able to share functionality from their parent controller(collections).&lt;/p&gt;

&lt;p&gt;Collections have many methods suchAs:&lt;br&gt;
add (model, collection, options)&lt;br&gt;
remove (model, collection, options)&lt;br&gt;
reset (collection, options)&lt;br&gt;
sort (collection, options)&lt;/p&gt;

&lt;p&gt;Backbone collections are simply an ordered set of models. Such that it can be used in situations such as;&lt;/p&gt;

&lt;p&gt;Model: Student, Collection: ClassStudents&lt;br&gt;
Model: Todo Item, Collection: Todo List&lt;br&gt;
Model: Animal, Collection: Zoo&lt;br&gt;
Typically your collection will only use one type of model but models themselves are not limited to a type of collection;&lt;/p&gt;

&lt;p&gt;Model: Student, Collection: Gym Class&lt;br&gt;
Model: Student, Collection: Art Class&lt;br&gt;
Model: Student, Collection: English Class&lt;/p&gt;

&lt;p&gt;Normally, when creating a collection you’ll want to define a property specifying the type of model that your collection will contain, along with any instance properties required.&lt;br&gt;
Creating a backbone collection is similar to creating a model. We just need to extend the backbone’s collection class to create our own collection.&lt;br&gt;
var HorseCollection = Backbone.Collection.extend({});&lt;/p&gt;

&lt;p&gt;This collection will hold the Horse model we have created in our previous articles.&lt;/p&gt;

&lt;p&gt;Specifying the model for a collection.&lt;/p&gt;

&lt;p&gt;To specify which model this collection should hold, we need to specify/override the model property of the collection class.&lt;/p&gt;

&lt;p&gt;var HorseCollection = Backbone.Collection.extend({&lt;br&gt;
model: Horse,&lt;br&gt;
});&lt;/p&gt;

&lt;p&gt;Once we specify the model property of a collection what will happen internally is that whenever we create this collection, internally it will create an array of the specified models. Then all the operations on this collection object will result in the actual operations on that array.&lt;/p&gt;

&lt;p&gt;Instantiating a collection.&lt;/p&gt;

&lt;p&gt;A collection can be instantiated by using the new keyword. We can create an empty collection and then add the model objects to it later or we can pass a few model objects in the collection while creating it.&lt;/p&gt;

&lt;p&gt;var collection1 = new HorseCollection();&lt;br&gt;
//pre-populated collection&lt;br&gt;
var Horse1 = new Horse({ color: Black, HorseName: "Tony" });&lt;br&gt;
var Horse2 = new Horse({ color: Tan, HorseName: "Ralph" });&lt;br&gt;
var collection2 = new HorseCollection([Horse1, Horse2]);&lt;/p&gt;

&lt;p&gt;Adding items to the collection.&lt;/p&gt;

&lt;p&gt;To add an item to a collection, we can use the add method on the collection.&lt;/p&gt;

&lt;p&gt;var Horse3 = new Horse({ color: white, HorseName: "Ally" });&lt;br&gt;
collection2.add(Horse3);&lt;br&gt;
Now there might be a scenario where we actually want to update an existing added model in a collection. If that is the case, then we need to pass the {merge: true} option in the add function.&lt;/p&gt;

&lt;p&gt;var horse3_changed = new Horse({ color: brown, HorseName: "Changed Horse"});&lt;/p&gt;

&lt;p&gt;collection2.add(horse3_changed, { merge: true });&lt;/p&gt;

&lt;p&gt;Also, if we want to add multiple models, we can do that by passing the model array in the add method.&lt;/p&gt;

&lt;p&gt;var horse4 = new Horse({ color: black, HorseName: "Christina" });&lt;br&gt;
var horse5 = new Horse({ color: brown, HorseName: "Meg" });&lt;br&gt;
collection2.add([horse4, horse5]);&lt;/p&gt;

&lt;p&gt;It is also possible to add the model at a specific index in the collection. To do this we need to pass the {at: location} in the add options.&lt;/p&gt;

&lt;p&gt;var horse6 = new Horse({ color: white, HorseName: "riq" });&lt;br&gt;
collection2.add(horse6, {at:0});&lt;/p&gt;

&lt;p&gt;Removing models from collection&lt;br&gt;
To remove the model from the collection, we just need to call the remove method on the collection. The remove method simply removes this model from the collection.&lt;br&gt;
collection2.remove(Horse6);&lt;/p&gt;

&lt;p&gt;Also, if we want to empty the model, we can call the reset method on the collection.&lt;/p&gt;

&lt;p&gt;collection1.reset();&lt;br&gt;
It is also possible to reset a collection and populate it with new models by passing an array of models in the reset function.&lt;/p&gt;

&lt;p&gt;collection2.reset([horse4, horse5]); // this will reset the collection //and add horse4 and horse5 into it&lt;br&gt;
pop and shift function can also be used to remove model from collection.&lt;/p&gt;

&lt;p&gt;Finding the number of items in collection&lt;/p&gt;

&lt;p&gt;The total number of items in a collection can be found using the length property.&lt;br&gt;
var collection2 = new HorseCollection([horse1, horse2]);&lt;br&gt;
console.log(collection2.length); // prints 2&lt;/p&gt;

&lt;p&gt;Retrieving models from collection&lt;br&gt;
To retrieve a model from a specific location, we can use the at function by passing a 0 based index.&lt;/p&gt;

&lt;p&gt;var horseRecieved = collection2.at(3);&lt;br&gt;
Alternatively, to get the index of a known model in the collection, we can use the indexOf method.&lt;/p&gt;

&lt;p&gt;var index = collection2.indexOf(horseRecieved);&lt;br&gt;
We can also retreive a model from a collection if we know its color or name. this can be done by using the get function.&lt;/p&gt;

&lt;p&gt;var HorseFetchedbyColor = collection2.get(brown); // get the horse with color=brown&lt;br&gt;
If we want to iterate through all the models in a collection, we can simply use the classic for loop or the each function provided by collections which is very similar to the foreach loop of underscore.js.&lt;/p&gt;

&lt;p&gt;for (var i = 0; i &amp;lt; collection2.length; ++i) {&lt;br&gt;
console.log(collection2.at(i).get("HorseName"));&lt;br&gt;
}&lt;br&gt;
collection2.each(function (item, index, all) {&lt;br&gt;
console.log(item.get("HorseName"));&lt;br&gt;
});&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>productivity</category>
    </item>
    <item>
      <title>no sql vs sql</title>
      <dc:creator>JJohnson45</dc:creator>
      <pubDate>Mon, 03 Feb 2020 13:49:32 +0000</pubDate>
      <link>https://dev.to/jjohnson45/no-sql-vs-sql-3om9</link>
      <guid>https://dev.to/jjohnson45/no-sql-vs-sql-3om9</guid>
      <description>&lt;p&gt;A NoSQL is a Non-relational database likely to be more distributed than structured whereas a SQL Database is a Relational Database and a structured one &lt;/p&gt;

&lt;p&gt;You might ask what exactly mean Relational Database?&lt;br&gt;
Relational database strictly is where the set of rows and columns to store data often named as tables, but the Non-relational database has a distributed storage which doesn’t require any table structure.&lt;br&gt;
NoSQL databases have a dynamic schema for document type or unstructured data whereas SQL Databases have a well-designed pre-defined schema.&lt;/p&gt;

&lt;p&gt;SQL databases are vertically scalable whereas NoSQL databases are horizontally scalable. You can scale the SQL  databases by expanding the strength of its hardware. Also, when it comes to NoSQL databases you can scale it by expanding the database servers.&lt;/p&gt;

&lt;p&gt;While SQL uses structured query language for defining data, NoSQL uses the collection of documents which is also known as Unstructured Query Language.&lt;/p&gt;

&lt;p&gt;We can easily add the new data in NoSQL without requiring prior steps whereas SQL might require doing some changes like backfilling data, altering schemas.&lt;/p&gt;

&lt;p&gt;Since SQL has a standard interface for handling complex queries, it would be great to deal with complex queries. however, in noSql it’s quite difficult to handle complex queries in NoSQL.&lt;/p&gt;

&lt;p&gt;MySQL, differences between SQL and NoSQL databasesMySQL are compatible for creating both small and large-size applications.&lt;br&gt;
Help you to create a replica of Database to reduce the workload. Increased Scalability. Allow you to divide the databases into small chunks to make use of low-level servers. &lt;/p&gt;

&lt;p&gt;Oracle an object-relational database that helps you to achieve great customer service and reliability. It provides great platform support. Better scalability and Reliable.&lt;/p&gt;

&lt;p&gt;the enhanced Dynamic schema you can improve your data without affecting the existing data.&lt;br&gt;
It provides excellent scalability and high performance.&lt;/p&gt;

&lt;p&gt;It will allow you to access your databases through the web browser.Apache CouchD difference between Sql and Nosql&lt;br&gt;
More flexible and easy replication.&lt;/p&gt;

&lt;p&gt;Also, great support is available for all SQL database. Also a lot of independent developers are there who can help you with SQL database for a very large scale deployments but for some NoSQL database you still have to rely on community support and only limited outside experts are available for setting up and deploying your large scale NoSQL deployments.&lt;/p&gt;

&lt;p&gt;Some examples of SQL databases include PostgreSQL, MySQL, Oracle and Microsoft SQL Server. NoSQL database examples include Redis, RavenDB Cassandra, MongoDB, BigTable, HBase, Neo4j and CouchDB.&lt;/p&gt;

&lt;p&gt;In most cases, All the businesses will lean on both databases. NoSQL database might have high popularity due to its high scalability and speed, but still, there would be a highly inescapable situation for businesses to use the SQL database&lt;/p&gt;

&lt;p&gt;SQL actively protects the integrity of your database by providing ACID compliance. Due to its structured data, you will not require any integrated system support for using various types of data.&lt;br&gt;
Moreover, SQL is the highly preferable option for so many businesses due to its predefined structure and schemas.&lt;br&gt;
Why use NoSQL database?&lt;br&gt;
It’s getting popularity by allowing you to store different data types together and you can easily scale by spreading around multiple servers.&lt;br&gt;
If you are in need of developing an application within a speculated time, then you can go for NoSQL which will speed up your performance with its rapid development phase.&lt;/p&gt;

&lt;p&gt;Everyone will have their own preferences based on the project requirements.If you are in need of NoSQL today, it doesn’t mean that it will be stick on to it all day.&lt;br&gt;
There might be different preferences, distinct requirements to prefer over some other database. &lt;/p&gt;

</description>
    </item>
    <item>
      <title>Vr vs Ar. Which should I choose?</title>
      <dc:creator>JJohnson45</dc:creator>
      <pubDate>Mon, 27 Jan 2020 13:44:54 +0000</pubDate>
      <link>https://dev.to/jjohnson45/vr-vs-ar-which-should-i-choose-1f4n</link>
      <guid>https://dev.to/jjohnson45/vr-vs-ar-which-should-i-choose-1f4n</guid>
      <description>&lt;p&gt;Augmented reality and virtual reality are often confused. Let’s explain both in plain terms and examine some AR and VR use cases.&lt;/p&gt;

&lt;p&gt;Augmented reality (AR) and virtual reality (VR) are often talked about in the same breath . AR and VR do share a lot of commonalities. &lt;/p&gt;

&lt;p&gt;For people who’ve never actually seen an AR or VR device, it's very easy to assume everything is VR.&lt;br&gt;
However, AR and VR today are two distinct thingsVR gets much more coverage.&lt;/p&gt;

&lt;p&gt;Since AR and VR are not one and the same, they require different strategies for implementing these technologies in their organizations. Let's clarify the differences and look at some real-world examples.&lt;/p&gt;

&lt;p&gt;AR vs. VR: Key differences&lt;br&gt;
AR lets the user experience the real world, which has been digitally augmented or enhanced in some way. VR, on the other hand, removes the user from that real-world experience, replacing it with a completely simulated one.&lt;/p&gt;

&lt;p&gt;Because VR requires complete immersion, VR devices shut out the physical world completely. The lens on the smart glasses that deliver AR capabilities, on the other hand, are transparent. Understanding these differences is critical in determining the best use cases for each.&lt;br&gt;
Many people have already experienced virtual reality games, and VR is of growing importance for training and education in fields like medicine, engineering, and the sciences. Some of the world’s leading technology companies — including Microsoft, Sony, Google, Facebook, Apple, and Samsung — are spending heavily to develop VR equipment and applications.&lt;/p&gt;

&lt;p&gt;In its simplest forms, virtual reality is experienced as 3D graphics, images, or 360-degree videos on computers or smartphones running mobile apps. More elaborate VR systems use wraparound computer displays or even entire rooms with high-resolution displays integrated into the walls.&lt;/p&gt;

&lt;p&gt;AR vs. VR use cases&lt;br&gt;
At a high level, AR applications are best suited for use cases where users need to be connected to and present in the real world.  Some AR enterprise solutions include remote assistance, on-the-job training, remote collaboration, and computer-assisted tasks.&lt;/p&gt;

&lt;p&gt;Research has found AR to be well-suited for industrial use cases, particularly workforce training and product maintenance. In particular, companies that are facing knowledge gaps and expertise loss as workers retire are capturing that knowledge and sharing it with less-experienced workers via AR tools.&lt;/p&gt;

&lt;p&gt;Maintenance professionals create AR headsets to record and narrate their tasks – which will then be used to train new workers.&lt;br&gt;
One example: Honeywell is dealing with an aging workforce. Instead of writing out training documents, its maintenance professionals created AR headsets to record and narrate their tasks – which will then be used to train mew workers in a hands-on but digitally assisted way. The company says workers trained in this fashion tend to retain 80 percent of what they’ve learned, compared to 20 to 30 percent when they read a manual.&lt;/p&gt;

&lt;p&gt;VR applications are best suited for simulation or complete immersion: For example remote collaboration with 3D elements, point-of-view training, and virtual tours. The Johnson &amp;amp; Johnson Institute, for example, developed virtual reality software to improve training for orthopedic surgeons and nurses. Walmart uses VR to create both unlikely scenarios (such as weather emergencies) and common ones to give associates a first-hand training experience without disrupting operations.&lt;/p&gt;

&lt;p&gt;During the next three to five years, AR and VR will continue to be applied in different ways. They serve different purposes and offer different value propositions. However, if wearables become more mainstream in the enterprise, these capabilities may converge more with time.&lt;/p&gt;

</description>
    </item>
    <item>
      <title>What is mongoDB and how to get started.</title>
      <dc:creator>JJohnson45</dc:creator>
      <pubDate>Mon, 20 Jan 2020 13:11:41 +0000</pubDate>
      <link>https://dev.to/jjohnson45/what-is-mongodb-and-how-to-get-started-1dgb</link>
      <guid>https://dev.to/jjohnson45/what-is-mongodb-and-how-to-get-started-1dgb</guid>
      <description>&lt;p&gt;In this article I will share how to build Restful API with Nodejs Express MongoDB &lt;/p&gt;

&lt;p&gt;In order to develop and run this restful API, we need Node.js, which is JavaScript runtime installed on our machine. With Node.js comes NPM which is a node package manager that we will use to install other packages like Express needed to develop this API. &lt;br&gt;
Also, we need to have MongoDB installed on the machine. &lt;/p&gt;

&lt;p&gt;MongoDB Installation/Setup&lt;br&gt;
MongoDb is a no-SQL database that stores data in the form of JSON object which is called Document. All Documents are stored in the container called Collection. So first Collection is created and then Document in inserted into it. &lt;/p&gt;

&lt;p&gt;Get Started…&lt;br&gt;
Start with creating project folder.&lt;/p&gt;

&lt;p&gt;$ mkdir webapi&lt;/p&gt;

&lt;p&gt;$ cd webapi&lt;/p&gt;

&lt;p&gt;Now we will start with creating package.json file which is the first building block for Node.js application and holds application configuration and package dependencies details that is required in order to run the application.&lt;/p&gt;

&lt;p&gt;$ npm init --yes&lt;/p&gt;

&lt;p&gt;Install Express, Mongoose and body-parser&lt;/p&gt;

&lt;p&gt;Mongoose is a MondoDB object data modelling package that provides a straight-forward, schema-based solution to model data in the Node.js application. &lt;br&gt;
body-paser is Node.js middleware for parsing incoming request bodies in a middleware before request handlers and is available under the req.body property.&lt;/p&gt;

&lt;p&gt;So install all these packages by running following command in the command window.&lt;/p&gt;

&lt;p&gt;$ npm i express mongoose body-parser –save&lt;/p&gt;

&lt;p&gt;–save option will add entry for these packages in the dependencies section in package.json file for our project.&lt;/p&gt;

&lt;p&gt;Write Code…&lt;br&gt;
Now open the code editor to start writing code. &lt;/p&gt;

&lt;p&gt;Create db.js file and add following code to create and export connection with MongoDB using mongoose.&lt;/p&gt;

&lt;p&gt;const mongoose = require("mongoose");&lt;br&gt;
mongoose.connect(&lt;br&gt;
  "mongodb://localhost:27017/customerDb",&lt;br&gt;
  { useNewUrlParser: true, useUnifiedTopology: true },&lt;br&gt;
  err =&amp;gt; {&lt;br&gt;
    if (!err) console.log("Successfully connect to MondoDB...");&lt;br&gt;
    else&lt;br&gt;
      console.log(&lt;br&gt;
        "Connection to MongoDb failed :" + JSON&lt;br&gt;
         .stringify(err, undefined, 2)&lt;br&gt;
      );&lt;br&gt;
  }&lt;br&gt;
);&lt;/p&gt;

&lt;p&gt;module.exports = mongoose;&lt;/p&gt;

&lt;p&gt;Create index.js file and add following code to create Express server to host our restful API. It will also import mongodb connection from db.js.&lt;br&gt;
const bodyParser = require("body-parser");&lt;br&gt;
const { mongoose } = require("./db");&lt;br&gt;
const customer = require("./Controller/CustomerController");&lt;/p&gt;

&lt;p&gt;const express = require("express");&lt;br&gt;
const app = express();&lt;/p&gt;

&lt;p&gt;//added middleware code&lt;br&gt;
app.use(bodyParser.json());&lt;br&gt;
app.use("/customers", customer);&lt;/p&gt;

&lt;p&gt;const port = process.env.port || 3000;&lt;br&gt;
app.listen(port, () =&amp;gt; {&lt;br&gt;
  console.log(&lt;code&gt;server listening at port :${port}&lt;/code&gt;);&lt;br&gt;
});&lt;br&gt;
Now we need to create object data model to store Customer data in the MongoDB database. So create schema folder and create Customer.js file in it. Add following code to hold Customer model schema and export it as well.&lt;br&gt;
const mongoose = require("mongoose");&lt;/p&gt;

&lt;p&gt;var Customer = mongoose.model("Customer", {&lt;br&gt;
  first_name: String,&lt;br&gt;
  last_name: String,&lt;br&gt;
  gender: String,&lt;br&gt;
  age: Number,&lt;br&gt;
  email: String&lt;br&gt;
});&lt;/p&gt;

&lt;p&gt;module.exports = { Customer };&lt;br&gt;
The last piece of code is to add controller code that will expose our restful API endpoints. So create Controller folder and in it create CustomerController.js file.&lt;/p&gt;

&lt;p&gt;Now add following code for CRUD operations.&lt;/p&gt;

&lt;p&gt;Add following code to handle GET request to fetch the Customers.&lt;br&gt;
router.get("/", (req, resp) =&amp;gt; {&lt;br&gt;
  Customer.find((err, docs) =&amp;gt; {&lt;br&gt;
    if (err)&lt;br&gt;
      console.log(&lt;br&gt;
        "Error while getting customers..." + JSON&lt;br&gt;
         .stringify(err, undefined, 2)&lt;br&gt;
      );&lt;br&gt;
    else resp.send(docs);&lt;br&gt;
  });&lt;br&gt;
});&lt;/p&gt;

&lt;p&gt;To create new Customer, add following code to handle POST request from the client.&lt;br&gt;
router.post("/", (req, resp) =&amp;gt; {&lt;br&gt;
  let cust = new Customer({&lt;br&gt;
    first_name: req.body.first_name,&lt;br&gt;
    last_name: req.body.last_name,&lt;br&gt;
    gender: req.body.gender,&lt;br&gt;
    age: req.body.age,&lt;br&gt;
    email: req.body.email&lt;br&gt;
  });&lt;br&gt;
  cust.save((err, doc) =&amp;gt; {&lt;br&gt;
    if (err)&lt;br&gt;
      console.log(&lt;br&gt;
        "error in saving customers..." + JSON&lt;br&gt;
         .stringify(err, undefined, 2)&lt;br&gt;
      );&lt;br&gt;
    else resp.send(doc);&lt;br&gt;
  });&lt;br&gt;
});&lt;/p&gt;

&lt;p&gt;Launch the API&lt;br&gt;
Now run following command to host our restful API.&lt;/p&gt;

&lt;p&gt;$ node index.js&lt;/p&gt;

&lt;p&gt;It will launch the web server that will host our API available at &lt;a href="http://localhost:3000/Customers"&gt;http://localhost:3000/Customers&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Test the API&lt;br&gt;
Now open the Postman Web API Client application and click on the Create a request to initiate an API request to our restful API.&lt;/p&gt;

&lt;p&gt;Take following steps to test POST request handler to create the Customer.&lt;/p&gt;

&lt;p&gt;Select POST HTTP verb from the drop down.&lt;br&gt;
Enter request URL &lt;a href="http://localhost:3000/Customers"&gt;http://localhost:3000/Customers&lt;/a&gt; for post request.&lt;br&gt;
Select Body tab and then select raw radio button and finally select type JSON from the drop down.&lt;br&gt;
In the request body enter following JSON object representing our Customer resource that we want to create.&lt;br&gt;
{&lt;br&gt;
  "first_name" : "Amit",&lt;br&gt;
  "last_name" : "Patil",&lt;br&gt;
  "gender" : "Male",&lt;br&gt;
  "age" : 39,&lt;br&gt;
  "email" : "&lt;a href="mailto:Amit@gmail.com"&gt;Amit@gmail.com&lt;/a&gt;"&lt;br&gt;
}&lt;/p&gt;

</description>
      <category>javascript</category>
      <category>mongodb</category>
    </item>
    <item>
      <title>MySql? What is it?</title>
      <dc:creator>JJohnson45</dc:creator>
      <pubDate>Mon, 16 Dec 2019 05:04:39 +0000</pubDate>
      <link>https://dev.to/jjohnson45/intro-3c37</link>
      <guid>https://dev.to/jjohnson45/intro-3c37</guid>
      <description>&lt;p&gt;MySQL is an open source relational database management system (RDBMS) with a client-server model. RDBMS is a software used to create and manage databases. The application MySQL is used for a wide range of purposes, including data warehousing, e-commerce, and logging applications. It is most noted for its quick processing, proven reliability, ease and flexibility of use. MySQL is an essential part of almost every open source PHP application.&lt;/p&gt;

&lt;p&gt;For example, WordPress requires MySQL to store and retrieve all of its data including post content, user profiles, and custom post types. Most web hosting providers already have MySQL installed on their web servers as it is widely used in many open source web applications such as WordPress.&lt;/p&gt;

&lt;p&gt;The most common use for mySQL however, is for the purpose of a web database. It can be used to store anything from a single record of information to an entire inventory of available products for an online store. &lt;/p&gt;

&lt;p&gt;Database&lt;br&gt;
A database is simply a collection of structured data. Think of taking a selfie: you push a button and capture an image of yourself. Your photo is data, and your phone’s gallery is the database. A database is a place in which data is stored and organized. The data stored in the dataset is organized as tables. Every table relates in some ways. &lt;/p&gt;

&lt;p&gt;Open source&lt;br&gt;
Open source means that you’re free to use and modify it. Anybody can install the software. You can also learn and customize the source code to better accommodate your needs. However, The GPL (GNU Public License) determines what you can do depending on conditions. The commercially licensed version is available if you need more flexible ownership and advanced support.&lt;/p&gt;

&lt;p&gt;Client-server model&lt;br&gt;
Computers that install and run RDBMS software are called clients. Whenever they need to access data, they connect to the RDBMS server. That’s the “client-server” part.&lt;/p&gt;

&lt;p&gt;MySQL is one of many RDBMS software options. RDBMS and MySQL are often thought to be the same because of MySQL’s popularity. Even though it was initially created for limited usage, now it’s compatible with many important computing platforms like Linux, macOS, Microsoft Windows, and Ubuntu.&lt;/p&gt;

&lt;p&gt;SQL&lt;br&gt;
MySQL and SQL are not the same. Be aware that MySQL is one of the most popular RDBMS software’s brand name, which implements a client-server model. The client and server communicate in an RDBMS environment by using a domain specific language – Structured Query Language (SQL). RDBMS software is often written in other programming languages, but always use SQL as their primary language to interact with the database. MySQL itself is written in C and C++.&lt;/p&gt;

&lt;p&gt;Ted Codd developed SQL in the early 1970s. It became more widely used in 1974 and quickly replaced ISAM and VISAM. SQL tells the server what to do with the data. It is similar to your WordPress password or code. You input it into the system to gain access to the dashboard area. In this case, SQL statements can instruct the server to perform certain operations:&lt;/p&gt;

&lt;p&gt;Data query: requesting specific information from the existing database.&lt;br&gt;
Data manipulation: adding, deleting, changing, sorting, and other operations to modify the data, the values or the visuals.&lt;br&gt;
Data identity: defining data types. This also includes defining a schema or the relationship of each table in the database&lt;br&gt;
Data access control: providing security techniques to protect data, this includes deciding who can view or use any information stored in the database&lt;/p&gt;

</description>
      <category>database</category>
      <category>sql</category>
    </item>
    <item>
      <title>Node JavaScript</title>
      <dc:creator>JJohnson45</dc:creator>
      <pubDate>Mon, 09 Dec 2019 05:28:49 +0000</pubDate>
      <link>https://dev.to/jjohnson45/node-javascript-2pl3</link>
      <guid>https://dev.to/jjohnson45/node-javascript-2pl3</guid>
      <description>&lt;p&gt;Node JavaScript is the system that allows you to utilize the Javascript skills outside of the application. Combined you can create anything code line to HTTP hosts that power active sites. Node.js can generate dynamic page content, can create, open, read, write, delete, and close files on the server. It has the ability to collect form data, as well as add, delete and modify data in your database. There is a difference in how Node.js handles a file request between how PHP or ASP handles a file request. In regards to PHP or ASP, they send the task to the computer's file system and wait while the file system opens then reads the file. Subsequently, they return the content to the client ready to handle the next request.&lt;/p&gt;

&lt;p&gt;How Node.js handles a file request is much more efficient simply because it eliminates the waiting, and simply continues with the next request. It initially sends the task to the computer's file system. Afterward, it is ready to handle the next request. When the file system has opened and read the file, the server returns the content to the client. Running single-threaded, non-blocking, asynchronously programming, making it to be very memory efficient.&lt;/p&gt;

&lt;p&gt;Node was initially believed for the use of making asynchronous programming simple and accessible. JavaScript lends itself well to the structure similar to Node. It is one of those few programming languages that does not get the built-in means to do in- and output production. Therefore, JavaScript would be well onto the Node’s rather eccentric approach to in- and output without turning out with two contradictory interfaces.&lt;/p&gt;

&lt;p&gt;When Node was being designed back in 2009, people were already performing call-back based programming at the application, so the people in the word were accustomed to the asynchronous programming style. This console.log method does something similar to what it does in this browser. It prints out the piece of text. Rather than going to the browser's JavaScript table, in Node the text can go to the process's basic output flow.&lt;/p&gt;

&lt;p&gt;When working node from the command line, this means you find the logged values in your station or terminal. Node is the newest programming language and APIs. It runs with JavaScript but is not JavaScript itself, Node is the system that you consume Javascript. It is so common because you can write the server without learning other methods. With all of its advantages, Node.js now plays a critical role in the technology stack of many high-profile companies who depend on its unique benefits. &lt;/p&gt;

&lt;p&gt;Another big difference is that in Node.js you control the environment. You know which version of Node.js you will run the application on unless you are building an open-source application that anyone can deploy anywhere. This is very convenient Compared to the browser environment, where you don't get the luxury to choose what browser your visitors will use.&lt;/p&gt;

&lt;p&gt;Node.js is a platform built on Chrome's JavaScript runtime for easily building fast, scalable network applications. Using an event-driven, non-blocking I/O model makes it lightweight and efficient, which is perfect for data-intensive real-time applications that run across distributed devices. Event-driven means that the server only reacts when an event occurs. This allows us to create high performance, highly scalable, “real-time” applications.&lt;/p&gt;

</description>
    </item>
    <item>
      <title>Introductory To Angular JS</title>
      <dc:creator>JJohnson45</dc:creator>
      <pubDate>Tue, 03 Dec 2019 17:30:36 +0000</pubDate>
      <link>https://dev.to/jjohnson45/introductory-to-angular-js-4kc5</link>
      <guid>https://dev.to/jjohnson45/introductory-to-angular-js-4kc5</guid>
      <description>&lt;p&gt;As mentioned before frameworks provide a set of guidelines for building your application. Unlike libraries, that are sets of useful functionality that's contained in JavaScript files. AngularJS is an example of a framework that is used for building an application. When you choose a framework it may drive a portion of the application design because certain aspects of the framework needs to be in place for it to function properly. &lt;/p&gt;

&lt;p&gt;Angular JS is commonly referred to as a Single Page Application (SPA). This is because the interaction and application logic all are on one single page. This single page also loads new data and content dynamically. This framework simplifies the process of building single page applications. Some of it's features include data -binding, client-side templating and AJAX wrappers for accessing data. AngularJS was designed to be testable end-to-end. It uses Dependency Injection to make replicating objects simple. It is also designed to encourage you to break the functionality of your application into several smaller, more testable parts.&lt;/p&gt;

&lt;p&gt;AngularJS provides a set of constructs to reduce the amount of code and effort involved in making an application work properly. It's also Model-View-Controller (MVC) framework because it takes a modular approach to building your applications. &lt;/p&gt;

&lt;p&gt;View: In this layer, we have the code related to what the user experiences, with pages and rules related to navigation.&lt;/p&gt;

&lt;p&gt;Controller: This layer is the code that bridges between the navigation and the source of application data, represented by the model layer. Processing and business rules typically belong to this layer.&lt;/p&gt;

&lt;p&gt;Model: In this layer is the code responsible for performing the persistence of the application data.&lt;/p&gt;

&lt;p&gt;Each view is established in HTML. And these Views have a JavaScript controller module and model that drive the interaction. There is a JavaScript file that contains a controller. And in that file there's a specific constructor function that will be used to create the actual controller instance. The purpose of controllers is to create variables and add functionality to expressions and directives.&lt;/p&gt;

&lt;p&gt;There is also an ng-controller directive to the HTML. This directive tells AngularJS that the new InvoiceController is responsible for the element with the directive and all of the element's children. The syntax InvoiceController tells AngularJS to instantiate the controller. And once it was instantiated save it in a variable invoice, that's in the current scope.&lt;/p&gt;

&lt;p&gt;The possible occurrences of that directive are defined in the controller and added to the template using ng-repeat.&lt;/p&gt;

&lt;p&gt;In AngularJS, a service is a function that 's available in your AngularJS application.&lt;/p&gt;

&lt;p&gt;AngularJS has about 30 built-in services. For many services, it seems like you could use objects that are already in the DOM, even though you could it would have some limitations, at least for your AngularJS application.&lt;/p&gt;

&lt;p&gt;AngularJS constantly supervises your application, and for it to handle changes and events properly, AngularJS prefers that you use the built in services. The $http service is one of the most common used services in AngularJS applications. The service makes a request to the server, and lets your application handle the response.&lt;/p&gt;

&lt;p&gt;And so I conclude my post on Angular JS. With it having design flexibility and an easy to use structure, this single page applications model is a powerful tool that every web developer should have in his portfolio. Thanks to everyone who viewed this post. Till next time!&lt;/p&gt;

</description>
      <category>angular</category>
      <category>beginners</category>
      <category>discuss</category>
    </item>
  </channel>
</rss>
