This week consisted of working on step 8 and answering questions to consider for possible article citations.

Step 7 Update

Professor Anderson will go over the error and get back to me.

Step 8 Continued

How do I correctly separate the code into snippets?

Fix:

• Using the map function, I added a states object that contains all the different states the code would run through, then I made all the code snippets that evoke change, become <VRButton>s. I changed the bakground color to green , so that the user is aware of the clickable event which will modify the gridPanel accordingly.

export const states = {
  state0: {
    code: ` #include <stdio.h>
             int i;
             int main (int argc, char *argv[])
             {`,
    gridOutput: '  ',
    forLoop:false,
  },
  state1:{
    code: `char text[] = "Hello World";
           char greeting[11];`,
    gridOutput: '  Hello World',
    forLoop:false,

  },
  state2:{
    code:`for(i=0;i<11;i++)
        greeting[i] = text[i];`,
    gridOutput:
      '  Hello WorldHello World',
    forLoop:true,
  },
  state3:{
    code:`printf(" %s ",greeting);
  }`,
    gridOutput: '  Hello WorldHello World 0'
  }
}

Note:

• This may not be ideal for the next step, but it separates the code distinctly.

Articles Added As Possible Citations

• Understanding Notional Machines Through Traditional Teaching with Conceptual Contraposition and Program Memory Tracing, Jeisson Hidalgo-Céspedes, Gabriela Marín-Raventós, Vladimir Lara-Villagrán
• Engage Against the Machine: Rise of the Notional Machines as Effective Pedgagogical Devices, Paul E. Dickson, Neil C.C. Brown, Brett A. Becker
• Trace-Based Teaching in Early Programming Courses, Matthew Hertz, Maria Jump
• Are Visualization Tools Used in Programming Education? Essi Isohanni, Hannu-Matti Järvinen

Completed Tasks:

• Finished Week #7 post
• Added Possible Citations to Report

Unfinished Tasks:

• Steps 7, Steps 9 - 11
• Complete supplemental courses
• Work on Final Report