How MrCesar is using Ionic & Firebase to help students Apply to College

First Published: 22 September 2016
Updated on: 10 June 2019

Back in May, I sent an email to my list, letting them know I was available to work on Ionic projects.

I got an email from Cesar who wanted to talk about building an app with Ionic Framework.

He’s a high school college counselor and has spent the past seven years guiding high school seniors through the college application process.

Over the years he was able to help hundreds of students get to college but grew increasingly frustrated at his inability to help even more students. He wanted to find a way to scale up rapidly.

His idea was excellent, he wanted to transfer all of his knowledge into an app that allowed students to follow a proven framework to get into college.

Kind of like a college counselor in your pocket.

So we started talking, and we created a list of features that could make it into the MVP so he could go out and test his app.

The app needed to allow students to:

  • Enter their academic information and then based on test results calculate their chances of getting accepted (yup, all 2000+ colleges in the US).
  • The calculations would let students know which schools were safe bets (Safety), which were unlikely (Moonshots), and everything in between.
  • Create a list of colleges they were interested in, then filter that list by admissibility and offer information about those colleges.
  • Then offer them a complete step by step to do list guiding them through the actual application process.
  • All while showing them their progress to keep users motivated to complete the process. :)

How MrCesar works:

First, the students are taken through an onboarding process, where they enter their academic information, such as test scores and GPA. The odds of admission are calculated as the student completes the on-boarding.

Ionic app

To spare the phone from the intensive process of calculating the odds, the algorithm is run on a separate server. It takes the server about 2 seconds to calculate the odds before populating a ‘collegeList’ node inside the userProfile node created using Firebase’s Anonymous Sign in.

Once through the on-boarding process, users can search for schools by name or ordered by admissibility, meaning they can click on a category like ‘Moonshot’ and get a list of the most competitive schools.

School list

This is where Firebase shines, with Anonymous Sign-In we could let the users create their school list and save it to their profiles without having to create an account first, reducing friction and making the app easier to go from download to giving value.

Then there’s the other part of the app that guides students through the entire process once they’ve selected the schools.

Before users can use this feature, they need to provide credentials (email and password) to create an account formally.

This part of the app walks the user through the process from the beginning, with tasks as simple as creating a professional email address dedicated to the college application process to others more complicated like asking a teacher to write a recommendation letter.

MrCesar appMap

Development

Development of the app was straight forward. Ionic 2 has such beautiful defaults for components that we could build those fast and focus on what was important, transforming Cesar’s knowledge into code that could work for any student anywhere in the country.

There were challenges, and we knew that when we decided to go all-in on a beta, but the Ionic community is incredible. We could get help on the issues we had pretty fast, using the official forums or the slack channel.

Tech Stack

The entire app is built with Ionic Framework. For the backend, we used Firebase. This combination allowed us to focus on the logic, while those tools worked on the heavy lifting.

We incorporated a NodeJs server to initialize a user’s profile and calculate the odds for each school. Once again, Firebase made development easy. The server ‘listens’ for a new user and immediately jumps into action.

Having the phone do that was just too risky given the fact that many of the users might have under-powered devices. We did not want to risk freezing the app in older devices Offloading the most intensive operations helped make sure the user had a smooth experience using the app.

Next Steps

Right now MrCesar is focusing on getting more high school students using the app, getting feedback, and helping students get through the college application process.

Do you know someone going through it? Share this app with them, and it will help them build a balanced college list and keep track of everything they need during the process :-)

The App is available in both iTunes and Google Play.

UPDATE: The app is only available in the US since it’s for the US School System.

If you want to jump-start your next project make sure to get in touch with me so we can see how I can best help you get your project to market.