diff --git a/src/components/UI/RenderCount.js b/src/components/UI/RenderCount.js
new file mode 100644
index 0000000..1fdce24
--- /dev/null
+++ b/src/components/UI/RenderCount.js
@@ -0,0 +1,24 @@
+import { useRef } from "react";
+import { Text, StyleSheet } from "react-native";
+
+const RenderCount = ({backgroundColor = 'dodgerblue', fontColor = 'white'}) => {
+// Initialisation -------------
+// State ----------------------
+ const renderCount = useRef(0);
+ renderCount.current += 1;
+// Handlers -------------------
+// View -----------------------
+ return (
+
+ Number of renders: {renderCount.current}
+
+ );
+};
+
+const styles = StyleSheet.create({
+ count: {
+ padding: 5,
+ },
+});
+
+export default RenderCount;
\ No newline at end of file
diff --git a/src/components/screens/ModuleListScreen.js b/src/components/screens/ModuleListScreen.js
index 0cbe4c1..7e8df26 100644
--- a/src/components/screens/ModuleListScreen.js
+++ b/src/components/screens/ModuleListScreen.js
@@ -3,7 +3,7 @@ import { StyleSheet } from "react-native";
import Screen from "../layout/Screen";
import ModuleList from "../entity/modules/ModuleList";
import initialModules from "../../data/modules.js";
-
+import RenderCount from "../UI/RenderCount";
const ModuleListScreen = () => {
// Initialisation -------------
@@ -22,6 +22,7 @@ const ModuleListScreen = () => {
return (
+
);