Menu-building web app

Bootstrap 4, Backbone.js, jQuery, JavaScript, HTML5, AJAX We're building a complex web application involving food & nutrition. This task is one very small part of that work. As a part of the system, admin users need to be able to create daily menus. A daily menu contains the list of foods available to choose from for breakfast, lunch, dinner, and snack. These menus are for people in an institution such as a hospital or senior care facility. Within the institution are several groups of people: a) people who choose from a "normal" list b) low-sodium diet c) low-fat diet Note: The list of "group" types (normal, low-sodium, low-fat) may change over time so we want these values to come from an array of variables we can configure. Our job is to create an interface for the admin users to pick a few individual foods from a large list and offer them as choices for each meal. Included here is a small subset of the list of all the possible foods, in tab-separated column format, to use as sample data for this part of the project. Here are the Milestones as I envision them at this point: 1) To start with, I want you to create at least two versions of a page where an admin users can add items for Breakfast, Lunch, Dinner and Snack for Monday's "normal" menu. * In one version, the user uses a button to indicate they want to add a new food for a meal, then chooses which specific food from a drop-down menu. * In another version, the user is presented with the possible foods in some sort of scrolling list and they can drag/drop items from that list to a specific meal * If you can think of some other user-interface ideas here, feel free to suggest. 2) After we choose which option from #1 we are going to use, create the interface needed to add items for each meal for each day of the week. 3) Add the ability to copy the "normal" menu and then modify it to create menus for the other groups.