<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>React JS Components &#8211; MaXEster Technologies  | Technical Blog</title>
	<atom:link href="https://www.maxester.com/blog/tag/react-js-components/feed/" rel="self" type="application/rss+xml" />
	<link>https://www.maxester.com/blog</link>
	<description>Tutorials, Examples and Implementation code for Developers Help</description>
	<lastBuildDate>Mon, 17 Feb 2025 09:17:48 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>https://wordpress.org/?v=5.0.22</generator>
	<item>
		<title>What is Components in React JS?</title>
		<link>https://www.maxester.com/blog/2023/12/08/what-is-components-in-react-js/</link>
		<comments>https://www.maxester.com/blog/2023/12/08/what-is-components-in-react-js/#respond</comments>
		<pubDate>Fri, 08 Dec 2023 11:18:02 +0000</pubDate>
		<dc:creator><![CDATA[Mayank Jha]]></dc:creator>
				<category><![CDATA[React Js]]></category>
		<category><![CDATA[React JS Components]]></category>

		<guid isPermaLink="false">https://www.maxester.com/blog/?p=1151</guid>
		<description><![CDATA[<p>What is component? Components in React JS are the basic building blocks, which are used to create the UI. Using components we can divide the whole website in multiple parts, which make the code debugging and maintenance a lot easier.&#8230;</p>
<p><a href="https://www.maxester.com/blog/2023/12/08/what-is-components-in-react-js/" class="btn-more">Read More<span class="arrow-more">&#8594;</span></a></p>
<p>The post <a rel="nofollow" href="https://www.maxester.com/blog/2023/12/08/what-is-components-in-react-js/">What is Components in React JS?</a> appeared first on <a rel="nofollow" href="https://www.maxester.com/blog">MaXEster Technologies  | Technical Blog</a>.</p>
]]></description>
				<content:encoded><![CDATA[
<h3>What is component?</h3>



<p>Components in React JS are the basic building blocks, which are used to create the UI. Using components we can divide the whole website in multiple parts, which make the code debugging and maintenance a lot easier.</p>



<p>In simpler terms we can divide the whole website in parts, like a main header, a footer, a contact page and a homepage.</p>



<p>React JS will only update the component or part of the website which are changed. Components are of two types, Class based components and Function based components. Nowadays class based components are not used much, due to the easier function based approach.</p>



<p>Example :-</p>



<figure class="wp-block-image"><img src="https://www.maxester.com/blog/wp-content/uploads/2023/12/header.png" alt="" class="wp-image-1152" srcset="https://www.maxester.com/blog/wp-content/uploads/2023/12/header.png 858w, https://www.maxester.com/blog/wp-content/uploads/2023/12/header-300x101.png 300w, https://www.maxester.com/blog/wp-content/uploads/2023/12/header-768x258.png 768w" sizes="(max-width: 858px) 100vw, 858px" /><figcaption>Header<br></figcaption></figure>



<figure class="wp-block-image"><img src="https://www.maxester.com/blog/wp-content/uploads/2023/12/main.png" alt="" class="wp-image-1153" srcset="https://www.maxester.com/blog/wp-content/uploads/2023/12/main.png 503w, https://www.maxester.com/blog/wp-content/uploads/2023/12/main-300x100.png 300w" sizes="(max-width: 503px) 100vw, 503px" /><figcaption>Body</figcaption></figure>



<figure class="wp-block-image"><img src="https://www.maxester.com/blog/wp-content/uploads/2023/12/footer.png" alt="" class="wp-image-1154" srcset="https://www.maxester.com/blog/wp-content/uploads/2023/12/footer.png 705w, https://www.maxester.com/blog/wp-content/uploads/2023/12/footer-300x71.png 300w" sizes="(max-width: 705px) 100vw, 705px" /><figcaption>Footer</figcaption></figure>



<figure class="wp-block-image"><img src="https://www.maxester.com/blog/wp-content/uploads/2023/12/website.png" alt="" class="wp-image-1155" srcset="https://www.maxester.com/blog/wp-content/uploads/2023/12/website.png 566w, https://www.maxester.com/blog/wp-content/uploads/2023/12/website-300x83.png 300w" sizes="(max-width: 566px) 100vw, 566px" /><figcaption>Output</figcaption></figure>



<p><strong>Note :</strong> It is not necessary to use the components, but it makes the maintenance easier.</p>
<p>The post <a rel="nofollow" href="https://www.maxester.com/blog/2023/12/08/what-is-components-in-react-js/">What is Components in React JS?</a> appeared first on <a rel="nofollow" href="https://www.maxester.com/blog">MaXEster Technologies  | Technical Blog</a>.</p>
]]></content:encoded>
			<wfw:commentRss>https://www.maxester.com/blog/2023/12/08/what-is-components-in-react-js/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
