diff --git a/Web development/2048 Game/README.md b/Web development/2048 Game/README.md
new file mode 100644
index 0000000..b940312
--- /dev/null
+++ b/Web development/2048 Game/README.md	
@@ -0,0 +1,8 @@
+# 2048
+
+Join the tiles, get to 2048!
+HOW TO PLAY: Use your arrow keys to move the tiles. Tiles with the same number merge into one when they touch. Add them up to reach 2048! and win . you will loose when grid is full and no merge can take place .
+
+![alt text](image.png)
+
+DEMO :- https://prasanbora.github.io/2048/
\ No newline at end of file
diff --git a/Web development/2048 Game/app.js b/Web development/2048 Game/app.js
new file mode 100644
index 0000000..c04b7ae
--- /dev/null
+++ b/Web development/2048 Game/app.js	
@@ -0,0 +1,270 @@
+
+const gameBoard =document.querySelector(".gameBoard")
+
+const userScore= document.querySelector(".points")
+
+let score ;
+let filledCell;
+let endGame ;
+let highScore=0;
+
+startGame();
+newPosition();
+
+document.querySelector(".newPlay").addEventListener("click",function()
+{
+    gameBoard.innerHTML=""; 
+    startGame();
+    newPosition(); 
+    
+    console.log(filledCell);
+});
+
+function startGame () 
+{ 
+  score =0;
+  userScore.innerHTML=score;
+   filledCell=[[0 , 0 , 0 , 0] , [0 , 0 , 0 , 0]
+               ,[0 , 0 , 0 , 0],[0 , 0 , 0 , 0]]; 
+               //array to mark cell with value 
+
+
+   for(let j=0;j<4;j++)
+    {
+        for(let k=0;k<4;k++)
+        {
+            let  cell=document.createElement("div");
+            cell.id=`index${j}-${k}`;
+            gameBoard.append(cell);
+            
+            updateValue(j,k);
+        }
+    }
+  
+}
+
+// function to genrate a new cell value i.e 2 or 4
+ function generate () {
+
+  let newValue =Math.floor(Math.random()*2);
+  if(newValue===0)
+  { return 2;}
+  else 
+  { return 4;}
+}
+
+
+// function to get a new position for new cell 
+ function newPosition (){
+      
+    if(canPlay()===1)
+    {
+        let newi =Math.floor(Math.random()*4);
+    let newj =Math.floor(Math.random()*4);
+    
+    if(filledCell[newi][newj]!=0)
+    {
+       newPosition();
+    }
+    else 
+    filledCell[newi][newj]=generate();
+    updateValue(newi,newj);
+}
+else alert("Well played ! but you loose start new game by New Game button ");
+}
+
+
+document.querySelector("body").addEventListener('keyup',(e)=>{
+    // console.log(e.key);
+    switch(e.key)
+    {
+            case "ArrowUp":
+                
+                moveUp();
+                newPosition();
+                updateHighScore ();
+              break
+
+            case "ArrowDown":
+                
+                moveDown();
+                newPosition();
+                updateHighScore ();
+                break
+
+            case "ArrowRight":
+                moveRight();
+                newPosition();
+                updateHighScore ();
+            break
+
+            case "ArrowLeft":
+                moveLeft();
+                newPosition();
+                updateHighScore ();
+            break  
+    }
+});
+
+
+function updateValue(i,j)
+{
+    let cell=document.querySelector(`#index${i}-${j}`);
+            if(filledCell[i][j]>0)
+            {
+                
+                  cell.innerHTML=filledCell[i][j];
+                  cell.classList.add(`value${filledCell[i][j]}`);
+                    // console.log("value"+filledCell[i][j]);
+            }
+            else
+            {
+                document.querySelector(`#index${i}-${j}`).innerHTML="";
+                cell.className="";  
+            }
+        }
+ 
+function moveUp()
+{
+    for(let j=0;j<4;j++)
+    {
+        // console.log("--     555555555--");
+        for(let i=3;i>0;i--)
+        {
+            // console.log(filledCell[i][j]);
+            // console.log("----");
+            if(filledCell[i][j]===filledCell[i-1][j] && filledCell[i][j])
+            {  
+                // merge
+                filledCell[i-1][j]=2*filledCell[i][j];
+                filledCell[i][j]=0;
+                score=score+filledCell[i-1][j];
+                userScore.innerHTML=score;
+                updateValue(i,j);
+                updateValue(i-1,j);
+                i--;
+            }
+
+             else if(filledCell[i][j] && !filledCell[i-1][j])
+            {
+                filledCell[i-1][j] =filledCell[i][j];
+                filledCell[i][j]=0;
+                updateValue(i,j);
+                updateValue(i-1,j);
+            }
+
+        }
+    }
+}
+
+function moveDown()
+{
+    // console.log("move down called");
+   for(let j=0;j<4;j++)
+   {
+    for( let i=0;i<3;i++)
+    {
+        // console.log("loop is great ");
+      if(filledCell[i][j]===filledCell[i+1][j] && filledCell[i][j])
+      {
+        filledCell[i+1][j]=2*filledCell[i][j];
+        filledCell[i][j]=0;
+        score=score+filledCell[i+1][j];
+        userScore.innerHTML=score;
+        updateValue(i,j);
+        updateValue(i+1,j);
+        i++;
+      }
+
+      else if(filledCell[i][j] && !filledCell[i+1][j])
+      {
+        filledCell[i+1][j]=filledCell[i][j];
+        filledCell[i][j]=0;
+        updateValue(i,j);
+        updateValue(i+1,j);
+      }
+    }
+   }
+}
+
+function moveLeft()
+{
+    for( i=0;i<4;i++)
+    {
+        for( j=3;j>0;j--)
+        {
+            if(filledCell[i][j]===filledCell[i][j-1] && filledCell[i][j])
+            {
+               filledCell[i][j-1]=2*filledCell[i][j];
+               filledCell[i][j]=0;
+               updateValue(i,j);
+               updateValue(i,j-1);
+               score=score+filledCell[i][j-1];
+               userScore.innerHTML=score;
+               j--;
+            }
+
+            else if(filledCell[i][j] && !filledCell[i][j-1])
+            {
+                filledCell[i][j-1] =filledCell[i][j];
+                filledCell[i][j]=0;
+                updateValue(i,j);
+                updateValue(i,j-1);
+            }
+        }
+    }
+}
+
+function moveRight()
+{ for(let i=0;i<4;i++)
+    {
+     for( let j=0;j<3;j++)
+     {
+        //  console.log("loop is great ");
+       if(filledCell[i][j]===filledCell[i][j+1] && filledCell[i][j])
+       {
+         filledCell[i][j+1]=2*filledCell[i][j];
+         filledCell[i][j]=0;
+         score=score+filledCell[i][j+1];
+         userScore.innerHTML=score;
+         updateValue(i,j);
+         updateValue(i,j+1);
+         i++;
+       }
+ 
+       else if(filledCell[i][j] && !filledCell[i][j+1])
+       {
+         filledCell[i][j+1]=filledCell[i][j];
+         filledCell[i][j]=0;
+         updateValue(i,j);
+         updateValue(i,j+1);
+       }
+     }
+    }
+
+}
+
+function canPlay()
+{ 
+    for(let i=0;i<4;i++)
+    {
+     for( let j=0;j<4;j++)
+     {
+      if(filledCell[i][j]==0){
+        return 1;
+      }
+}
+}
+return 0 ;
+}
+
+function updateHighScore ()
+{
+    // console.log( score , highScore );
+   if(score>=highScore)
+   {
+   highScore=score;
+   console.log( score , highScore );
+   document.querySelector(".best").innerHTML= highScore;
+   }
+}
\ No newline at end of file
diff --git a/Web development/2048 Game/image.png b/Web development/2048 Game/image.png
new file mode 100644
index 0000000..ba624be
Binary files /dev/null and b/Web development/2048 Game/image.png differ
diff --git a/Web development/2048 Game/index.html b/Web development/2048 Game/index.html
new file mode 100644
index 0000000..e52b3ef
--- /dev/null
+++ b/Web development/2048 Game/index.html	
@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>2048</title>
+    <link rel="stylesheet" href="style.css">
+</head>
+<body>
+    <h1 class ="heading">2048</h1>
+    <hr>
+    <div class="topbar">  
+        <button class="newPlay"> New Game </button>
+
+      <div>
+         
+        <div class="scoreBar">
+            <h3 > Best : <span class="best"></span></h3>
+             
+           </div> 
+           <div class="scoreBar">
+            <h3 > Score : <span class="points">  </span></h3>
+            
+           </div>
+             
+       </div>
+        
+         
+    </div>
+ 
+    <div class="gameBoard">
+
+            <!-- <div class="box"></div>
+            <div class="box"></div>
+            <div class="box"></div>
+            <div class="box"></div>
+      
+            <div class="box"></div>
+            <div class="box"></div>
+            <div class="box"></div>
+            <div class="box"></div>
+
+            <div class="box"></div>
+            <div class="box"></div>
+            <div class="box"></div>
+            <div class="box"></div>
+        
+            <div class="box"></div>
+            <div class="box"></div>
+            <div class="box"></div>
+            <div class="box"></div>
+         -->
+    </div>
+    
+    <script src="app.js"></script>
+</body>
+</html>
\ No newline at end of file
diff --git a/Web development/2048 Game/style.css b/Web development/2048 Game/style.css
new file mode 100644
index 0000000..1b54b54
--- /dev/null
+++ b/Web development/2048 Game/style.css	
@@ -0,0 +1,147 @@
+
+*{
+    margin:0;
+    padding:0; 
+}
+
+body {
+    background-color: rgb(228, 225, 218);
+    font-family: clear sans,helvetica neue,Arial,sans-serif;
+    
+}
+
+.gameBoard{
+    
+    /* position: absolute; */
+    align-items: center;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-around !important;
+    background: #bbada0;
+    border-radius: 6px;
+    width:  70vmin;
+    height: 70vmin;
+    margin: 5vmin auto ;
+    padding: 4px;
+    
+}
+
+.gameBoard div{
+    background: rgba(238,228,218,.35);
+    height: 16vmin;
+    width:  16vmin;
+    border-radius: 0.5vmin;
+    text-align: center;
+    font-weight: bolder;
+    font-size: 9vmin;
+    line-height: 17vmin;
+      
+}
+
+.topbar
+{
+    display: flex;
+    justify-content: space-around;
+    margin:2vmin;
+    color:white;
+    font-size: medium ;
+}
+
+.heading
+{
+    margin: 1.5vmin 8vmin;
+    color: #776e65;
+    font-size: 7vmin;
+}
+
+.newPlay
+{
+    background: #8f7a66;
+    border-radius: 1vmin;
+    border: none;
+    color:white;
+    font-family: clear sans,helvetica neue,Arial,sans-serif;
+    font-weight: bolder;
+    font-size: 2.5vmin;
+    padding: 0 3vmin;
+    line-height: 1vmin;
+    height: 8vmin;
+}
+
+.scoreBar
+{
+    background-color:#cfb69f; 
+    font-weight: bold;
+    color: #ebe4d8;
+    padding: 0 3vmin;
+    line-height: 8vmin;
+    border-radius: 1vmin; 
+    height: 8vmin;  
+    margin-bottom: 2vmin;
+}
+
+.best ,.points
+{
+    font-size: 4vmin;
+    font-weight: lighter;
+    color:white;
+}
+
+/* //coloring the cell  */
+
+.value2 {
+    background: #eee4da !important;
+    color: #727371;
+}
+
+.value4 {
+    background-color: #ede0c8 !important;
+    color: #727371;
+}
+
+.value8 {
+    color: #f9f6f2;
+    background: #f2b179 !important;
+}
+
+.value16{
+    color: #f9f6f2;
+    background: #f59563 !important;
+}
+
+.value32{
+    color: #f9f6f2;
+    background: #f67c5f !important;
+}
+
+.value64{
+    color: #f9f6f2;
+    background: #f65e3b !important;
+}
+
+.value128{
+    color: #f9f6f2;
+    background: #edcf72 !important;
+}
+
+.value256{
+    color: #f9f6f2;
+    background: #edcc61 !important;
+}
+
+.value512{
+   
+    color:#f9f6f2;
+    background:#edc850 !important;
+    
+}
+
+.value1024{
+    color: white;
+    background:#edc53f !important;
+}
+
+.value2048{
+color:#f9f6f2;
+background-color:#edc22e !important;
+}
\ No newline at end of file
diff --git a/Web development/NewsApp/.gitignore b/Web development/NewsApp/.gitignore
new file mode 100644
index 0000000..680c904
--- /dev/null
+++ b/Web development/NewsApp/.gitignore	
@@ -0,0 +1,24 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+package-lock.json
diff --git a/Web development/NewsApp/README.md b/Web development/NewsApp/README.md
new file mode 100644
index 0000000..e94792b
--- /dev/null
+++ b/Web development/NewsApp/README.md	
@@ -0,0 +1,10 @@
+
+
+    ```
+
+## Get API Key
+- Visit [newsapi.org](https://newsapi.org/)
+- Login and Copy the API key.
+- open the *".env"* file.
+- Replace the 'Your_API_Key' to the copied API key.
+
diff --git a/Web development/NewsApp/package.json b/Web development/NewsApp/package.json
new file mode 100644
index 0000000..75c507c
--- /dev/null
+++ b/Web development/NewsApp/package.json	
@@ -0,0 +1,40 @@
+{
+  "name": "newsapp",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "@testing-library/jest-dom": "^5.17.0",
+    "@testing-library/react": "^13.4.0",
+    "@testing-library/user-event": "^13.5.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-infinite-scroll-component": "^6.1.0",
+    "react-router-dom": "^6.22.3",
+    "react-scripts": "5.0.1",
+    "web-vitals": "^2.1.4"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  }
+}
diff --git a/Web development/NewsApp/public/about.txt b/Web development/NewsApp/public/about.txt
new file mode 100644
index 0000000..a133b2e
--- /dev/null
+++ b/Web development/NewsApp/public/about.txt	
@@ -0,0 +1,6 @@
+This favicon was generated using the following font:
+
+- Font Title: ADLaM Display
+- Font Author: Copyright (c) 2022 by Microsoft. All rights reserved.
+- Font Source: https://fonts.gstatic.com/s/adlamdisplay/v1/KFOhCnGXkPOLlhx6jD8_b1ZECsHYkYBPY3o.ttf
+- Font License: SIL Open Font License, 1.1 (http://scripts.sil.org/OFL))
diff --git a/Web development/NewsApp/public/android-chrome-192x192.png b/Web development/NewsApp/public/android-chrome-192x192.png
new file mode 100644
index 0000000..f8c5cba
Binary files /dev/null and b/Web development/NewsApp/public/android-chrome-192x192.png differ
diff --git a/Web development/NewsApp/public/android-chrome-512x512.png b/Web development/NewsApp/public/android-chrome-512x512.png
new file mode 100644
index 0000000..24a17b1
Binary files /dev/null and b/Web development/NewsApp/public/android-chrome-512x512.png differ
diff --git a/Web development/NewsApp/public/apple-touch-icon.png b/Web development/NewsApp/public/apple-touch-icon.png
new file mode 100644
index 0000000..4ca810a
Binary files /dev/null and b/Web development/NewsApp/public/apple-touch-icon.png differ
diff --git a/Web development/NewsApp/public/favicon-16x16.png b/Web development/NewsApp/public/favicon-16x16.png
new file mode 100644
index 0000000..ab64631
Binary files /dev/null and b/Web development/NewsApp/public/favicon-16x16.png differ
diff --git a/Web development/NewsApp/public/favicon-32x32.png b/Web development/NewsApp/public/favicon-32x32.png
new file mode 100644
index 0000000..7d02e88
Binary files /dev/null and b/Web development/NewsApp/public/favicon-32x32.png differ
diff --git a/Web development/NewsApp/public/favicon.ico b/Web development/NewsApp/public/favicon.ico
new file mode 100644
index 0000000..5c3d191
Binary files /dev/null and b/Web development/NewsApp/public/favicon.ico differ
diff --git a/Web development/NewsApp/public/index.html b/Web development/NewsApp/public/index.html
new file mode 100644
index 0000000..10762cb
--- /dev/null
+++ b/Web development/NewsApp/public/index.html	
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <link rel="icon" href="%PUBLIC_URL%/favicon.png"/>
+    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
+    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
+    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">    
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta
+      name="description"
+      content="Web site created using create-react-app"
+    />
+    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
+    <!--
+      manifest.json provides metadata used when your web app is installed on a
+      user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
+    -->
+    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
+    <!--
+      Notice the use of %PUBLIC_URL% in the tags above.
+      It will be replaced with the URL of the `public` folder during the build.
+      Only files inside the `public` folder can be referenced from the HTML.
+
+      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
+      work correctly both with client-side routing and a non-root public URL.
+      Learn how to configure a non-root public URL by running `npm run build`.
+    -->
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+    <title>News Corner - Get daily news</title>
+  </head>
+  <body>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
+
+    <noscript>You need to enable JavaScript to run this app.</noscript>
+    <div id="root"></div>
+    <!--
+      This HTML file is a template.
+      If you open it directly in the browser, you will see an empty page.
+
+      You can add webfonts, meta tags, or analytics to this file.
+      The build step will place the bundled scripts into the <body> tag.
+
+      To begin the development, run `npm start` or `yarn start`.
+      To create a production bundle, use `npm run build` or `yarn build`.
+    -->
+  </body>
+</html>
diff --git a/Web development/NewsApp/public/manifest.json b/Web development/NewsApp/public/manifest.json
new file mode 100644
index 0000000..080d6c7
--- /dev/null
+++ b/Web development/NewsApp/public/manifest.json	
@@ -0,0 +1,25 @@
+{
+  "short_name": "React App",
+  "name": "Create React App Sample",
+  "icons": [
+    {
+      "src": "favicon.ico",
+      "sizes": "64x64 32x32 24x24 16x16",
+      "type": "image/x-icon"
+    },
+    {
+      "src": "logo192.png",
+      "type": "image/png",
+      "sizes": "192x192"
+    },
+    {
+      "src": "logo512.png",
+      "type": "image/png",
+      "sizes": "512x512"
+    }
+  ],
+  "start_url": ".",
+  "display": "standalone",
+  "theme_color": "#000000",
+  "background_color": "#ffffff"
+}
diff --git a/Web development/NewsApp/public/robots.txt b/Web development/NewsApp/public/robots.txt
new file mode 100644
index 0000000..e9e57dc
--- /dev/null
+++ b/Web development/NewsApp/public/robots.txt	
@@ -0,0 +1,3 @@
+# https://www.robotstxt.org/robotstxt.html
+User-agent: *
+Disallow:
diff --git a/Web development/NewsApp/public/site.webmanifest b/Web development/NewsApp/public/site.webmanifest
new file mode 100644
index 0000000..45dc8a2
--- /dev/null
+++ b/Web development/NewsApp/public/site.webmanifest	
@@ -0,0 +1 @@
+{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
\ No newline at end of file
diff --git a/Web development/NewsApp/src/App.css b/Web development/NewsApp/src/App.css
new file mode 100644
index 0000000..74b5e05
--- /dev/null
+++ b/Web development/NewsApp/src/App.css	
@@ -0,0 +1,38 @@
+.App {
+  text-align: center;
+}
+
+.App-logo {
+  height: 40vmin;
+  pointer-events: none;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  .App-logo {
+    animation: App-logo-spin infinite 20s linear;
+  }
+}
+
+.App-header {
+  background-color: #282c34;
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  font-size: calc(10px + 2vmin);
+  color: white;
+}
+
+.App-link {
+  color: #61dafb;
+}
+
+@keyframes App-logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
diff --git a/Web development/NewsApp/src/App.js b/Web development/NewsApp/src/App.js
new file mode 100644
index 0000000..d5a8063
--- /dev/null
+++ b/Web development/NewsApp/src/App.js	
@@ -0,0 +1,30 @@
+import React, { Component } from 'react';
+import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
+
+import Navbar from "./components/Navbar";
+import News from "./components/news/News";
+
+export default class App extends Component {
+  page = 12;
+  news_api = process.env.REACT_APP_NEWS_API;
+  render() {
+    return (
+      <div>
+        <Router>
+          <Navbar />
+          <Routes>
+            <Route exact path="/business" element={<News key="business" apiKey={this.news_api} pageSize={this.page} country="us" category="business" />} />
+            <Route exact path="/entertainment" element={<News key="entertainment" apiKey={this.news_api} pageSize={this.page} country="us" category="entertainment" />} />
+            <Route exact path="/general" element={<News key="general" apiKey={this.news_api} pageSize={this.page} country="us" category="general" />} />
+            <Route exact path="/health" element={<News key="health" apiKey={this.news_api} pageSize={this.page} country="us" category="health" />} />
+            <Route exact path="/science" element={<News key="science" apiKey={this.news_api} pageSize={this.page} country="us" category="science" />} />
+            <Route exact path="/sports" element={<News key="sports" apiKey={this.news_api} pageSize={this.page} country="us" category="sports" />} />
+            <Route exact path="/technology" element={<News key="technology" apiKey={this.news_api} pageSize={this.page} country="us" category="technology" />} />
+            <Route exact path="/home" element={<News key="general" apiKey={this.news_api} pageSize={this.page} country="us" category="general" />} />
+            <Route exact path="/" element={<News key="general" apiKey={this.news_api} pageSize={this.page} country="us" category="general" />} />
+          </Routes>
+        </Router>
+      </div>
+    );
+  }
+}
diff --git a/Web development/NewsApp/src/App.test.js b/Web development/NewsApp/src/App.test.js
new file mode 100644
index 0000000..1f03afe
--- /dev/null
+++ b/Web development/NewsApp/src/App.test.js	
@@ -0,0 +1,8 @@
+import { render, screen } from '@testing-library/react';
+import App from './App';
+
+test('renders learn react link', () => {
+  render(<App />);
+  const linkElement = screen.getByText(/learn react/i);
+  expect(linkElement).toBeInTheDocument();
+});
diff --git a/Web development/NewsApp/src/assets/dumy.png b/Web development/NewsApp/src/assets/dumy.png
new file mode 100644
index 0000000..925e6d2
Binary files /dev/null and b/Web development/NewsApp/src/assets/dumy.png differ
diff --git a/Web development/NewsApp/src/assets/loader.gif b/Web development/NewsApp/src/assets/loader.gif
new file mode 100644
index 0000000..8698af6
Binary files /dev/null and b/Web development/NewsApp/src/assets/loader.gif differ
diff --git a/Web development/NewsApp/src/components/Navbar.js b/Web development/NewsApp/src/components/Navbar.js
new file mode 100644
index 0000000..6f64460
--- /dev/null
+++ b/Web development/NewsApp/src/components/Navbar.js	
@@ -0,0 +1,35 @@
+import React, { Component } from 'react'
+import {Link} from "react-router-dom";
+
+export class Navbar extends Component {
+  render() {
+    return (
+      <div>
+        <nav className="navbar navbar-expand-lg bg-dark navbar-dark ">
+            <div className="container-fluid">
+                <Link className="navbar-brand" to="/">News corner</Link>
+                <button className="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+                <span className="navbar-toggler-icon"></span>
+                </button>
+                <div className="collapse navbar-collapse" id="navbarSupportedContent">
+                <ul className="navbar-nav me-auto mb-2 mb-lg-0">
+                    <li className="nav-item">
+                    <Link className="nav-link" aria-current="page" to="/home">Home</Link>
+                    </li>
+                    <li className="nav-item"><Link className="nav-link" to="/business">Business</Link></li>
+                    <li className="nav-item"><Link className="nav-link" to="/entertainment">Entertainment</Link></li>
+                    <li className="nav-item"><Link className="nav-link" to="/general">General</Link></li>
+                    <li className="nav-item"><Link className="nav-link" to="/health">Health</Link></li>
+                    <li className="nav-item"><Link className="nav-link" to="/science">Science</Link></li>
+                    <li className="nav-item"><Link className="nav-link" to="/sports">Sports</Link></li>
+                    <li className="nav-item"><Link className="nav-link" to="/technology">Technology</Link></li>
+                </ul>
+                </div>
+            </div>
+        </nav>
+      </div>
+    )
+  }
+}
+
+export default Navbar
diff --git a/Web development/NewsApp/src/components/Spinner.js b/Web development/NewsApp/src/components/Spinner.js
new file mode 100644
index 0000000..ee20319
--- /dev/null
+++ b/Web development/NewsApp/src/components/Spinner.js	
@@ -0,0 +1,14 @@
+import React, { Component } from 'react'
+import loadder from "../assets/loader.gif"
+
+export class Spinner extends Component {
+  render() {
+    return (
+      <div className='text-center'>
+        <img src={loadder} alt='Loading'/>
+      </div>
+    )
+  }
+}
+
+export default Spinner
diff --git a/Web development/NewsApp/src/components/news/News.js b/Web development/NewsApp/src/components/news/News.js
new file mode 100644
index 0000000..8447a36
--- /dev/null
+++ b/Web development/NewsApp/src/components/news/News.js	
@@ -0,0 +1,113 @@
+import React, { Component } from 'react'
+import NewsItem from './NewsItem'
+import Spinner from '../Spinner';
+import defaultImage from '../../assets/dumy.png'
+import PropTypes from 'prop-types'
+import InfiniteScroll from "react-infinite-scroll-component";
+import sampleData from '../../sampleData.json'; // Importing sample data
+
+export class News extends Component {
+  generateId = () => {
+    let length = 10
+    let result = '';
+    const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
+
+    for (let i = 0; i < length; i++) {
+      result += characters.charAt(Math.floor(Math.random() * characters.length));
+    }
+
+    return result;
+  }
+
+  capitalize(string) {
+    return string.charAt(0).toUpperCase() + string.slice(1);
+  }
+
+  static defaultProps = {
+    pageSize: 9,
+    category: "general",
+    country: "in"
+  }
+
+  static propTypes = {
+    pageSize: PropTypes.number,
+    category: PropTypes.string.isRequired,
+    country: PropTypes.string
+  }
+
+  constructor(props) {
+    super(props);
+    this.state = {
+      articles: [],
+      loading: true,
+      page: 1,
+      totalResults: 0,
+      isOpen: false
+    }
+    document.title = `${this.capitalize(this.props.category)} - News Corner`;
+  }
+
+  async fetchData(url) {
+    //try {
+      let data = await fetch(url);
+      let parsedData = await data.json();
+      console.log("api data");
+      if (parsedData.status !== "error"){
+        return parsedData;
+      }
+      return sampleData;
+  }
+ 
+  async componentDidMount() {
+    // this.props.setProgress(20);
+    let url = `https://newsapi.org/v2/top-headlines?country=${this.props.country}&category=${this.props.category}&apiKey=${this.props.apiKey}&page=${this.state.page}&pageSize=${this.props.pageSize}`;
+    // this.props.setProgress(40);
+    this.setState({ loading: true });
+    // this.props.setProgress(50);
+    let data = await this.fetchData(url);
+    // this.props.setProgress(90);
+    this.setState({
+      articles: data.articles,
+      totalResults: data.totalResults,
+      loading: false
+    });
+    // this.props.setProgress(100);
+  }
+
+  fetchMoreData = async () => {
+    this.setState({ page: this.state.page + 1 });
+    let url = `https://newsapi.org/v2/top-headlines?country=${this.props.country}&category=${this.props.category}&apiKey=${this.props.apiKey}&page=${this.state.page + 1}&pageSize=${this.props.pageSize}`;
+    let data = await this.fetchData(url);
+    this.setState({
+      articles: this.state.articles.concat(data.articles || []),
+      totalResults: data.totalResults
+    });
+  };
+
+  render() {
+    return (
+      <>
+        <h1 className='text-center' style={{ marginTop: "80px" }}>News corner - Top {this.capitalize(this.props.category)} headlines</h1>
+        {this.state.loading && <Spinner />}
+        <InfiniteScroll
+          dataLength={this.state.articles.length}
+          next={this.fetchMoreData}
+          hasMore={this.state.articles.length !== this.state.totalResults}
+          loader={<Spinner />}
+        >
+          <div className='container'>
+            <div className='row'>
+              {this.state.articles.map((ele) => {
+                return <div className='col-md-4' key={ele.url + this.generateId()}>
+                  <NewsItem title={ele.title ? ele.title.slice(0, 45) : ""} description={ele.description ? ele.description.slice(0, 88) : ""} imageUrl={ele.urlToImage ? ele.urlToImage : defaultImage} newsUrl={ele.url} author={ele.author ? ele.author : "Unknown"} date={ele.publishedAt} source={ele.source.name} />
+                </div>
+              })}
+            </div>
+          </div>
+        </InfiniteScroll>
+      </>
+    )
+  }
+}
+
+export default News
diff --git a/Web development/NewsApp/src/components/news/NewsItem.js b/Web development/NewsApp/src/components/news/NewsItem.js
new file mode 100644
index 0000000..7ca4090
--- /dev/null
+++ b/Web development/NewsApp/src/components/news/NewsItem.js	
@@ -0,0 +1,33 @@
+import React, { Component } from 'react'
+import defaultImage from "../../assets/dumy.png"
+
+
+export class NewsItem extends Component {
+  handleImageError = (event) => {
+    event.target.onerror = null;
+    event.target.src = defaultImage;
+    event.target.alt = "dummy image";
+  };
+
+  render() {
+    let {title,description,imageUrl,newsUrl,author,date,source } = this.props;
+    return (
+      <div className='my-3'>
+        <div className="card">
+            <span className="position-absolute top-0 translate-middle badge rounded-pill bg-danger" style={{zIndex:"1",left:"85%"}}>
+              {source}
+            </span>
+            <img src={imageUrl} loading='lazy' onError={this.handleImageError}  className="card-img-top" alt="..."/>
+            <div className="card-body">
+                <h5 className="card-title">{title}...</h5>
+                <p className="card-text">{description}...</p>
+                <p className="card-text"><small className="text-muted">By {author} on {new Date(date).toGMTString()}</small></p>
+                <a href={newsUrl} target='_blanck' className="btn btn-sm btn-primary">Read more</a>
+            </div>
+            </div>
+      </div>
+    )
+  }
+}
+
+export default NewsItem
diff --git a/Web development/NewsApp/src/index.css b/Web development/NewsApp/src/index.css
new file mode 100644
index 0000000..e69de29
diff --git a/Web development/NewsApp/src/index.js b/Web development/NewsApp/src/index.js
new file mode 100644
index 0000000..7716fe4
--- /dev/null
+++ b/Web development/NewsApp/src/index.js	
@@ -0,0 +1,12 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import './index.css';
+import App from './App';
+
+const root = ReactDOM.createRoot(document.getElementById('root'));
+root.render(
+  <React.StrictMode>
+    <App />
+  </React.StrictMode>
+);
+
diff --git a/Web development/NewsApp/src/logo.svg b/Web development/NewsApp/src/logo.svg
new file mode 100644
index 0000000..9dfc1c0
--- /dev/null
+++ b/Web development/NewsApp/src/logo.svg	
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3"><g fill="#61DAFB"><path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/><circle cx="420.9" cy="296.5" r="45.7"/><path d="M520.5 78.1z"/></g></svg>
\ No newline at end of file
diff --git a/Web development/NewsApp/src/reportWebVitals.js b/Web development/NewsApp/src/reportWebVitals.js
new file mode 100644
index 0000000..5253d3a
--- /dev/null
+++ b/Web development/NewsApp/src/reportWebVitals.js	
@@ -0,0 +1,13 @@
+const reportWebVitals = onPerfEntry => {
+  if (onPerfEntry && onPerfEntry instanceof Function) {
+    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
+      getCLS(onPerfEntry);
+      getFID(onPerfEntry);
+      getFCP(onPerfEntry);
+      getLCP(onPerfEntry);
+      getTTFB(onPerfEntry);
+    });
+  }
+};
+
+export default reportWebVitals;
diff --git a/Web development/NewsApp/src/sample.json b/Web development/NewsApp/src/sample.json
new file mode 100644
index 0000000..b9bf5d9
--- /dev/null
+++ b/Web development/NewsApp/src/sample.json	
@@ -0,0 +1,42 @@
+{
+  "status": "ok",
+  "totalResults": 2,
+  "articles": [
+    {
+      "source": { "id": "espn-cric-info", "name": "ESPN Cric Info" },
+      "author": null,
+      "title": "PCB hands Umar Akmal three-year ban from all cricket | ESPNcricinfo.com",
+      "description": "Penalty after the batsman pleaded guilty to not reporting corrupt approaches | ESPNcricinfo.com",
+      "url": "http://www.espncricinfo.com/story/_/id/29103103/pcb-hands-umar-akmal-three-year-ban-all-cricket",
+      "urlToImage": "https://a4.espncdn.com/combiner/i?img=%2Fi%2Fcricket%2Fcricinfo%2F1099495_800x450.jpg",
+      "publishedAt": "2020-04-27T11:41:47Z",
+      "content": "Umar Akmal's troubled cricket career has hit its biggest roadblock yet, with the PCB handing him a ban from all representative cricket for three years after he pleaded guilty of failing to report det… [+1506 chars]"
+    },
+    {
+      "source": { "id": "espn-cric-info", "name": "ESPN Cric Info" },
+      "author": null,
+      "title": "What we learned from watching the 1992 World Cup final in full again | ESPNcricinfo.com",
+      "description": "Wides, lbw calls, swing - plenty of things were different in white-ball cricket back then | ESPNcricinfo.com",
+      "url": "http://www.espncricinfo.com/story/_/id/28970907/learned-watching-1992-world-cup-final-full-again",
+      "urlToImage": "https://a4.espncdn.com/combiner/i?img=%2Fi%2Fcricket%2Fcricinfo%2F1219926_1296x729.jpg",
+      "publishedAt": "2020-03-30T15:26:05Z",
+      "content": "Last week, we at ESPNcricinfo did something we have been thinking of doing for eight years now: pretend-live ball-by-ball commentary for a classic cricket match. We knew the result, yes, but we tried… [+6823 chars]"
+    }
+  ]
+}
+
+
+
+
+
+
+<Route path="/business"><News key="business" pageSize={9} country="us" category="business"/></Route>
+<Route path="/entertainment"><News key="entertainment" pageSize={9} country="us" category="entertainment"/></Route>
+<Route path="/general"><News key="general" pageSize={9} country="us" category="general"/></Route>
+<Route path="/health"><News key="health" pageSize={9} country="us" category="health"/></Route>
+<Route path="/science"><News key="science" pageSize={9} country="us" category="science"/></Route>
+<Route path="/sports"><News key="sports" pageSize={9} country="us" category="sports"/></Route>
+<Route path="/technology"><News key="technology" pageSize={9} country="us" category="technology"/></Route>
+
+
+<Route path="/"><News pageSize={9} country="us" category="general"/></Route>
\ No newline at end of file
diff --git a/Web development/NewsApp/src/sampleData.json b/Web development/NewsApp/src/sampleData.json
new file mode 100644
index 0000000..7ad03bb
--- /dev/null
+++ b/Web development/NewsApp/src/sampleData.json	
@@ -0,0 +1,266 @@
+{
+    "status": "ok",
+    "totalResults": 35,
+    "articles": [
+      {
+        "source": {
+          "id": null,
+          "name": "Yahoo Entertainment"
+        },
+        "author": "Jennifer Schonberger",
+        "title": "Fed expected to dial back 2024 rate calls after digesting new inflation data - Yahoo Finance",
+        "description": "Federal Reserve officials are expected Wednesday to dial back their estimates of interest rate cuts in 2024 after digesting a fresh inflation reading.",
+        "url": "https://finance.yahoo.com/news/fed-expected-to-dial-back-2024-rate-calls-after-digesting-new-inflation-data-090034448.html",
+        "urlToImage": "https://s.yimg.com/ny/api/res/1.2/My8nWu06ckxdlEDwipTPQg--/YXBwaWQ9aGlnaGxhbmRlcjt3PTEyMDA7aD04MDA-/https://s.yimg.com/os/creatr-uploaded-images/2024-06/34cb9b80-273a-11ef-b663-d2d55f97ebe0",
+        "publishedAt": "2024-06-12T09:00:34Z",
+        "content": "Investors are bracing for Federal Reserve officials this afternoon to dial back estimates of interest rate cuts in 2024.\r\nBefore policymakers go public with those predictions, they get a fresh inflat… [+2296 chars]"
+      },
+      {
+        "source": {
+          "id": "cnn",
+          "name": "CNN"
+        },
+        "author": "John Fritze, Devan Cole",
+        "title": "How the Supreme Court could help Hunter Biden appeal his conviction - CNN",
+        "description": "Hunter Biden’s historic conviction on three felony gun charges will add significant weight to a blockbuster Second Amendment appeal to be decided in coming days by the Supreme Court.",
+        "url": "https://www.cnn.com/2024/06/12/politics/supreme-court-second-amendment-hunter-biden-rahimi-appeal/index.html",
+        "urlToImage": "https://media.cnn.com/api/v1/images/stellar/prod/00887097-f76f-45d3-b3ba-55292357f28f.jpg?c=16x9&q=w_800,c_fill",
+        "publishedAt": "2024-06-12T09:00:00Z",
+        "content": "Hunter Bidens historic conviction on three felony gun charges will add significant weight to a blockbuster Second Amendment appeal to be decided in coming days by the Supreme Court.\r\nThough the case … [+5280 chars]"
+      },
+      {
+        "source": {
+          "id": "politico",
+          "name": "Politico"
+        },
+        "author": "POLITICO",
+        "title": "Voters have real doubts about Kamala Harris as potential president, poll shows - POLITICO",
+        "description": null,
+        "url": "https://www.politico.com/news/2024/06/12/kamala-harris-favorability-poll-00162093",
+        "urlToImage": null,
+        "publishedAt": "2024-06-12T09:00:00Z",
+        "content": null
+      },
+      {
+        "source": {
+          "id": "axios",
+          "name": "Axios"
+        },
+        "author": "Axios",
+        "title": "Elon Musk drops breach of contract lawsuit against OpenAI, Sam Altman - Axios",
+        "description": null,
+        "url": "https://www.axios.com/2024/06/11/elon-musk-lawsuit-openai-sam-altman",
+        "urlToImage": null,
+        "publishedAt": "2024-06-12T08:29:01Z",
+        "content": null
+      },
+      {
+        "source": {
+          "id": null,
+          "name": "[Removed]"
+        },
+        "author": null,
+        "title": "[Removed]",
+        "description": "[Removed]",
+        "url": "https://removed.com",
+        "urlToImage": null,
+        "publishedAt": "1970-01-01T00:00:00Z",
+        "content": "[Removed]"
+      },
+      {
+        "source": {
+          "id": "reuters",
+          "name": "Reuters"
+        },
+        "author": "Reuters.com",
+        "title": "'Immense' scale of Gaza killings amount to crime against humanity, UN inquiry says - Reuters.com",
+        "description": null,
+        "url": "https://www.reuters.com/world/middle-east/immense-scale-gaza-killings-amount-crime-against-humanity-un-inquiry-says-2024-06-12/",
+        "urlToImage": null,
+        "publishedAt": "2024-06-12T07:02:00Z",
+        "content": null
+      },
+      {
+        "source": {
+          "id": null,
+          "name": "BBC News"
+        },
+        "author": null,
+        "title": "Project 2025: The Trump presidency wish list, explained - BBC.com",
+        "description": "An influential think tank wants the Federal Reserve and Department of Education to be abolished, among other ideas.",
+        "url": "https://www.bbc.com/news/articles/c977njnvq2do",
+        "urlToImage": "https://ichef.bbci.co.uk/news/1024/branded_news/315a/live/bdfe3f80-2847-11ef-80aa-699d54c46324.jpg",
+        "publishedAt": "2024-06-12T05:34:44Z",
+        "content": "By Mike Wendling, BBC News\r\nPresident Joe Biden's Democrats are mobilising against a possible governing agenda for Donald Trump if he is elected this November.\r\nThe blueprint, called Project 2025 and… [+5296 chars]"
+      },
+      {
+        "source": {
+          "id": null,
+          "name": "NPR"
+        },
+        "author": "NPR Washington Desk",
+        "title": "Sam Brown wins Nevada's GOP Senate Primary to challenge Democrat Jacky Rosen - NPR",
+        "description": "Republican Sam Brown will face incumbent Democratic Sen. Jacky Rosen, who also won her primary Tuesday night, in a race that could help decide which party controls the U.S. Senate.",
+        "url": "https://www.npr.org/2024/06/12/g-s1-3999/sam-brown-win-nevada-gop-senate-primary",
+        "urlToImage": "https://npr.brightspotcdn.com/dims3/default/strip/false/crop/5845x3288+0+305/resize/1400/quality/100/format/jpeg/?url=http%3A%2F%2Fnpr-brightspot.s3.amazonaws.com%2F27%2F93%2F776b6c2c4df8b06621a53d4c90db%2Fnevada-primary-ap.jpg",
+        "publishedAt": "2024-06-12T05:28:44Z",
+        "content": "Retired Army Capt. Sam Brown has beat out a crowded field of GOP primary candidates to win his partys nomination for Nevadas U.S. Senate race on Tuesday, according to a race call by The Associated Pr… [+1027 chars]"
+      },
+      {
+        "source": {
+          "id": null,
+          "name": "BBC News"
+        },
+        "author": null,
+        "title": "Joey Chestnut: hot dog champ blocked from Nathan's contest over vegan sponsor - BBC.com",
+        "description": "Joey Chestnut told he cannot join famed Nathan's contest on 4 July unless he drops sponsorship by vegan brand.",
+        "url": "https://www.bbc.com/news/articles/cj7793exd15o",
+        "urlToImage": "https://ichef.bbci.co.uk/news/1024/branded_news/7920/live/2f632860-2835-11ef-bae3-375699f6439a.jpg",
+        "publishedAt": "2024-06-12T03:38:30Z",
+        "content": "Competitive eating star Joey \"Jaws\" Chestnut has been told he cannot join America's premiere hot dog contest after striking a deal with a vegan brand. \r\nHis removal from next month's Nathan's Hot Dog… [+2243 chars]"
+      },
+      {
+        "source": {
+          "id": null,
+          "name": "Hollywood Reporter"
+        },
+        "author": "Kevin Dolak",
+        "title": "Celine Dion Reveals She Took Near-Lethal Levels of Valium While Battling Stiff-Person Syndrome - Hollywood Reporter",
+        "description": "The superstar singer tells NBC News in an exclusive interview that before her diagnosis, the muscle spasms she endured were so severe she began taking life-threatening amounts of prescription drugs.",
+        "url": "http://www.hollywoodreporter.com/news/general-news/celine-dion-nbc-interview-stiff-person-syndrome-1235920516/",
+        "urlToImage": "https://www.hollywoodreporter.com/wp-content/uploads/2024/06/CelineDionGettyImages-1159875948.jpg?w=1024",
+        "publishedAt": "2024-06-12T03:32:29Z",
+        "content": "A year after Celine Dion canceled her tour as she adjusted to living with stiff-person syndrome, the superstar vocalist has now opened up in a primetime interview with NBC News to discuss the fear sh… [+4331 chars]"
+      },
+      {
+        "source": {
+          "id": null,
+          "name": "Benzinga"
+        },
+        "author": "Benzinga Neuro",
+        "title": "Apple's AI-Powered Growth To Trigger 10% Revenue Surge By 2025, Predicts Gene Munster: 'This Is Just The Start Of Apple's Next Growth Chapter' - Apple (NASDAQ:AAPL) - Benzinga",
+        "description": "Apple is poised for a significant growth spurt, driven by its artificial intelligence capabilities, according to Gene Munster, a prominent tech analyst.",
+        "url": "https://www.benzinga.com/markets/equities/24/06/39284068/apples-ai-powered-growth-to-trigger-10-revenue-surge-by-2025-predicts-gene-munster-this-is-just-",
+        "urlToImage": "https://cdn.benzinga.com/files/images/story/2024/06/11/Apple-logo.jpeg?width=1200&height=800&fit=crop",
+        "publishedAt": "2024-06-12T03:32:11Z",
+        "content": "Apple IncAAPL is poised for a significant growth spurt, driven by its artificial intelligence capabilities, according to Gene Munster, a prominent tech analyst.\r\nWhat Happened: Munster, the Managing … [+2370 chars]"
+      },
+      {
+        "source": {
+          "id": "reuters",
+          "name": "Reuters"
+        },
+        "author": "Hyunsu Yim",
+        "title": "Jin, oldest member of K-pop's BTS, finishes army service in South Korea - Reuters.com",
+        "description": "Jin, the oldest member of K-pop phenomenon BTS, was discharged from South Korea's army on Wednesday after 18 months of duty, the first member of the group to wrap up the mandatory national service that put their music careers on hold.",
+        "url": "https://www.reuters.com/lifestyle/jin-oldest-member-k-pops-bts-finishes-army-service-south-korea-2024-06-12/",
+        "urlToImage": "https://www.reuters.com/resizer/v2/P4QI7KF4DNNTTCSBTM6ZBP4WDM.jpg?auth=4dc3a9fe54bfcb77475797439164eddfc12944d6e404f98bed0ee8747de89d9c&height=1005&width=1920&quality=80&smart=true",
+        "publishedAt": "2024-06-12T03:02:16Z",
+        "content": null
+      },
+      {
+        "source": {
+          "id": "google-news",
+          "name": "Google News"
+        },
+        "author": "BBC.com",
+        "title": "Hamas seeks 'complete halt' to war in Gaza proposal response - BBC.com",
+        "description": null,
+        "url": "https://news.google.com/rss/articles/CBMiLmh0dHBzOi8vd3d3LmJiYy5jb20vbmV3cy9hcnRpY2xlcy9jdjIyNWw4bDdqem_SAQA?oc=5",
+        "urlToImage": null,
+        "publishedAt": "2024-06-12T02:34:43Z",
+        "content": null
+      },
+      {
+        "source": {
+          "id": "google-news",
+          "name": "Google News"
+        },
+        "author": "BBC.com",
+        "title": "UN 'shocked' at Israeli hostage rescue's impact on Gaza civilians - BBC.com",
+        "description": null,
+        "url": "https://news.google.com/rss/articles/CBMiLmh0dHBzOi8vd3d3LmJiYy5jb20vbmV3cy9hcnRpY2xlcy9ja2RkenZsOXgwMG_SAQA?oc=5",
+        "urlToImage": null,
+        "publishedAt": "2024-06-12T01:28:28Z",
+        "content": null
+      },
+      {
+        "source": {
+          "id": null,
+          "name": "BBC News"
+        },
+        "author": null,
+        "title": "French right in uproar over leader Ciotti's call for far-right alliance - BBC.com",
+        "description": "Republicans leader Ciotti angers colleagues after he calls for an electoral pact with National Rally.",
+        "url": "https://www.bbc.com/news/articles/cydd97g1g5po",
+        "urlToImage": "https://ichef.bbci.co.uk/news/1024/branded_news/85e7/live/23f74160-280c-11ef-80aa-699d54c46324.jpg",
+        "publishedAt": "2024-06-12T01:05:29Z",
+        "content": "The leader of France's right-wing Republicans party, Eric Ciotti, has sparked an outcry after he backed an alliance with the far-right National Rally in snap elections announced by President Emmanuel… [+4696 chars]"
+      },
+      {
+        "source": {
+          "id": null,
+          "name": "NBCSports.com"
+        },
+        "author": "NBC Sports",
+        "title": "Kyrie Irving told Luka Doncic 'I got to play better for him… it's my fault' - Yahoo Sports",
+        "description": "A Dallas turnaround in the NBA Finals starts with a more aggressive Irving getting buckets.",
+        "url": "https://www.nbcsports.com/nba/news/kyrie-irving-told-luka-doncic-i-got-to-play-better-for-him-its-my-fault",
+        "urlToImage": "https://s.yimg.com/ny/api/res/1.2/wZ827sCqOzPjTyljezYpUQ--/YXBwaWQ9aGlnaGxhbmRlcjt3PTEyMDA7aD02NzU-/https://media.zenfs.com/en/nbcsports.com/190db50a0e29c9875b5735b5c8caca54",
+        "publishedAt": "2024-06-12T00:41:00Z",
+        "content": "The Dallas Mavericks are not down 0-2 in the NBA Finals because of Kyrie Irving.\r\nHowever, any hopes the Mavericks have of a comeback against the Celtics start with Irving playing a lot more like the… [+2177 chars]"
+      },
+      {
+        "source": {
+          "id": null,
+          "name": "BBC News"
+        },
+        "author": null,
+        "title": "Spread of tiger mosquito behind rise of dengue fever in Europe - BBC.com",
+        "description": "Concerning rise in dengue fever cases as climate change pushes mosquitoes further north, warn experts.",
+        "url": "https://www.bbc.com/news/articles/ce5520m6x2go",
+        "urlToImage": "https://ichef.bbci.co.uk/news/1024/branded_news/a801/live/0e0de9e0-27ed-11ef-8748-d589b4996777.jpg",
+        "publishedAt": "2024-06-12T00:27:25Z",
+        "content": "By Philippa Roxby, Health reporter\r\nMosquitoes can spread disease from person to person, and from place to place\r\nAn invasive species of mosquito has been found in 13 countries in the EU, including F… [+3909 chars]"
+      },
+      {
+        "source": {
+          "id": "the-washington-post",
+          "name": "The Washington Post"
+        },
+        "author": "Natalie B. Compton",
+        "title": "Apple iOS 18 promises iMessage via satellite, a safety boost for hikers - The Washington Post",
+        "description": "With the fall’s iOS 18 update, hikers can map trails and stay in touch over iMessage and SMS.",
+        "url": "https://www.washingtonpost.com/travel/2024/06/11/apple-ios-18-imessage-satellite-camping-hiking/",
+        "urlToImage": "https://www.washingtonpost.com/wp-apps/imrs.php?src=https://arc-anglerfish-washpost-prod-washpost.s3.amazonaws.com/public/MEZCEG4Q2JCDZDTDROO2EFE7PQ.jpg&w=1440",
+        "publishedAt": "2024-06-12T00:24:00Z",
+        "content": "Apple revealed big changes at its annual Worldwide Developers Conference on Monday, from ways to hide your secret apps to new AI tools. But a few of the announcementswere geared toward outdoor enthus… [+2648 chars]"
+      },
+      {
+        "source": {
+          "id": null,
+          "name": "Rolling Stone"
+        },
+        "author": "Charisma Madarang",
+        "title": "Françoise Hardy, French Singer and International Sixties Icon, Dead at 80 - Rolling Stone",
+        "description": "Françoise Hardy, the French icon and singer known for evoking romantic existentialism in her music, has died at the age of 80.",
+        "url": "http://www.rollingstone.com/music/music-news/francoise-hardy-dead-obituary-1235038345/",
+        "urlToImage": "https://www.rollingstone.com/wp-content/uploads/2024/06/FrancoiseHardy.jpeg?w=1600&h=900&crop=1",
+        "publishedAt": "2024-06-12T00:09:33Z",
+        "content": "Françoise Hardy, the French icon and singer known for evoking romantic existentialism in her music, has died at the age of 80.\r\nHer son, Thomas Dutronc, confirmed her death in a Facebook post. Sharin… [+1664 chars]"
+      },
+      {
+        "source": {
+          "id": null,
+          "name": "CNBC"
+        },
+        "author": "Pia Singh",
+        "title": "Stock futures are little changed ahead of Fed's rate decision, consumer inflation data: Live updates - CNBC",
+        "description": "The S&P 500 and the Nasdaq Composite rose to records on Tuesday, boosted by Apple.",
+        "url": "https://www.cnbc.com/2024/06/11/stock-market-today-live-updates.html",
+        "urlToImage": "https://image.cnbcfm.com/api/v1/image/107416635-1716220528528-107416635-17159624062024-05-17t152050z_194642493_rc2ds7aajvst_rtrmadp_0_usa-stocks.jpeg?v=1716220645&w=1920&h=1080",
+        "publishedAt": "2024-06-11T23:43:00Z",
+        "content": "Stock futures oscillated near the flatline Tuesday night as investors awaited the Federal Reserve's interest rate decision and May's consumer inflation data.\r\nFutures tied to the Dow Jones Industrial… [+1792 chars]"
+      }
+    ]
+  }
\ No newline at end of file
diff --git a/Web development/NewsApp/src/setupTests.js b/Web development/NewsApp/src/setupTests.js
new file mode 100644
index 0000000..8f2609b
--- /dev/null
+++ b/Web development/NewsApp/src/setupTests.js	
@@ -0,0 +1,5 @@
+// jest-dom adds custom jest matchers for asserting on DOM nodes.
+// allows you to do things like:
+// expect(element).toHaveTextContent(/react/i)
+// learn more: https://github.com/testing-library/jest-dom
+import '@testing-library/jest-dom';