Project Update: Solving Access Restriction
Tags: webdev, javascript, beginners, programming
Published: 2023-05-29 22:47:52

Day 118 of #365DaysOfCode

Finally cracked the problem that had me puzzled for the last 3–4 days. The solution was right under my nose all along! Now, users are restricted from accessing irrelevant pages, ensuring a personalized experience. In this blog post, I will share how I successfully tackled this issue by leveraging cookies and profile information.

To ensure users can only view pages relevant to their user type, I implemented a method that fetches the user’s profile information from the database. By examining the signed-in user’s cookie, I retrieved their unique user ID. Using this ID, I made an API request to obtain their profile data, which includes information about their user type.

Example Code Explanation: The following code snippet demonstrates the process of retrieving the profile information and determining the user type:

```
// Retrieving the profile information of the currently signed-in user.

const userId = cookies.UserId;
const [user, setUser] = useState([]);
const [freelancer, setFreelancer] = useState(null);
const getUser = async () => {
  const route = "freelancerprofile";

  try {
    const response = await axios.get(`/${route}`, {
      params: { userId },
    });
    setUser(response.data);
  } catch (err) {
    console.log("error getting user profile info", err);
  }
};

useEffect(() => {
  getUser();
}, []);

// Ensuring that the signed-in user is a freelancer to grant them access to view the current component.
useEffect(() => {
  if (user?.user_id) {
    setFreelancer(true);
  }
}, [user]);

```
In this code, we first retrieve the user’s ID from the cookie. Then, using the axios library, we make an API request to fetch the user’s profile information. Upon receiving the response, we store the data in the user state variable.

Next, we use an additional useEffect hook to check if the user object contains the user_id property instead of client_user_id. If a user_id exists, it indicates that the user is a freelancer. So, we set the freelancer state to true, allowing access to the relevant components.

Day 18 of #100DaysOfPython ✓

Today, as part of the course, I built a simple calculator using recursion. It’s a common programming tradition to create a calculator when learning a new language. Excitingly, tomorrow we will be delving into building a blackjack game. For those curious, I am currently enrolled in Angela Yu’s 100 Days of Python Bootcamp course.

```
def add(n1, n2):
  return n1 + n2

def subtract(n1, n2):
  return n1 - n2

def multiply(n1, n2):
  return n1 * n2

def divide(n1, n2):
  return n1 / n2

operations = {
  "+": add,
  "-": subtract,
  "*": multiply,
  "/": divide,
}

def calculator():
  num1 = float(input("What's the first number?: "))
  for symbols in operations:
    print(symbols)
  should_continue = True

  while should_continue:
    operation_symbol = input("Pick an operation from the line above: ")
    num2 = float(input("What's the next number?: "))
    calculation_func = operations[operation_symbol]
    answer = calculation_func(num1, num2)
    print(f"{num1} {operation_symbol} {num2} = {answer}")

    if input(f"Type 'y' to continue calculating with {answer} or type 'n' to start a new calculation: ") == "y":
      num1 = answer
    else:
      should_continue = False
      calculator()

calculator()

```
Happy coding!