Tecnicamente eso es todo del tutorial :c

app/Http/Controllers/Api/UsersController.php

@@ -14,4 +14,32 @@ class UsersController extends Controller
     {
         return UserResource::collection(User::paginate(10));
     }
+
+    public function all()
+    {
+        return UserResource::collection(User::all());
+    }
+
+    public function show(User $user) 
+    {
+        return new UserResource($user);
+    }
+
+    public function update(User $user, Request $request)
+    {
+        $data = $request->validate([
+            'name'  => 'required',
+            'email' => 'required|email',
+        ]);
+
+        $user->update($data);
+        return new UserResource($user);
+    }
+
+    public function delete(User $user)
+    {
+        $user->delete();
+
+        return response(null, 204);
+    }
 }

app/Http/Resources/UserResource.php

@@ -15,6 +15,7 @@ class UserResource extends JsonResource
     public function toArray($request)
     {
         return [
+            'id' => $this->id,
             'name' => $this->name,
             'email' => $this->email,
         ];

resources/js/api/users.js

@@ -0,0 +1,19 @@
+import axios from 'axios';
+
+export default {
+    all() {
+        return axios.get('/api/users');
+    },
+    paginated(page) {
+        return axios.get('/api/users', page);
+    },
+    find(id) {
+        return axios.get(`/api/users/${id}`);
+    },
+    edit(id, data) {
+        return axios.put(`/api/users/${id}`, data);
+    },
+    delete(id) {
+        return axios.delete(`/api/users/${id}`);
+    }
+};

resources/js/app.js

@@ -7,6 +7,8 @@ import App from './views/App'
 import Hello from './views/Hello'
 import Home from './views/Home'
 import UserIndex from './views/UserIndex'
+import UserEdit from './views/UserEdit'
+import NotFound from './views/NotFound'
 
 const router = new VueRouter({
     mode: 'history',
@@ -26,6 +28,20 @@ const router = new VueRouter({
             name: 'users.index',
             component: UserIndex,
         },
+        {
+            path: '/users/:id/edit',
+            name: 'users.edit',
+            component: UserEdit,
+        },
+        {
+            path: '/404',
+            name: '404',
+            component: NotFound,
+        },
+        {
+            path: '*',
+            redirect: '/404',
+        }
     ],
 });
 

resources/js/views/NotFound.vue

@@ -0,0 +1,6 @@
+<template>
+    <div>
+        <h2>404 Not Found</h2>
+        <p>Woops, looks like you're lost .w.</p>
+    </div>
+</template>

resources/js/views/UserEdit.vue

@@ -0,0 +1,90 @@
+<template>
+    <div>
+        <div v-if="message" class="alert">{{ message }}</div>
+        <div v-if="!loaded">Loading...</div>
+        <form @submit.prevent="onSubmit($event)" v-else>
+            <div class="form-group">
+                <label for="username">Name</label>
+                <input id="username" v-model="user.name"/>
+            </div>
+            <div class="form-group">
+                <label for="email">Email</label>
+                <input id="email" type="email" v-model="user.email"/>
+            </div>
+            <div class="form-group">
+                <button type="submit" :disabled="saving">Update</button>
+                <button :disabled="saving" @click.prevent="onDelete($event)">Delete</button>
+            </div>
+        </form>
+    </div>
+</template>
+
+<style lang="scss" scoped>
+$red: lighten(red, 30%);
+$darkRed: darken($red, 50%);
+
+.form-group label {
+    display: block;
+}
+
+.alert {
+    background: $red;
+    color: $darkRed;
+    padding: 1rem;
+    margin-bottom: 1rem;
+    width: 50%;
+    border: 1px solid $darkRed;
+    border-radius: 5px;
+}
+</style>
+
+<script>
+import api from '../api/users';
+
+export default {
+    data() {
+        return {
+            message: null,
+            loaded: false,
+            saving: false,
+            user: {
+                id:    null,
+                name:  "",
+                email: "",
+            }
+        }
+    },
+    methods: {
+        onSubmit(event) {
+            this.saving = true;
+
+            api.edit(this.user.id, {
+                name: this.user.name,
+                email: this.user.email,
+            }).then((response) => {
+                this.message = 'User Updated';
+                setTimeout(() => this.message = null, 2000);
+                this.user = response.data.data;
+            }).catch((error) => {
+                console.log(error);
+            }).then(_ => this.saving = false);
+        },
+        onDelete(event) {
+            this.saving = true;
+            api.delete(this.user.id)
+            .then((response) => {
+                this.message = 'User Deleted';
+                setTimeout(() => this.$router.push({ name:'users.index' }), 2000);
+            });
+        }
+    },
+    created() {
+        api.find(this.$route.params.id).then((response) => {
+            this.loaded = true;
+            this.user = response.data.data;
+        }).catch((err) => {
+            this.$router.push({ name:'404' });
+        });
+    }
+};
+</script>

resources/js/views/UserIndex.vue

@@ -5,9 +5,10 @@
         </div>
 
         <ul v-if="users">
-            <li v-for="{ name, email } in users">
+            <li v-for="{ id, name, email } in users">
                 <strong>Name:</strong>  {{ name }},
                 <strong>Email:</strong> {{ email}}
+                <router-link :to="{ name: 'users.edit', params: { id } }">Edit</router-link>
             </li>
         </ul>
         <div class="pagination">
@@ -20,16 +21,16 @@
 
 <script>
 import axios from 'axios';
+import api from '../api/users';
 
 const getUsers = (page, callback) => {
     const params = { page };
 
-    axios
+    api.paginated({ params })
-        .get('/api/users', { params })
         .then(response => {
             callback(null, response.data);
         }).catch(error => {
-            callback(error, err.response.data);
+            callback(error, error.response.data);
         });
 };
 

routes/api.php

@@ -4,5 +4,9 @@ use Illuminate\Http\Request;
 
 Route::namespace('Api')->group(function() {
     Route::get('/users', 'UsersController@index');
+    Route::get('/users/all', 'UsersController@all');
+    Route::get('/users/{user}', 'UsersController@show');
+    Route::put('/users/{user}', 'UsersController@update');
+    Route::delete('/users/{user}', 'UsersController@delete');
 });