diff --git a/README.md b/README.md
index 91bcc9f078d309a3a3209f2d639e032e1c855238..2d2f51665e75b80a6a13ea38bea6e41b94723354 100644
--- a/README.md
+++ b/README.md
@@ -7,4 +7,5 @@
 ## 27/03/2025
   #### I have just added the fetch POST commands to push my photos to my server. I have attempted to use Axios to communicate with the server, but Fetch seemed to work easier for me. I used RNFS to change the path of my file; VisionCamera makes the path of the photos hidden so RNFS is required. 
 
-  
\ No newline at end of file
+## 05/04/2025
+#### I have began to implement the Swipe Engine, similar to Tinder Swiping Engine. I am successful in fetching the Image URL's stored on my Supabase server and fetching them to my Swipescreen. Soon enough, I will have various images that will allow for users to swipe left and right on images. 
\ No newline at end of file
diff --git a/navigation/AppNavigation.js b/navigation/AppNavigation.js
index 524692f196896e289c21e3ae56e118e9bb760c79..82099fa3e1ed66bb8848fe71486fd4b2b964acbc 100644
--- a/navigation/AppNavigation.js
+++ b/navigation/AppNavigation.js
@@ -2,7 +2,7 @@ import React from 'react';
 import { NavigationContainer } from '@react-navigation/native';
 import { createStackNavigator } from '@react-navigation/stack';
 import CameraScreen from '../screens/CameraScreen';
-// import SwipeScreen from '../screens/SwipeScreen';
+import SwipeScreen from '../screens/SwipeScreen';
 import MapScreen from '../screens/MapScreen';
 // import ProfileScreen from '../screens/ProfileScreen';
 
@@ -13,7 +13,7 @@ const AppNavigator = () => {
     <NavigationContainer>
       <Stack.Navigator initialRouteName="Camera">
         <Stack.Screen name="Camera" component={CameraScreen} />
-        {/* <Stack.Screen name="Swipe" component={SwipeScreen} /> */}
+        <Stack.Screen name="Swipe" component={SwipeScreen} />
         { <Stack.Screen name="Map" component={MapScreen} /> }
         {/* <Stack.Screen name="Profile" component={ProfileScreen} /> */}
       </Stack.Navigator>
diff --git a/screens/CameraScreen.js b/screens/CameraScreen.js
index bf7e2398453f87da00e437bfae99b9610e6461ee..7e40e419d4398af21a11525a9710891fe0e8501f 100644
--- a/screens/CameraScreen.js
+++ b/screens/CameraScreen.js
@@ -3,6 +3,8 @@ import React, { useEffect, useRef, useState } from 'react';
 import { View, ActivityIndicator, StyleSheet, Pressable, Text } from 'react-native';
 import { Camera, useCameraDevice, useCameraPermission } from 'react-native-vision-camera';
 import RNFS from 'react-native-fs';
+import { supabase } from '../components/Supabase.js';
+
 
 // import axios from 'axios';
 
@@ -33,6 +35,7 @@ const CameraScreen = ({ navigation }) => {
     console.log("Photo captured:", photo.path);
 
 
+
     
   const formData = new FormData();
   formData.append('photo', {
@@ -41,7 +44,9 @@ const CameraScreen = ({ navigation }) => {
     name: 'photo.jpg',
   });
 
-  const response = await fetch('https://7317-82-7-110-137.ngrok-free.app/upload', {
+  
+
+  const response = await fetch('https://ff13-82-7-110-137.ngrok-free.app/upload', {
     method: 'POST',
     body: formData,
     headers: {
@@ -50,11 +55,30 @@ const CameraScreen = ({ navigation }) => {
     },
   });
 
+  console.log("FormData for upload:", formData);
+
+
+
   const data = await response.json();
-  console.log('Uploaded Photo URL:', data.photoUrl);
+  console.log('Response for PhotoURL:', data.photoUrl);
 
-  
-};
+
+  // Save the photo URL to Supabase
+  const { info, error } = await supabase
+  .from('photos') // Replace 'photos' with your actual table name
+  .insert([{ url: data.photoUrl }])
+  .select()
+
+
+
+
+
+if (error) {
+  console.error('Error saving photo URL to Supabase:', error);
+} else if (info) {
+  console.log('Photo URL saved to Supabase:', info[0].url);
+}
+  };
 
   const onStartRecording = async () => {
     if (!camera.current) return;
@@ -92,6 +116,10 @@ const CameraScreen = ({ navigation }) => {
           <Text style={styles.buttonText}>Go to Map</Text>
         </Pressable>
 
+        <Pressable onPress={() => navigation.navigate('Swipe')} style={styles.captureButton}>
+          <Text style={styles.buttonText}>Go to Swoipe</Text>
+        </Pressable>
+
       </View>
     </View>
   );
diff --git a/screens/SwipeScreen.js b/screens/SwipeScreen.js
new file mode 100644
index 0000000000000000000000000000000000000000..621cda9aeaa125b243d4416a451818311718971f
--- /dev/null
+++ b/screens/SwipeScreen.js
@@ -0,0 +1,77 @@
+import React, { useEffect } from 'react';
+import { StyleSheet, Text, View , Image} from 'react-native';
+import {SafeAreaView, SafeAreaProvider} from 'react-native-safe-area-context';
+import { supabase } from '../components/Supabase';
+
+const SwipeScreen = () => {
+const [images, setImages] = React.useState(null);
+const [loading, setLoading] = React.useState(false);
+const [error, setError] = React.useState(null);
+
+
+useEffect(() => {
+const DisplayAnImage = async () => {
+try{
+  setLoading(true);
+  const { data, error } = await supabase
+    .from('photos')
+    .select('url')
+    .eq('id', 10); // Replace with the actual ID of the photo you want to display
+
+
+    console.log("Supabase response:", data, error);
+
+  if (error) throw error;
+  setImages(data);
+} catch (err) { 
+  setError(err.message);
+  console.error('Error fetching image:', err);
+} finally {
+  setLoading(false);
+}
+};
+
+DisplayAnImage();
+}, []);
+    
+
+
+return (
+  <SafeAreaProvider>
+    <SafeAreaView style={styles.container}>
+      {loading ? (
+        <Text>Loading...</Text> // Show loading message
+      ) : error ? (
+        <Text style={styles.errorText}>Error: {error}</Text> // Show error message
+      ) : images ? (
+        <Image
+  style={styles.image}
+  source={{ uri: images[0].url }}
+/>
+      ) : (
+        <Text>No image available</Text> // Handle case where no image is found
+      )}
+    </SafeAreaView>
+  </SafeAreaProvider>
+  );
+};
+
+export default SwipeScreen;
+
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  image: {
+    width: 200,
+    height: 200,
+    resizeMode: 'contain',
+  },
+  errorText: {
+    color: 'red',
+    fontSize: 16,
+    },
+  });
\ No newline at end of file