diff --git a/index.php b/index.php
new file mode 100644
index 0000000..1ea718a
--- /dev/null
+++ b/index.php
@@ -0,0 +1,61 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <!-- Required meta tags -->
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+
+    <!-- Bootstrap CSS -->
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.rtl.min.css" integrity="sha384-+4j30LffJ4tgIMrq9CwHvn0NjEvmuDCOfk6Rpg2xg7zgOxWWtLtozDEEVvBPgHqE" crossorigin="anonymous">
+
+<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script>
+<body>
+
+  <?php include "validation.php" ?>
+    <?php if(empty($_POST) || !empty($name_error) || !empty($last_error) ||!empty($file_error)): ?>
+      
+     
+        <form action="" method="post" enctype="multipart/form-data">
+            <label for="">Firstname</label>
+            <br>
+            <input type="text" name="firstname" class="feedback-input" placeholder="First Name" >
+            <span><?= $name_error ?></span>
+            <br>
+            <label for="">Lastname</label>
+            <br>
+            <input type="text" name="lastname" class="feedback-input" placeholder="Last Name">
+            <span><?= $last_error ?></span>
+            <br>
+            <input type="file" name="profileimage"  class="feedback-input">
+            <span><?= $file_error ?></span>
+            <br>
+            <input type="submit" name="submit" class="btn btn-primary" />
+</form>
+<?php  
+else:
+?>
+<div>
+<ul class="list">
+        <li class= "list"><?php  echo "<h1>" . $_POST ['firstname'] .' '.  $_POST ['lastname'] ."</h1>"; ?></li>
+    </ul>
+    <img src="<?php print "uploads/" .  $porfile_image;  ?>">
+    
+</div>
+
+<?php endif; ?>
+
+
+<style>
+    body{
+        margin: 50px;
+        background-color: #D6EAF8 ;
+    }
+    input{
+        width: 50%;
+        padding: 10px;
+
+    }
+
+</style>
+</body>
+</html>
diff --git a/validation.php b/validation.php
new file mode 100644
index 0000000..36df37f
--- /dev/null
+++ b/validation.php
@@ -0,0 +1,60 @@
+
+<?php
+$firstname = $lastname = "";
+
+$name_error = $last_error = $file_error = "";
+
+
+
+if($_SERVER["REQUEST_METHOD"] == "POST") {
+    
+    if(empty($_POST["firstname"])){
+        $name_error = "Please fill in the name field";
+    }
+        else{
+            $firstname = $_POST["firstname"];
+
+            if(!ctype_alpha($_POST['firstname'])){
+                $name_error ="it is an invalid firstname";
+            }
+        }
+       
+        if(empty($_POST["firstname"])){
+          $last_error = "Please fill in the lastname field";
+      }
+          else{
+              $firstname = $_POST["firstname"];
+  
+              if(!ctype_alpha($_POST['lastname'])){
+                  $name_error ="it is an invalid lastname";
+              }
+          }
+     
+
+            if(isset($_FILES['profileimage'])){
+                $target_dir = getcwd() . "/uploads/";
+                $porfile_image = basename($_FILES["profileimage"]["name"]);
+                $allowed_ext = array("jpg" => "image/jpg",
+                                    "jpeg" => "image/jpeg",
+                                    "gif" => "image/gif",
+                                    "png" => "image/png");
+                $profile_image_url = NULL;
+                $ext = pathinfo($porfile_image, PATHINFO_EXTENSION);
+                if (!array_key_exists($ext, $allowed_ext)) {
+                    $file_error="please choose image";
+                }
+                if(in_array($_FILES["profileimage"]["type"], $allowed_ext)) {
+                    if(!file_exists($target_dir)) {
+                        mkdir($target_dir);
+                    }
+                    if(move_uploaded_file($_FILES["profileimage"]["tmp_name"], $target_dir . $porfile_image) ){
+                        $profile_image_url = $target_dir.$porfile_image;
+                    }
+                } 
+             }
+            
+}
+
+
+    
+    
\ No newline at end of file
