🚩 Fragment

Fragment

README.md

@@ -203,3 +203,5 @@ export default ClassClick;
 ### [Styling and CSS Basic](https://github.com/SaishJ/React-JS-Beginner-to-Advanced/commit/ac16748caa1423ec10c5f1066c54470e512a6544)
 
 ### [Form Handling](https://github.com/SaishJ/React-JS-Beginner-to-Advanced/commit/4b36f24bf95bfa76b7f8c7fb8599754d4b916ff5)
+
+### [Component Lifecycle Methods](https://github.com/SaishJ/React-JS-Beginner-to-Advanced/commit/bbbbe658941b4920312e960cf7c208125d48ce01)

src/App.js

@@ -15,11 +15,13 @@ import StyleSheet from "./components/StyleSheet";
 import Inline from "./components/Inline";
 import Form from "./components/Form";
 import LifecycleA from "./components/LifecycleA";
+import FragmentsDemo from "./components/FragmentsDemo";
 
 function App() {
   return (
     <div className="App">
-      <LifecycleA />
+      <FragmentsDemo />
+      {/* <LifecycleA /> */}
       {/* <Form /> */}
       {/* <StyleSheet primary={true} /> */}
       {/* <Inline /> */}

src/components/FragmentsDemo.js

@@ -0,0 +1,15 @@
+import React from "react";
+
+function FragmentsDemo() {
+  return (
+    <>
+      <h1>Fragments Demo</h1>
+      <p>This is a Fragment Demo.</p>
+    </>
+  );
+}
+
+export default FragmentsDemo;
+
+/* Fragments:- Groups list of children elements without adding extra nodes to the DoM.
+   <React.Fragment> or <> */