I already wrote here on the blog about my favorable opinion about designers learning to code. This week, in the middle of this monotonous quarantine that everyone is in, I decided to use the spare time to learn a little more. Regarding the quarantine itself, I will not comment on anything here, as we already have too much news about the virus. Either way, wash your hands really well and be hygienic.
I was just brownsing the interwebs when I came across with a video made by Filipe Deschamps -- a YouTuber focused on the programming area, whose channel I strongly recommend –- talking about the "Omnistack Week": a free online course with the duration of one week, conducted by Rocketseat and done a few times a year.
What is it?
It is a week-long course in which you learn to create a project from scratch, using NodeJS, ReactJS and React Native. Each of these technologies helps to implement the parts of the product. To know:
- NodeJS: It's the JavaScript engine behind browsers based on Chrome, known as V8, but without the browser. What remains is a platform where it is possible to develop applications using only JS.
- ReactJS: It is a JavaScript library for building user interfaces. With it you can see the information changing in real time, without the need to reload the page in the browser.
- React Native: It is a framework aimed at creating applications for mobile devices. Its main advantage is that it is not necessary to create two versions in different languages to support iOS and Android. Only with JavaScript it is possible to create applications for both platforms.
How is it?
The course is very straightforward: the goal was to create a fictional service called "Be The Hero", which consisted of helping NGOs to solve small problems involving modest amounts of money.
This product should have of a Backend (creation of a database and communication with it), a Frontend (UI) and a mobile application. All this to be delivered within a week!
Each day a new class, covering the technology and its code implementation. About an hour and a half each class.
My experience
When I heard about Omnistack Week, it was already a Wednesday and I had already missed three classes! This ended up delaying me in delivering the parts, but it worked out fine in the end.
Backend
The most unknown part to me was creating the Backend, because I had never done this before: I always used ready-made services or APIs. I thought it would be extremely complicated, but it wasn't really the case.
Frontend
The UI creation part was smooth. I had to adapt myself to the peculiarities of ReactJS. In it, HTML is incorporated into JavaScript, called JSX. I had used AngularJS and VueJS before, and the way these two work is very different. But there are points in common which helped me on the journey, like component creation, for example.
Mobile App
React Native is not that difficult. What differs the most from ReactJS is the fact that CSS is not supported in the components. In RN, everything is JavaScript, including styles: They are all treated as objects, and properties like padding-top end up becomingpaddingTop, because in JavaScript you can't use hyphens.
Other than that, HTML elements are substitud for a markup without semantics. It's like going back to the time when <div> and <span> were all there was to semantics in HTML.
Minhas dificuldades
For one who had never worked with React before, I was not bad! My biggest difficulty was, strangely, with the thing that would ease the process of mobile development, Expo.
Expo, for those who do not know, is a way to view the application created with React Native in real time on your phone, without having to install all the dependencies on the computer. Just install Expo in the project and download the app with the same name from Google Play or the App Store. Then, using the app, read a QR Code that will be generated in your PC's development tools.
For some reason, which I still didn't understand until the publication of this article, I had problems installing it, which took me much longer than I wished, however, after I managed to stabilize everything, it was very good. Compared to NativeScript, which I already used before, it was a paradise.
As for the other difficulties, it was adapting to the React way of doing things. It is strange to make the layout in JavaScript at first, but the result is worth it.
Wrapping it up
I enjoyed the experience and now I feel more confident in using the technologies above mentioned in future projects. It's great to see that you can do so much without having to master three or more programming languages. The only annoying thing about all of this is the uncertainty in the air because of this quarantine and social isolation. I'm glad I was able to enjoy this phase and learn something new. If I discover new stuff, I will post it here on the blog.
I remember talking in another article here about the lemons that life gives. It is up to us to turn them into lemonade. And I love lemonades. For those interested in checking the result, I left the link to the project's repository on Github down below.