We need to get the majors to appear in the view-students page so that the user can click a major to filter the students.

1. Add another variable near the top of the file that holds the path for the GET majors operation:

   var majorsApi = '/api/majors';

2. Add a model object to the data that will hold the list of catgories:

   students: new Array(),
   majors: new Array()

   We included the existing students model to show you that you need to use commas to separate the models. Don't just blindly copy and paste this code --- modify your existing code to match.

1. Add another function to methods block that will get the majors. Copy the existing getStudents function and adapt it to suit. Make sure that you add a comma to the end of the previous function since commas are used here to separate the functions.

2. Add another call to mounted that calls the new function to load the majors when the page loads.

   1. Back in the students page, find the HTML that adds the majors to the page. You can remove that code --- it will be easier to start from scratch.

3. Replace the code with the following:

   <div class="majors"><button v-for="major in majors">{{major}}</button></div>

   This is the same technique that we used for the students. We use v-for to repeat the tag as many times as we need and a template (the double curly braces) to display the values.

   The div is there to make it easier to centre the buttons --- if you set the text-align style to center for the div then the buttons should be centered.

   1. Reload the page in the browser. You should see the majors.