This week we explored state, hooks, effects, custom hooks, layout structures, and icon usage in React. We also created a custom hook called useOrientation, which helped me better understand how hooks can be used to abstract and reuse logic across components. Diana set us homework to write a page explaining the purpose and functionality of our custom hook, which I found particularly valuable as it required me to articulate not just what the hook did, but why it was useful within an application.
// Imports useState and useEffect from React
import { useEffect, useState } from "react";
// Imports Orientation from Expo-Screen-Orientation
import { Orientation, addOrientationChangeListener, getOrientationAsync } from "expo-screen-orientation";
export default function useOrientation() {
// Sets the State for Orientation,
const [CurrentOrientation, setOrientation] = useState(Orientation.UNKNOWN)
// Async Function, Executed in the Background, Await Function = Wait to Obtain the Result, get Orientantion and Wait for Eesult (not stopping all the code for it)
const loadOrientation = async () => {
const Orientation = await getOrientationAsync();
setOrientation(Orientation);
}
// console.log ("Hello World");
useEffect(() => {
// Execute the Function
loadOrientation()
// Load the Orientation, Everytime is Changes its Update Screen Orientation Value
addOrientationChangeListener(loadOrientation)
});
return CurrentOrientation;
};
Through this work, I became more aware of a recurring difficulty I have with naming conventions. I often struggle to decide on clear and appropriate names for functions, variables, and custom hooks, as well as remembering when to use specific language-defined naming patterns. This highlighted how important naming is for code readability and maintainability, not just functionality. I have found this challenging to research independently, as it can be difficult to phrase precise questions or find consistent guidance online.
I also really enjoyed the weekly problem-solving tasks, which offer a different way of thinking compared to standard coding exercises. While the first week’s problems felt accessible and enjoyable, this week’s tasks appear significantly more complex. However, I recognise that approaching them methodically and breaking them into smaller steps will likely make them more manageable.
Overall, this week strengthened my understanding of React hooks while highlighting the importance of clear naming and structured problem-solving. It reinforced that consistent practice and reflection help me internalise new concepts and build confidence for future development projects.