The rest of Week 2 and beginning of Week 3 were all spent on project planning. I had a great time meeting with my team members to discuss more about the structure of our application and division of workload on things like how to store images and serve them in the backend, the different pages our web app requires, prototyping, etc. Now that the planning is done, I think we as a group has a much clearer vision of what we are going to achieve by the end of this term.

First thing first, our team picked React, which I had no prior experience in, as our framework so I thought a self-learning session would be helpful to gain some familiarity with React. Given the limited time I have until I need to build my first UI, I decided to do a quick crash course video on YouTube instead of going through dry documentations. There is a video I find particularly helpful, as it covers the basics and is easy to follow through. Not only that, it also demonstrates how to display a list of items with the option to delete any one of them, and that is a functionality I have to implement for one of my pages. The link to the video is https://youtu.be/w7ejDZ8SWv8.

With that I started building a sign up page for our application that directs user to sign up either as a user or as a shelter. As I was building the page, I started to realize how efficient React is compared to regular HTML and CSS. The reusable components and ability to take in arbitrary inputs really makes a huge difference. For example, I only had to make a button component that takes in a prop and I can reuse that button for different needs as shown in the image attached below. What a time saver!

I can’t wait to learn more about React and start to implement multi-page design for the application next week! Also, I’ll have to brush up on my Express skills as I’ll be building the backend for user signup next week.