Posts

Showing posts with the label HTML

ReactJS : Fetching Data From API

Image
 In this article, we'll expand our knowledge of React to further horizons. To get started, check out this article .  Why communicate with server? For any application that stores or access data we need communication with server side. This makes the application more scalable and modifiable. Since React is basically a client-side tool, in this article we'll use tomcat as an Application Program Interface.There are several ways to fetch data from the server . Let's check out some of them. We'll see how to get data of employees of a company stored in JSON form from the API. Sending AJAX Request AJAX stands for Asynchronous JavaScript And XML. It is a way of communicating with the server that helps in a more dynamic display of contents of a web application. Lets's see how it works. In my machine, this is the folder structure :  {..path upto tomcat webapps folder..} / webapps / reactApp > employees.json This is how I stored the data in employees.json :  [{ "id...

Understanding ReactJS, JSX, Babel

Image
If you've been eyeing React for a while now, but haven't found the right foundation to jump from, this is just the place for you. What Is React?      R eact is a JavaScript library which was created by Facebook and is used for building dynamic user interfaces. Using React, we can create complex and interactive UI's by writing small and clear snippets of code in what is called 'components'. We can create different views for each state of our component and they 'render' automatically if state changes. Don't worry, you'll understand better after completing this.  What Is JSX?      JSX stands for JavaScript XML and it is an extension of JavaScript. It makes it easier to write and add HTML elements in React. Ultimately it is translated to JavaScript (in this article, we'll see how). We can write some variable or a JavaScript expression in curly braces({expression}).The value of the variable or the expression after evalu...