Week 7 - What I Learned
November 29, 2021This week I kept working on the application previously mentioned. For a quick review, this is a React Native mobile application to help with implementing the RADICAL mindset inside a company. It is a project that started from scratch and it will be developed throughout the course of four weeks, with weekly demos.
It is my first time working as a front-end engineer so I have stumbled upon many challenges throughout the past couple of weeks, the main one this week was learning about React lifecycles and states. Because it is a good practice, I have been trying to design the components as reusable as possible, this means refactoring code into many different components (or files) which leads to problems if you don’t know how to share information between them; this is where React States come handy. React States enable easy information sharing between components, so far so good, but there are different kinds of components, mainly functional vs class components: class components behave as regular JavaScript classes, whereas functional components act like functions (yeah, behind the scenes they are very similar, but that is outside the scope of this post). Class components use states as any other class property, but Functional components use hooks to manage states; hooks are like special variables declared alongside a setter function inside a component and they are not limited to just setting some values, they also help in various stages of the React lifecycle, for example by executing some logic before rendering the component (or after).
For more information regarding JavaScript classes vs functions, see here or here.
In addition to writing code for the application, I learned about how to run the application using Apple’s Xcode toolchain and the iPhone simulator included. Curiously, the web version of the application looks slightly different than the iOS version (even on the same sized screen); I suspect it is because some libraries I’m using are not fully compatible with React Native or Expo but further experimentation is needed, as I am still learning how everything works together.
Today it was my team’s third live demo. We had a pre-demo a couple days ago, on which we received lots of feedback because we still can’t find a good design for the application. None of us are remotely close to being a good designer, and even though we have been reading about Apple’s Human Interface Guidelines and taking inspiration from different real-world applications, we have been struggling a lot with it. Fortunately, the feedback is very insightful and I feel like we have been slowly improving our design, I just hope it is enough for the last demo next week.
Also, I learned Terraform, which is a tool that allows sysadmins to create and manage cloud infrastructure using easily-formatted configuration files, meaning that you can have entire systems described in a few files using a common format called YAML. Specifically, I wrote some scripts to create an EC2 AWS instance and link it to a (newly created) VPC, making it accessible using SSH; even though it was my first interaction with Terraform I learned about (and used!) various modules available to make the script easier to read. This was supposed to be done using my AWS account because the EC2 instances created fell under the free tier, so there would be no fees, but you must link a credit card to get your account verified and none of my cards worked; this led me to a nifty tool called LocalStack which simulates an AWS environment and is perfect for testing Terraform configuration files, the only downside is that no real instances are created so I couldn’t test SSH connectivity. It was very interesting working with a tool like this, in part because it was my first interaction with these kinds of tools and I would like a role as DevOps later on.
As mentioned before, there is just one demo left of the mobile application. I am nervous because there is still much work to be done but I’m certain we will do our best to deliver a useful and pretty application.