diff --git a/package-lock.json b/package-lock.json
index f9de16e..b9b858e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,6 +13,7 @@
         "@testing-library/user-event": "^13.5.0",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
+        "react-router-dom": "^6.21.1",
         "react-scripts": "5.0.1",
         "web-vitals": "^2.1.4"
       }
@@ -3353,6 +3354,14 @@
         }
       }
     },
+    "node_modules/@remix-run/router": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.14.1.tgz",
+      "integrity": "sha512-Qg4DMQsfPNAs88rb2xkdk03N3bjK4jgX5fR24eHCTR9q6PrhZQZ4UJBPzCHJkIpTRN1UKxx2DzjZmnC+7Lj0Ow==",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
     "node_modules/@rollup/plugin-babel": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@@ -14909,6 +14918,36 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/react-router": {
+      "version": "6.21.1",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.21.1.tgz",
+      "integrity": "sha512-W0l13YlMTm1YrpVIOpjCADJqEUpz1vm+CMo47RuFX4Ftegwm6KOYsL5G3eiE52jnJpKvzm6uB/vTKTPKM8dmkA==",
+      "dependencies": {
+        "@remix-run/router": "1.14.1"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.8"
+      }
+    },
+    "node_modules/react-router-dom": {
+      "version": "6.21.1",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.21.1.tgz",
+      "integrity": "sha512-QCNrtjtDPwHDO+AO21MJd7yIcr41UetYt5jzaB9Y1UYaPTCnVuJq6S748g1dE11OQlCFIQg+RtAA1SEZIyiBeA==",
+      "dependencies": {
+        "@remix-run/router": "1.14.1",
+        "react-router": "6.21.1"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "peerDependencies": {
+        "react": ">=16.8",
+        "react-dom": ">=16.8"
+      }
+    },
     "node_modules/react-scripts": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz",
@@ -20403,6 +20442,11 @@
         "source-map": "^0.7.3"
       }
     },
+    "@remix-run/router": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/@remix-run/router/-/router-1.14.1.tgz",
+      "integrity": "sha512-Qg4DMQsfPNAs88rb2xkdk03N3bjK4jgX5fR24eHCTR9q6PrhZQZ4UJBPzCHJkIpTRN1UKxx2DzjZmnC+7Lj0Ow=="
+    },
     "@rollup/plugin-babel": {
       "version": "5.3.1",
       "resolved": "https://registry.npmjs.org/@rollup/plugin-babel/-/plugin-babel-5.3.1.tgz",
@@ -28625,6 +28669,23 @@
       "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz",
       "integrity": "sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A=="
     },
+    "react-router": {
+      "version": "6.21.1",
+      "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.21.1.tgz",
+      "integrity": "sha512-W0l13YlMTm1YrpVIOpjCADJqEUpz1vm+CMo47RuFX4Ftegwm6KOYsL5G3eiE52jnJpKvzm6uB/vTKTPKM8dmkA==",
+      "requires": {
+        "@remix-run/router": "1.14.1"
+      }
+    },
+    "react-router-dom": {
+      "version": "6.21.1",
+      "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.21.1.tgz",
+      "integrity": "sha512-QCNrtjtDPwHDO+AO21MJd7yIcr41UetYt5jzaB9Y1UYaPTCnVuJq6S748g1dE11OQlCFIQg+RtAA1SEZIyiBeA==",
+      "requires": {
+        "@remix-run/router": "1.14.1",
+        "react-router": "6.21.1"
+      }
+    },
     "react-scripts": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz",
diff --git a/package.json b/package.json
index 684a599..cb7ac27 100644
--- a/package.json
+++ b/package.json
@@ -8,6 +8,7 @@
     "@testing-library/user-event": "^13.5.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-router-dom": "^6.21.1",
     "react-scripts": "5.0.1",
     "web-vitals": "^2.1.4"
   },
diff --git a/src/App.js b/src/App.js
index 3784575..acb4f9a 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,25 +1,13 @@
-import logo from './logo.svg';
+import React from 'react';
+import Main from './Main';
 import './App.css';
 
 function App() {
   return (
     <div className="App">
-      <header className="App-header">
-        <img src={logo} className="App-logo" alt="logo" />
-        <p>
-          Edit <code>src/App.js</code> and save to reload.
-        </p>
-        <a
-          className="App-link"
-          href="https://reactjs.org"
-          target="_blank"
-          rel="noopener noreferrer"
-        >
-          Learn React
-        </a>
-      </header>
+      <Main />
     </div>
   );
 }
 
-export default App;
+export default App;
\ No newline at end of file
diff --git a/src/Header.js b/src/Header.js
new file mode 100644
index 0000000..37b93f0
--- /dev/null
+++ b/src/Header.js
@@ -0,0 +1,7 @@
+import React from 'react';
+
+function Header() {
+  return <h1>Application Name</h1>;
+}
+
+export default Header;
\ No newline at end of file
diff --git a/src/Main.js b/src/Main.js
new file mode 100644
index 0000000..10cbb97
--- /dev/null
+++ b/src/Main.js
@@ -0,0 +1,14 @@
+import React from 'react';
+import Header from './Header';
+import User from './User';
+
+function Main() {
+  return (
+    <div>
+      <Header />
+      <User />
+    </div>
+  );
+}
+
+export default Main;
\ No newline at end of file
diff --git a/src/User.css b/src/User.css
new file mode 100644
index 0000000..66b40a4
--- /dev/null
+++ b/src/User.css
@@ -0,0 +1,3 @@
+.rounded-image {
+  border-radius: 50%;
+}
\ No newline at end of file
diff --git a/src/User.js b/src/User.js
new file mode 100644
index 0000000..8ec893a
--- /dev/null
+++ b/src/User.js
@@ -0,0 +1,29 @@
+import React, { useEffect, useState } from 'react';
+import './User.css';
+
+function User() {
+  const [user, setUser] = useState(null);
+
+  useEffect(() => {
+    const urlParams = new URLSearchParams(window.location.search);
+    const name = urlParams.get('name');
+
+    fetch(`https://api.github.com/users/${name}`)
+      .then(response => response.json())
+      .then(data => setUser(data));
+  }, []);
+
+  return (
+    <div>
+      {user && (
+        <>
+          <h2>{user.name}</h2>
+          <p>{user.bio}</p>
+          <img className="rounded-image" src={user.avatar_url} alt="User Avatar" />
+        </>
+      )}
+    </div>
+  );
+}
+
+export default User;
\ No newline at end of file