Mastering a New Framework: Practical Tips for Learning and Implementing Complex Solutions
We’ve all been there: we want to learn about a new framework or technology so we go to its official webpage and carry out the online tutorial. Unfortunately, these tutorials generally aim to cover a basic first approach to the tool, but not enough when we want to use them for something more complex such as creating a product for a production environment. The aim of this blog then is to provide some tips on how to approach learning a new framework or technology.
I remember when I used to have more free time at work and decided to learn how to use React. I carried out the online tutorials from the official website, which I found quite interesting but I was not even close to being able to use it in a complex project. For example: one of the tutorials only covers React components and hooks, but not its characteristics which are highly important in a webpage, such as:
- Authorization and authentication handling using OAuth.
- Error handling using external services.
- Application’s state handling using Redux or Mobx.
- APIs calls using Fetch or Axios.
- Using external libraries, as in some technologies this may be complex. Such is the case of Expo. Docker deployment or any other solution.
You may be thinking: that’s what the advanced guide on the website is for, as it even tackles even more complex topics. While I agree with that, those guides fail to give answers to the above mentioned, which I believe are quite basic and should be present in any production solution.
That is why, I believe the best way to learn a new technology is by trying to simulate a project including all the characteristics a production solution should have. I know it’s not easy to come up with a good idea for a project and then develop it so thoroughly. Instead, I suggest not to bother so much about the functionality of the project in itself.
If we want to implement authentication and authorization using OAuth, it isn’t really important whether we try it in a social network system or in an account management software, what’s really important is that certain routes access, websites or resources are restricted according to the characteristics we consider important. So don’t waste time trying to think of an appealing idea, just roll up your sleeves and get down to work.
In the same line of thought, during my last stay on the bench (which is what we say in Kaizen when someone has not been assigned to any client yet) I decided to learn how to use NestJS to implement a solution using microservices. While I was acquainted with that topic as I had seen it in University, I never had the chance to put it into practice. The first thing I did was to resort to something very good we have here at Kaizen: our workmates!
In Kaizen developers work in teams which are assigned to different clients. Different teams often use different technologies and architectures. Developers at Kaizen are always willing to help their peers, even if they are not part of the same team, so I decided to ask one of my colleagues working with microservices for help.
This colleague told me about the technology they used to implement microservices in his project and some tips on what to bear in mind when using it. Based on that I came up with a list of characteristics which are necessary for a solution of this kind:
- Service mesh, to facilitate communication among microservices, state handling, etc.
- Database connection to maintain changes in the system.
- You can have several instances of deployment.
- Since there is a service mesh, setting up a debugger is not always so simple.
- Track what’s going on in the system and how good its performance is.
- Use Swagger to be able to try the services exposed by the API.
- Use OAuth for authentication and authorization.
As you can see, there are many things to bear in mind. This is why it is highly advisable to count with a working plan to help you work out the different steps and to set short term goals to feel motivated. This is how I planned it:
1. API Rest with NestJS.
2. Create microservices using @NestJS/microservices.
3. Docker deployment.
4. Service mesh using Dapr and connecting the microservices.
5. Docker-compose deployment.
6. Use a state manager from Dapr to establish a database connection.
7. Docker image adjust to support deployment in Kubernetes.
8. Debugger setup.
9. Swagger configuration.
10. State tracking using zipkin.
11. Error tracking using sentry.
12. OAuth using auth0.
As you can see, I made some changes based on my own experience and interests. For example, I made the database connection using Dapr as connecting databases from Node.js isn’t very different from doing it using NestJS. Moreover, I split the deployment in two as first I wanted to learn docker, then docker-compose and finally Kubernetes.
I may not have the same experience I have using other frameworks and implementing a solution based on what I learnt may not be so fast and efficient. However, I consider that I have learnt how to use NestJS, Dapr, Docker, Kubernetes satisfactorily. I could also create a Github repository where I have everything ready if I have the opportunity to put it all into practice in a real situation with a client. This repository can also be used to pass on knowledge to future colleagues.
In conclusion, learning a new framework is not only about following some basic tutorials, but more like diving into simulating projects which involve more complex characteristics and challenges. By simulating a project with characteristics necessary for a production solution, we can gain practical knowledge and face common obstacles present in the real world.
In addition, seeking peers and experts' support aids our learning and offers us a broader perspective. Designing a working plan and setting up short-term achievements can help us feel motivated and to obtain non-stop progress. Finally, this approach allows us to develop hard skills and to create a knowledge repository that we can share with others in the future.