In React there are two ways of creating components:
- Functional components
- Class based components
Functional components seem like simple Javascript functions.
function Name(){
return (
<h1>Kanti</h1>
);
}The above component would display the name “Kanti” in h1 header tag.
class Name extends React.Component
{
render() {
return <h1>Kanti</h1>
}
}The above class based component would also have the same functionality i.e display the name “Kanti” in h1 header tag.
The components can be used in other components by using the following syntax:
<Name />As of now these components aren’t doing anything yet. But SPA frameworks are very useful in code-resuse, specifically when we create re-usable components. Pretty much every SPA framework – AngularJS, Angular, KnockOut, React, Vue etc… supports developing components.
There are several component libraries available for the SPA frameworks.
In future blog posts, I would write on some React based things, concepts such as micro frontends, code re-usability, compare and contrast some SPA frameworks etc…
One of the primary considerations are:
Angular is a framework and provides end to end. React is a front-end library i.e you can use React along with other libraries. Angular is backed by Google.
React can be compiled into static files and hosted or can be rendered on the server (SSR – Server side rendering) using Node. React is backed by Facebook
I have not played around with Vue much, but Vue is also very nice framework and like React, Vue is a library.
In the past (about 7 – 8 years ago) I have played around with AngularJS (the older version) and KnockOut. AngularJS and KnockOut are completely browser based with no SSR.
Modern frameworks, specifically React and Vue support in-browser mode and SSR. For example, you can develop and take advantage of SSR, or you can use in-browser or even a combination of both.
I choose using Cookie based authentication over JWT and React in-browser mode due to certain reasons.
For ease and flexibility, I am using React in one of my projects – Web Veta.
–
Mr. Kanti Kalyan Arumilli
B.Tech, M.B.A
Founder & CEO, Lead Full-Stack .Net developer
ALight Technology And Services Limited
Phone / SMS / WhatsApp on the following 3 numbers:
+91-789-362-6688, +1-480-347-6849, +44-07718-273-964
+44-33-3303-1284 (Preferred number if calling from U.K, No WhatsApp)
kantikalyan@gmail.com, kantikalyan@outlook.com, admin@alightservices.com, kantikalyan.arumilli@alightservices.com, KArumilli2020@student.hult.edu, KantiKArumilli@outlook.com and 3 more rarely used email addresses – hardly once or twice a year.
