My first ever frontend code challenge using React is over! Were tears involved in the process? That only God knows. I encountered some unexpected issues but I did my best to resolve them and I am proud of myself for not giving up and completing the task.

Now, what’s done is done and I’d like to have some time to think about the issues I had and try to understand why they happened and what would be the best way to fix them.

💯 Areas for Improvement & Questions

1. Why did AJAX not work when the JSON file was in the src folder but did work in the public folder?

One of the general specifications of the challenge was to show profile data provided a JSON object…

This is a summary of my learning by making 3 small JS toy projects. I made Target Pointer, Shopping List, and Carrot Game. You can check the projects here. They include very basic yet essential front-end knowledge. Now, I am going to briefly illustrate 5 important concepts/things I learned.

⚠️ 1. ‘defer’ & Resource events

in Target Pointer📍

— The code block below is an attempt to adjust the target image to be center.
— However, it does not work because targetHalfWidth and targetHalfHeigthare somehow `0`, even though it does not look like it on the browser.

const target = document.querySelector(“.target”);const targetRect = target.getBoundingClientRect();

Long story short: Yes, you can.

I thought the array was the only answer!

So far, I’ve been only using arrays for state management in React. Because of its method — map(). When writing JSX, this particular array method can be very powerful.

Let’s give the object a chance

However, depending on the size of the data, to choose an array as a data structure might not be the best thing to do. I had had an experience where I wanted to use an object for state management but ended up changing it to an array, simply because I didn’t know how to implement it in JSX!

The solution is Object.keys()

Object.keys() returns…

First of all, I think it is important to mention that ReDI School is not just another fancy coding bootcamp in Berlin. ReDI School is about social integration and giving people opportunities. Fortunately enough, I got a chance to be part of the community, and here are the experiences I’d like to share.

1. Trust the Future Me

When I applied to ReDI School, I had to choose between the JavaScript course and the React course. At first, I applied for the JavaScript course and I didn’t think about that too much. …


A Berlin-based random foreigner who does front-end stuff.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store