Vue Tutorial App Reading From MLAB Database : 2-page App with CRUD actions

Post new project Vue 2-page tutorial I have a database in mlab which I want to use to build a tutorial app to teach myself the basics of VueJS. Here is the idea for the two page app : Page 1 Display Records Read database from MLAB New Record Date Type Of Service (dropdown box) Service Attendance (number) Submit Display in date order reversing Date Type Of Service Service Attendance Edit Delete 2017-12-01 Sunday first service 120 2017-12-02 Sunday second service 130 2017-12-05 Wednesday evening service 10 Delete should display a message 'Are you sure'? Then delete the record Edit should take to page 2 Page 2 Date 2017-12-01 Service Type Sunday first service Attendance 100 Submit (when submitted should edit the existing data) That's it. I would like you to tutor me on this. Perhaps the BEST WAY WOULD YOU TO BUILD THE APP YOURSELF AND DOCUMENT WHAT YOU ARE DOING EITHER BY USING TEXT DOCUMENTATION OR BY VIDEO RECORDING WHAT YOU ARE DOING ON YOUR SCREEN (SCREENCAST IS GOOD). FINAL OPTION IS TO ACTUALLY SPEND TIME WITH ME LIVE BUILDING THE APP, BUT IT MIGHT BE MORE PRODUCTIVE FOR YOU TO BUILD IT FIRST, SHOW ME THE INSTRUCTIONS, THEN LET ME TRY IT AND IF I HAVE ANY QUESTIONS WE CAN DO A LIVE SESSION. HOW DOES THAT SOUND??? ESTIMATES IN TIME - I AM NOT SURE BUT I AM THINKING I AM NOT INTERESTED IN ANY 1) SECURITY 2) FANCY CSS ==> I JUST WANT THE MECHANICS ONLY. I AM NOT INTERESTED IN WHERE THE STUFF DISPLAYS ON THE SCREEN SO SUPER BASIC LAYOUT IS OK. YOU CAN USE BOOTSTRAP, FLEXBOX OR GRID LAYOUT IF YOU WANT - OR WHATEVER YOU WANT ! I WANT TO LEARN FROM YOU!!! If you can quote a total price for the project to 1) Build the app 2) Add tutorial documentation or video recording ======================================= Total price x =======================================