This week was a low week, I needed to dedicate more time to myself and take a step back on the actions I make, to keep me back on track.

Typescript

This week was a huge step towards my learning of Typescript. I decided to dedicate more time to learning it to contribute more and understand deeper the contribution project I recently joined.

I learned how typescript behaves and understood that it is used during development. I set up a small project to learn it and then I switched my current side project to use it in frontend to make it both easy and useful to learn, plus by setting up my current react side project, I'm setting myself up for a "real" environment learning for contributions.

I learned about types, interfaces, type, union, generics and so on. I used those links to learn it.

• First 3 hours free from Academind
• Typescript website
• Typescript handbook ( still reading this book )

I start loving typescript as it can help me understand faster what is going on. If you know Javascript I think typescript is a good and useful next step.

React project setup to typescript and changes made

This week as I said above, I decided to make the switch to a typescript setup with React. In fact, it went really well and fast as React script helps us. The only thing we need to do is install the dev dependencies which contains types, initiate tsc and change the js files to tsx and we're good to go to make our first changes.

First install typescript globally using npm ( so you can test typescript files without setup a whole project, optional ) npm install -g typescript

Install the dependencies npm install --save-dev typescript @types/react @types/react-dom @types/node @types/react-router-dom

Then initiate typescript file ( tsconfig.json ) tsc --init

Basically, if you have dependencies for your project, the types to install uses this format `@types/YOUR_DEPS```. But make a search first.

App progress

Thanks to a great post Import absolute de modules pour React et React Native (FR), I made the changes on my app to be able to use absolute path instead of relative ones. What changes? Here's what changes.

Before

import MyComponent from "../../../../components/buttons/MyComponent";

After

import MyComponent from "components/buttons/MyComponent";

It makes the code clearer and more readable. And let's be honest, it feels cool :D

Here's link in English Configure absolute path in react

( For typescript add those lines to .tsconfig.json instead )

I also made the auth flow working, we can login and access the app. The auth flow still need to be tested but I need to put on heroku the new version of the API, but I need to make changes and tests before, so I hope this week the new API version will be online.

Low week and my current solution to prevent mess

Though this week has been a low one, with Monday to Wednesday, I felt like I have to bring some order to my life.

My process when those low times come is, first I feel like I have to jot down everything on a piece of paper, make a "brain dump". And usually cleaning the room is also a good idea.

Then I go back to my goals, my todo list and the notes I've taken. Then I sequentially clear the notes, review the goals and the next steps for each one of them. I also enjoy breaks with deep breathing exercise and meditation. I also skipped some workouts so I had to come back on it too.

The thing is that sometimes I get hyped by the number of new things I want to learn but currently isn't relevant to my needs. But still, curiosity is here, so I make a list and need to review it in order to tell my brain, don't worry I put it here.

Ubuntu Update

Yesterday I decided to make the Ubuntu Update from 18.04LTS to 20.04LTS, and first I'm not a master of Linux and I'm far from that, actually, I only use it in a "surface way", I use simple commands line and sometimes, I like to play with more advanced concepts such as user rights, group rights, etc... But still, first, the visual changes are insane. The colours and the design are great and it feels so good to use this new Ubuntu. The Nautilus file system is better, the login screen is much more elegant. There are so much small details that added together made the experience far greater.

Then there are some cool new features we had not ( or not that easy to use ). The settings for example are more complex than the previous version. For more in-dept information on the parts I'm curious about I'll dedicate some times to it this week.

React Learning

I'm still improving my learning with React and this week was about Render Props, HOC. I do know how to use Render props but was not aware of this term, and I understand how works HOC, and can understand code using it but still struggle to come up with my own creation. But I'm starting to be confident in my skills and that is a great achievement for me.

I learned about mixin which I didn't know before and read a post about why not to use it.

Lots of learning for contributions

As I said above, my learning of Typescript is tied to the contribution of an open-source project I joined recently, and in order to understand more the code, I had to learn typescript and go deeper with react advanced concepts. So this week was about lots of reading code and understanding patterns.

Conclusion

This week was not as productive as I wish, but still lots of learning and understanding. Lots of job applying too and getting a message back or feedback has become such a great reward . I'm so excited to start the next week and really dive so much deeper with typescript and React and start to really enjoy what I'm able to do ( or at least understand ).

---

Thanks to Ken Cheung for the free cover picture.