Vocab Victor Classroom App

Our Vocab Victor word learning (smartphone) app helps English language students build and strengthen their vocabulary by playing word games.

Our NEW Vocab Victor Classroom app (app.vocabvictor.com), written entirely in Anvil, is a classroom management tool that lets teachers create schools, add classes, create custom word lists and assign the lists to students, which lets their students learn the teacher’s words inside the app.

COOL TECH HACKS:

Serverless model: We determined that the Anvil Tables system, while handy, led to very slow performance. Therefore, we decided to use a serverless model and wrote a python + js library to read/write to Google’s Firestore. It is lightning fast, extremely reliable, and allowed us to write the entire application with very few (I think maybe three or four) server functions.*

Cloud functions: One advantage to the serverless model is that we can write cloud functions on Google that run in response to database actions. All in Python of course :slight_smile:.

Connection with app server: The Vocab Victor mobile app has its own API library that generates word games for each individual user. In order to get the Anvil system/cloud functions talking to the app server, we wrote a new API library to add classes and word lists, to assign word lists to our registered app users, and to let the teachers monitor word learning progress based on in-app performance.

Plot control: Used Anvil’s plot control to display word progress to the teachers; took about five minutes to set up!!! :heart: :bar_chart:

Mobile app experience: Leveraged existing features in the mobile app to show the users their assigned word lists, their word learning progress, and added new features to let them join a class using a Vocab Victor Classroom code (this is actually the thing that hooks everything up). Modified our existing Global leaderboard so that students in a class can compete against each other.

We are very tired.

Thanks @meredydd, @ian, @bridget, and the forum community for the questions answered, tech support, and for putting up with the occasional cranky post/email when things didn’t go our way!

Learn more about Vocab Victor at our web site, vocabvictor.com. Available for download at Apple Store and Google Play.

You are welcome to check out Vocab Victor Classroom (registration is required but free). If you want to play around in the app, please use a school name such as “Anvil test” so I’m not confusing you with “real” users (teachers)! To play around with cloud services, create a bunch of schools and watch how fast they load!

– Heidi

  • Message me to learn more about this.
12 Likes

Looks awesome and a lot of work!

If any of those dependencies you used - particularly the firestore wrapper - are shareable would be great to see the approach you guys took there.

5 Likes

Looks great, well done!

One minor criticism? Let people know the password rules in advance. Playing the “guess what they require” game when signing up can be frustrating.

But that’s just my opinion :slight_smile:

3 Likes

Google’s Firestore is really a game changer. Thanks so much

1 Like

Thanks for the feedback! @junderhill

Yes! I’ll put up a separate post devoted to this with a test page you can check out (hopefully) without registering. Let me poke around a bit!

3 Likes

I know, right???

1 Like

here’s your green spinner gif to match the theme
just add it to the assets

spinner

/*make loading spinner green*/
#loadingSpinner {
  background-image: url(_/theme/spinner.gif);
}

not that it comes up very often :wink:

3 Likes

Thanks Stu that’s so sweet!

One area, besides how you worked with Firestore, that I would love to know is how you packaged the Anvil app as a mobile app.

2 Likes

Hi @robert I have two “apps” (software programs) available commercially. Our mobile app (Vocab Victor Word Learning App) is a smartphone app for iOS and Android developed in Unity. Our Vocab Victor Classroom app was developed in Anvil and runs in the browser (but thanks to the responsive controls built into Anvil, looks great on mobile!

1 Like

Thanks for the clarification!

That would be great!

This looks so cool! I would have loved it, if i was still in school xD

1 Like

Thank you @heidi for this idea !

I think there should be a build in Anvil - Google Cloud Firestore integration like Google API

@heidi could you please describe how you did that?

we decided to use a serverless model and wrote a python + js library to read/write to Google’s Firestore

I want to do that with my app

And what charge Google for this solution?

@Ilqar If you are interested in a Client Side Firebase integation we have rebuild our own firebase client to be used as a dependency.

Its in a public beta state and should be stable enough for most production applications.

2 Likes

Thank you very much - it is nice Mark - I will look and give my feedback later on !

1 Like

Awesome job well done!!

I like it Mark - but very difficult for me to implement

1 Like