Here at Moove It, we like to stay updated on the latest technologies. One of these is React Native, the Javascript framework that is taking over the mobile world by storm. Using it to develop an application for both iOS and Android is a breeze!
As a React Native Development Company, and considering it may be difficult to level the performance of our staff, we like to deliver internal workshops addressed to all our developers in order to spread the knowledge!
Motivation
The main motivation behind the idea of preparing a workshop was the slight difference between React and React Native. Except for some specific parts, the coding is almost the same! Since a lot of people here at Moove It work with React (and pretty well, may I say!), it was a match made in heaven.
Something that also motivated us was that we consider mobile applications as an important part of the future (and present) of software development. Enterprises and startups are using mobile applications as part of their business more and more. That’s why we believe that the ability to develop a simple mobile app is a skill that’s enriching for everybody.
Ideation Process
The team gathered on Fridays for a few weeks (during out Open Friday’s space) to brainstorm and create each lesson. We decided what we wanted people to learn, defined the topics that had to be taught, and some other conditions. We decided several things:
- The course would be for people who already knew React & Redux. Otherwise, it would be too much information for a single workshop.
- We would be creating an entire app throughout the course, lesson by lesson.
- Topics would focus on aspects that web developers do not take into account when going mobile (human interaction, offline databases, how React Native works under the hood, etc.).
- We decided how the lessons would develop and the topics to be addressed in each one.
Lessons
So the course started! A lot of people were interested so we had a full house. The workshop was held over 5 weeks, for 3 hours each Wednesday. The topics we covered throughout the workshop were the following:
- Introduction to React Native: We explained how React Native emerged and discussed the differences between this and other solutions. Then, we explored how React Native works under the hood.
- UI Basics: We showed how to create a React Native project from scratch. People learnt how to use the essential UI components and how to style them. We focused on the patterns that affect mobile applications in comparison to web applications. Finally, we ran our application on the iOS Simulator and Android emulator.
- Responding to user interactions: We started by adding Redux to our application. Then, we showed how to debug in React Native and the differences between JS runtimes while debugging.
- Navigation: Navigation is all about showing the user where to go and how to get there. We presented and discussed the main patterns (and anti-patterns) that are common to both platforms. We also discussed the different solutions available and our pick for this course. Finally, we integrated the navigation solution to our project.
- Networking: It was time to show real data in our application. We integrated the libraries & structure needed to handle network requests. Finally, we discussed how to handle the Registration & Authentication flows.
- Persistence: How can we store data in the device itself? We discussed the importance of storing data in the mobile device, available solutions and the best fit for each use case.
- Device native features: We started by adding autologin and a settings tab to our app. Then, we learnt how to use the device native features, such as the camera & GPS.
- Publishing an app to the mobile stores: It was workshop wrap-up time! We showed the process of building production-ready binaries to upload to both the Apple App Store and Google Play Store.
It was a pretty intense schedule, but in the end it was all worth it!
Lessons Learned & Summary
After the workshop ended, we felt very proud of how it turned out. People showed real interest and focused on the lessons, even working on the app at home, which made it really easier for us the teachers!
This was the first time that the workshop was done here, so, of course, there were several lessons learnt and opportunities for improvement. For example, we learnt that we should allocate more time to setting up the environment (people had a tough time with that). Also, we realized that in the future we could create a more down-to-earth app to make the learning experience even better. On this instance, we just created a fake To-Do app.
All in all, we are really happy with the workshop and are looking forward to doing it again. Several people expressed interest in continuing to work with React Native, which is amazing. We want to thank everyone who assisted and hope they learnt a lot!
Further Information
For additional details, you can check out the slides that we used during the workshop. These sum up the main lessons and include a collection of links with further information. You can access the folder here.
