Connection of international students and host families in the U.S.

Most international students under 16 in the U.S. must live with a host family unless they enroll in a boarding school. For example, I moved to the U.S. at the age of 14, so I also lived with a host family for two years before I transferred to a boarding school.

Luckily, I had no trouble living with my host family. However, I have seen so many international students having a tough time getting settled with a host family. Also, there are many students who decide to change host families because it is very challenging to live with someone they do not want.

After seeing those issues around me, I wanted to start a project that can possibly help new international students find a host family they are satisfied with. In order to do so, I asked some international students and my host family what they would want to know before living with a stranger. Based on their answers, I started building a simple prototype using Framer.

Provide rich information about host families

To satisfy users of HostFam, I focused on how host families can provide good quality information. Students who are willing to change their host families are most likely the ones who did not know the family well before moving in. Therefore, the information host families provide is considered the most important part of this service.

Connect international students and host families without an agency

To save the cost of an agency, direct communication is an essential component of HostFam. Students can communicate through the service and ask more questions about the host family and any other information.

Site map

I sketched out the site map before starting to design HostFam. Mainly, users are of two types: host family and hosted, which is a student. Host families have access to every functionality that hosted users have, with the extra of managing homes and checking messages from hosted users.

Wireframe

Based on the site map, I created a wireframe using Framer. This is when I chose the primary color and overall layouts of the application.

Server configuration

Launched two separate AWS EC2 instances for the client side and server side with Linux. Since it was my first time using AWS, I constantly referred to AWS documentation and Stack Overflow. Then, I deployed the web application on the servers using GitHub.

MERN stack

Because HostFam was initiated for my own learning, I wanted to try new, modern languages and frameworks. Therefore, I decided to use MongoDB, ExpressJS, ReactJS, and NodeJS. Compared to my previous projects, I really enjoyed utilizing the node packages.

SSL certificate

Unlike my previous projects, I deployed HTTPS to the web application, using an SSL certificate issued by Let's Encrypt.

NoSQL database

While I had experience using relational databases, specifically MySQL, I wanted to learn NoSQL databases with MongoDB. Compared to relational databases, I loved the flexibility of NoSQL databases.

Change of design

While HostFam was in development, I realized that some components I designed for the prototype were distracting. Therefore, I reflected on my friends' suggestions and made changes while I was developing.

Login and user information: I used the Google Login API to authenticate users. If a user has not registered yet, the application redirects them to the registration page.

Search hosts by city: when users type a city in the search bar, HostFam returns the list of host families in that city. Users can then view the details of each host family and the apartment information.

Save hosts you like: when users click the heart icon on a host page or in the list, the host is saved to their saved homes, and clicking it again removes it.

Manage your home (hosts only): host families can create or edit the information about their home: images with descriptions, location details, host family information, extra services, and resident requirements and contract details.

Messages from potential residents (hosts only): host families can check their inbox for messages from potential residents and reply by email.

First time using ReactJS, NodeJS, and MongoDB

Although I had experience in web development from high school, HostFam was my first project using ReactJS, NodeJS, and MongoDB, so I had a learning curve. Because of this project, I gained a technique for learning a new language or framework quickly and applying it to a project.

Marketing and SEO

While I was brainstorming HostFam, I was expecting at least a few users to visit the website and try it out. However, I realized that publishing the web application is not the end of the project. To make it visible on Google, I learned that SEO and marketing are very important to gaining first users. I was in the army while I worked on HostFam, so this project ended as a beta version.