diff --git a/client/src/templates/Challenges/projects/backend/Show.js b/client/src/templates/Challenges/projects/backend/Show.js
index 3f08c18cf0..f856516bd9 100644
--- a/client/src/templates/Challenges/projects/backend/Show.js
+++ b/client/src/templates/Challenges/projects/backend/Show.js
@@ -105,6 +105,7 @@ export class BackEnd extends Component {
   componentDidMount() {
     this.initializeComponent();
     window.addEventListener('resize', this.updateDimensions);
+    this._container.focus();
   }
 
   updateDimensions() {
@@ -186,6 +187,7 @@ export class BackEnd extends Component {
 
     return (
       <Hotkeys
+        innerRef={c => (this._container = c)}
         introPath={introPath}
         nextChallengePath={nextChallengePath}
         prevChallengePath={prevChallengePath}
diff --git a/client/src/templates/Challenges/projects/frontend/Show.js b/client/src/templates/Challenges/projects/frontend/Show.js
index aa145355b3..3195b5ccbf 100644
--- a/client/src/templates/Challenges/projects/frontend/Show.js
+++ b/client/src/templates/Challenges/projects/frontend/Show.js
@@ -63,6 +63,7 @@ export class Project extends Component {
     } = this.props;
     updateChallengeMeta({ ...challengeMeta, title, challengeType });
     challengeMounted(challengeMeta.id);
+    this._container.focus();
   }
 
   componentDidUpdate(prevProps) {
@@ -111,6 +112,7 @@ export class Project extends Component {
     const blockNameTitle = `${blockName} - ${title}`;
     return (
       <Hotkeys
+        innerRef={c => (this._container = c)}
         introPath={introPath}
         nextChallengePath={nextChallengePath}
         prevChallengePath={prevChallengePath}