Making Progress

May 6th, 2020
rn

Right Direction

After a couple of long weeks biding my time, we are finally working on the React Native project for work. This is something I've been waiting to work on for quite some time, and I think it will really help to have both of us on the project. As I've stated in the past, my cohort and I work at 2 different speeds, both of which are useful. My cohort plods along at a steady, calculated pace, doing a lot of research along the way, while I make a list and get to work. I can often make a lot of progress on things that are more surface level, while he's digging deep into bigger issues. Often, I think he can get a little sidetracked and go down some rabbit holes, but those ventures seem to pay off with new ideas and new things to implement. If he hadn't gone down the React-Hook-Form rabbit hole, we would still be using the old system for working with forms and I would have never learned how to use it. That was a huge boon to our payments application, and as that application is growing, it is proving to be more and more useful. A big reason why my start on this project was delayed was because of all the things he was doing for this project to really make it better. While they took a lot of time initially and set us back a couple weeks, they are going to continue to pay off all the way through this project.

rn

The biggest thing he did was implement a system to house the native version of our application alongside the web version. This way, we can literally write the application once and run it everywhere. Our initial plan isn't really to roll out a version for the web, but that is an eventuality. Initially, we will have a version for the phone and one for the tablet, which have completely different layouts. In fact, for the most part, the layout for the tablet is proving to be very similar to the web version. Which leads to the second biggest thing he did for the project. He implemented a custom hook so that, when you write the styling, which in React Native is held in objects, you can pass in options to write the responsive versions at the same time. So, we can write a phone version at the same time we are writing the tablet version and the web version. The way I have my development environment set up right now really compliments this, as well. I have an iPad set up to view that form of the application, and on another computer from the one I'm writing code on, I have the web version, which I can also view the mobile version with. It's really nice, and it's turning out to be a great flow. He also created a really clever way to handle the icons, since for React Native, the icons are not compatible for the web. The way he has it set up, we just use an icon component, pass in the name of the web icon and the name of the mobile icon, along with the size and color, and it's good to go. Some of the things he does are ingenious, and they're going to save us a lot of time and code.

rn

Our first goal of the project, now that we're actually working on it, is to get the layout all good. We aren't really going to work on functionality quite yet, because that's going to be a job in and of itself. It would be better to get everything in place first, and then come back and hook up the API to fetch the data. This is an application for the sales representatives, where they would log in and be given a type of dashboard. On this dashboard, they could access their leads, check appointments, add appointments, and add other things to their calendar. So far, there are 4 main screens to the application, a home screen that serves as a landing spot for when they access the application, a leads search page, where they can search their leads and click on them to find more information, a leads page, where the details of a given lead are held, and a calendar page, where they can add, edit and delete relevant events. I'm working on the leads search page and the leads page, so far, as my cohort has already worked out how he's going to do the calendar and the home page. I knocked out the UI for the search page yesterday, pretty much. There will be a few things we add down the road, but for now it's fine. The leads page is very detailed, though. On the tablet and web version, there is a skinnier section to the left which holds activities associated with that lead, where they can see a call log and other pertinent information. On the right, there is a tab navigator with 4 different sub-screens they can access. One of the screens will be the detailed information of the lead, where they can go in and edit this information if they so choose. There's also an appointments, reminders, and notes page. I have the overall layout finished up, along with the mobile version, but I'm still working on the sub-screens. There's going to be a lot that goes into this, and it's going to take both of us working together to come up with the best look for this. Overall, this application is chock full of really interesting things to work on, and I'm excited to get a new project to sink my teeth into, especially one with React Native.

Until tomorrow!

Created by Sam Thoyre, © 2019