Skip to main content

Posts

Internationalisation in Reactjs

Internationalization is a big problem. If you want your application to make a worldwide impact, you have to deal with language barriers. Before your application can succeed outside the English-speaking world, you’ll have to adapt all your strings, dates, and numbers to the conventions of different cultures. Developers call this practice internationalization (which is often abbreviated to “i18n,” because there are 18 letters between the ‘I’ and the ’n’ in the word Internationalization. One of the most important part comes after the development of your application is the languages in which it should get translated according to the users requirement. With the change in the languages will certainly change the format of viewing for the fields like numbers format, currencies ,units etc., The solution to handle all the above barriers is the "i18n". But internationalization doesn’t have to be hard, thanks to a new React library. React-Intl is an open-source project from Yahoo...
6 comments
Read more
Recent posts

Advanced JSX

In this Blog will cover more advanced JSX . You'll learn some powerful tricks, and some common errors to avoid.If you haven't gone through the basic JSX which we have covered i will recommend to go through the JSX blog first and come back to this . Grammar in JSX is mostly the same as in HTML, but there are subtle differences to watch out for. Probably the most frequent of these involves the word class . In HTML, it's common to use class as an attribute name: <h1 class="big">Hey</h1> In JSX , you can't use the word class ! You have to use className instead: <h1 className="big">Hey</h1> This is because JSX gets translated into JavaScript, and class is a reserved word in JavaScript. When JSX is rendered , JSX className attributes are automatically rendered as class attributes. Another JSX 'gotcha' involves self-closing tags . What's a self-closing tag? Most HTML elements use two tags: an openin...
Post a Comment
Read more

Basic JSX

JSX is a preprocessor step that adds XML syntax to JavaScript. You can definitely use React without JSX but JSX makes React a lot more elegant. Just like XML, JSX tags have a tag name, attributes, and children. If an attribute value is enclosed in quotes, the value is a string. Otherwise, wrap the value in braces and the value is the enclosed JavaScript expression. Take a look at the following line of code: var h1 = <h1>Hello world</h1>; What kind of weird hybrid code is that? Is it JavaScript? HTML? Or something else. It seems like it must be JavaScript since it starts with var = and ends with; . If you tried to run that in an HTML file, it wouldn't work. However, the code also contains <h1>Hello World</h1> , which looks exactly like HTML. That part wouldn't work if you tried to run it in a JavaScript file. What's going on? Take another look at the line of code that you wrote. Does this code belong in a JavaScript file, an HTML file, or somewh...
Post a Comment
Read more

Functional Programming in JavaScript

What is Functional Programming? This question can be answered in many ways, let's start with the basics of functional programming. The "Functional Programming" is a one of the "Programming Paradigm" . whereas some other programming paradigms are "Imperative programming" and "Object Oriented Programming". Functional Programming is a paradigm where functions are kings, it is one of the ways in which we can approach any task or the problem. Functional programming (often abbreviated FP) is the process of building software by composing pure functions , avoiding shared state, mutable data , and side-effects . FP is declarative rather than Imperative and application state flows through pure functions . Functional code tends to be more concise, more predictable and easy to understand than the imperative or oop . There are a lot of people and libraries out there to help you out with the functional programming. The idea of functional...
Post a Comment
Read more