diff --git a/frontend/src/pages/review.tsx b/frontend/src/pages/review.tsx
index dcf3292..a6671f6 100644
--- a/frontend/src/pages/review.tsx
+++ b/frontend/src/pages/review.tsx
@@ -252,11 +252,19 @@ const ReviewPageWithRouter = withRouter(
                 </div>;
             }
 
-
             const { question, qtype } = this.props.current;
             const questionTitle = `${question} (${reviewQTypeToStr(qtype)})`;
-            // TODO:
-            const progress = 50;
+            // TODO/NOTE: This assumes that each vocabulary item gets mapped to
+            //            exactly 3 review cards
+            // NOTE: The 'numCards === 0 ?' is neccessary as (for some reasdn) numCards
+            //       starts of by being 0, which results in progress === -Inifinity.
+            //       That looks weird as the user sees the progressbar jump.
+            const numCards = this.vocab.length * 3;
+            const progress = numCards === 0 ? (
+                0
+            ) : (
+                    100 * (numCards - (this.reviewQueue.size() + 1)) / numCards
+                );
 
             return <div>
                 <Grid container justify="center">