diff --git a/app/Http/Controllers/API/v1/FollowController.php b/app/Http/Controllers/API/v1/FollowController.php
new file mode 100644
index 000000000..e60809cdf
--- /dev/null
+++ b/app/Http/Controllers/API/v1/FollowController.php
@@ -0,0 +1,127 @@
+<?php
+
+namespace App\Http\Controllers\API\v1;
+
+use App\Exceptions\AlreadyFollowingException;
+use App\Exceptions\IdenticalModelException;
+use App\Exceptions\PermissionException;
+use App\Http\Controllers\API\ResponseController;
+use App\Http\Controllers\Backend\User\FollowController as FollowBackend;
+use App\Http\Controllers\Backend\User\FollowController as SettingsBackend;
+use App\Http\Controllers\UserController as UserBackend;
+use App\Http\Resources\UserResource;
+use App\Models\Follow;
+use App\Models\User;
+use Illuminate\Database\Eloquent\ModelNotFoundException;
+use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
+use Illuminate\Http\Resources\Json\AnonymousResourceCollection;
+use Illuminate\Support\Facades\Auth;
+use Illuminate\Validation\Rule;
+
+class FollowController extends ResponseController
+{
+
+    public static function createFollow(Request $request, FollowController $instance): JsonResponse {
+        $validated    = $request->validate(['userId' => ['required', 'exists:users,id']]);
+        $userToFollow = User::find($validated['userId']);
+
+        try {
+            $createFollowResponse = UserBackend::createOrRequestFollow(Auth::user(), $userToFollow);
+        } catch (AlreadyFollowingException) {
+            return $instance->sendv1Error(['message' => __('controller.user.follow-error')], 409);
+        } catch (IdenticalModelException) {
+            abort(409);
+        }
+
+        return $instance->sendv1Response(new UserResource($createFollowResponse), 204);
+    }
+
+    public static function destroyFollow(Request $request, FollowController $instance): JsonResponse {
+        $validated      = $request->validate(['userId' => ['required', 'exists:users,id']]);
+        $userToUnfollow = User::find($validated['userId']);
+
+        $destroyFollowResponse = UserBackend::destroyFollow(Auth::user(), $userToUnfollow);
+        if ($destroyFollowResponse === false) {
+            return $instance->sendv1Error(['message' => __('controller.user.follow-404')], 409);
+        }
+
+        $userToUnfollow->fresh();
+        return $instance->sendv1Response(new UserResource($userToUnfollow));
+
+    }
+
+    public function getFollowers(): AnonymousResourceCollection {
+        $followersResponse = FollowBackend::getFollowers(user: auth()->user());
+        return UserResource::collection($followersResponse);
+    }
+
+    public function getFollowRequests(): AnonymousResourceCollection {
+        $followRequestResponse = FollowBackend::getFollowRequests(user: auth()->user());
+        return UserResource::collection($followRequestResponse);
+    }
+
+    public function getFollowings(): AnonymousResourceCollection {
+        $followingResponse = FollowBackend::getFollowings(user: auth()->user());
+        return UserResource::collection($followingResponse);
+    }
+
+    public function removeFollower(Request $request): void {
+        $validated = $request->validate([
+                                            'userId' => [
+                                                'required',
+                                                Rule::in(auth()->user()->followers->pluck('user_id')),
+                                            ]
+                                        ]);
+
+        $follow = Follow::where('user_id', $validated['userId'])
+                        ->where('follow_id', auth()->user()->id)
+                        ->firstOrFail();
+
+        try {
+            $removeResponse = FollowBackend::removeFollower(follow: $follow, user: auth()->user());
+        } catch (PermissionException) {
+            abort(403);
+        }
+
+        if ($removeResponse === true) {
+            abort(204);
+        }
+        abort(500);
+    }
+
+    public function approveFollowRequest(Request $request) {
+        $validated = $request->validate([
+                                            'userId' => [
+                                                'required',
+                                                Rule::in(auth()->user()->followRequests->pluck('user_id'))
+                                            ]
+                                        ]);
+
+        try {
+            FollowBackend::approveFollower(auth()->user()->id, $validated['userId']);
+            abort(204);
+        } catch (ModelNotFoundException) {
+            abort(404);
+        } catch (AlreadyFollowingException $exception) {
+            report($exception);
+        }
+        abort(500);
+    }
+
+    public function rejectFollowRequest(Request $request) {
+        $validated = $request->validate([
+                                            'userId' => [
+                                                'required',
+                                                Rule::in(auth()->user()->followRequests->pluck('user_id'))
+                                            ]
+                                        ]);
+        try {
+            FollowBackend::rejectFollower(auth()->user()->id, $validated['userId']);
+            abort(204);
+        } catch (ModelNotFoundException) {
+            abort(404);
+        }
+        abort(500);
+    }
+}
diff --git a/app/Http/Controllers/API/v1/UserController.php b/app/Http/Controllers/API/v1/UserController.php
index 9ccca674a..fb7ab1de9 100644
--- a/app/Http/Controllers/API/v1/UserController.php
+++ b/app/Http/Controllers/API/v1/UserController.php
@@ -3,8 +3,6 @@
 namespace App\Http\Controllers\API\v1;
 
 
-use App\Exceptions\AlreadyFollowingException;
-use App\Exceptions\IdenticalModelException;
 use App\Exceptions\PermissionException;
 use App\Exceptions\UserAlreadyMutedException;
 use App\Exceptions\UserNotMutedException;
@@ -68,35 +66,6 @@ public function show(string $username): UserResource {
         return new UserResource(User::where('username', 'like', $username)->firstOrFail());
     }
 
-    public function createFollow(Request $request): JsonResponse {
-        $validated    = $request->validate(['userId' => ['required', 'exists:users,id']]);
-        $userToFollow = User::find($validated['userId']);
-
-        try {
-            $createFollowResponse = UserBackend::createOrRequestFollow(Auth::user(), $userToFollow);
-        } catch (AlreadyFollowingException) {
-            return $this->sendv1Error(['message' => __('controller.user.follow-error')], 409);
-        } catch (IdenticalModelException) {
-            abort(409);
-        }
-
-        return $this->sendv1Response(new UserResource($createFollowResponse), 201);
-    }
-
-    public function destroyFollow(Request $request): JsonResponse {
-        $validated      = $request->validate(['userId' => ['required', 'exists:users,id']]);
-        $userToUnfollow = User::find($validated['userId']);
-
-        $destroyFollowResponse = UserBackend::destroyFollow(Auth::user(), $userToUnfollow);
-        if ($destroyFollowResponse === false) {
-            return $this->sendv1Error(['message' => __('controller.user.follow-404')], 409);
-        }
-
-        $userToUnfollow->fresh();
-        return $this->sendv1Response(new UserResource($userToUnfollow));
-
-    }
-
     public function createMute(Request $request): JsonResponse {
         $validated     = $request->validate([
                                                 'userId' => [
diff --git a/app/Http/Controllers/Backend/User/FollowController.php b/app/Http/Controllers/Backend/User/FollowController.php
new file mode 100644
index 000000000..5f2dc84e9
--- /dev/null
+++ b/app/Http/Controllers/Backend/User/FollowController.php
@@ -0,0 +1,74 @@
+<?php
+
+namespace App\Http\Controllers\Backend\User;
+
+use App\Exceptions\AlreadyFollowingException;
+use App\Exceptions\PermissionException;
+use App\Http\Controllers\Controller;
+use App\Http\Controllers\UserController;
+use App\Models\Follow;
+use App\Models\FollowRequest;
+use App\Models\User;
+use Illuminate\Contracts\Pagination\Paginator;
+use Illuminate\Database\Eloquent\ModelNotFoundException;
+
+abstract class FollowController extends Controller
+{
+    public static function getFollowers(User $user): Paginator {
+        return $user->userFollowers()->simplePaginate(perPage: 15);
+    }
+
+    public static function getFollowRequests(User $user): Paginator {
+        return $user->userFollowRequests()->simplePaginate(perPage: 15);
+    }
+
+    public static function getFollowings(User $user): Paginator {
+        return $user->userFollowings()->simplePaginate(perPage: 15);
+    }
+
+    /**
+     * @param Follow $follow
+     * @param User   $user - The acting user
+     *
+     * @return bool|null
+     * @throws PermissionException
+     */
+    public static function removeFollower(Follow $follow, User $user): bool|null {
+        if ($user->cannot('delete', $follow)) {
+            throw new PermissionException();
+        }
+        return $follow->delete();
+    }
+
+    /**
+     * @param int $userId
+     * @param int $followerID
+     *
+     * @return FollowRequest|null
+     */
+    public static function rejectFollower(int $userId, int $followerID): ?FollowRequest {
+        $request = FollowRequest::where('user_id', $followerID)->where('follow_id', $userId)->firstOrFail();
+
+        $request->delete();
+        return $request;
+    }
+
+    /**
+     *
+     * @param int $userId     The id of the user who is approving a follower
+     * @param int $approverId The id of a to-be-approved follower
+     *
+     * @throws ModelNotFoundException|AlreadyFollowingException
+     */
+    public static function approveFollower(int $userId, int $approverId): bool {
+        $request = FollowRequest::where('user_id', $approverId)->where('follow_id', $userId)->firstOrFail();
+
+        $follow = UserController::createFollow($request->user, $request->requestedFollow, true);
+
+        if ($follow) {
+            $request->delete();
+        }
+        return $follow;
+    }
+
+}
diff --git a/app/Http/Controllers/Frontend/SettingsController.php b/app/Http/Controllers/Frontend/SettingsController.php
index ba01c0d83..0481317f8 100644
--- a/app/Http/Controllers/Frontend/SettingsController.php
+++ b/app/Http/Controllers/Frontend/SettingsController.php
@@ -4,10 +4,11 @@
 
 use App\Enum\StatusVisibility;
 use App\Exceptions\AlreadyFollowingException;
+use App\Http\Controllers\Backend\User\FollowController;
+use App\Http\Controllers\Backend\User\FollowController as SettingsBackend;
 use App\Http\Controllers\Backend\User\SessionController;
 use App\Http\Controllers\Backend\User\TokenController;
 use App\Http\Controllers\Controller;
-use App\Http\Controllers\SettingsController as SettingsBackend;
 use Illuminate\Contracts\Support\Renderable;
 use Illuminate\Database\Eloquent\ModelNotFoundException;
 use Illuminate\Http\RedirectResponse;
@@ -138,7 +139,7 @@ public function rejectFollower(Request $request): RedirectResponse {
                                             ]
                                         ]);
         try {
-            $approval = SettingsBackend::rejectFollower(auth()->user()->id, $validated['user_id']);
+            $approval = FollowController::rejectFollower(auth()->user()->id, $validated['user_id']);
         } catch (ModelNotFoundException) {
             abort(404);
         }
diff --git a/app/Http/Controllers/SettingsController.php b/app/Http/Controllers/SettingsController.php
index 2b3b366d6..5b4c455af 100644
--- a/app/Http/Controllers/SettingsController.php
+++ b/app/Http/Controllers/SettingsController.php
@@ -2,11 +2,8 @@
 
 namespace App\Http\Controllers;
 
-use App\Exceptions\AlreadyFollowingException;
 use App\Models\Follow;
-use App\Models\FollowRequest;
 use Illuminate\Contracts\Support\Renderable;
-use Illuminate\Database\Eloquent\ModelNotFoundException;
 use Illuminate\Http\RedirectResponse;
 use Illuminate\Http\Request;
 use Illuminate\Validation\Rule;
@@ -16,6 +13,9 @@
  */
 class SettingsController extends Controller
 {
+    /**
+     * @deprecated
+     */
     public function renderFollowerSettings(): Renderable {
         return view('settings.follower', [
             'requests'  => auth()->user()->followRequests()->with('user')->paginate(15),
@@ -23,6 +23,9 @@ public function renderFollowerSettings(): Renderable {
         ]);
     }
 
+    /**
+     * @deprecated
+     */
     public function removeFollower(Request $request): RedirectResponse {
         $validated = $request->validate([
                                             'user_id' => [
@@ -40,36 +43,4 @@ public function removeFollower(Request $request): RedirectResponse {
 
         return back()->with('success', __('settings.follower.delete-success'));
     }
-
-    /**
-     *
-     * @param int $userId     The id of the user who is approving a follower
-     * @param int $approverId The id of a to-be-approved follower
-     *
-     * @throws ModelNotFoundException|AlreadyFollowingException
-     */
-    public static function approveFollower(int $userId, int $approverId): bool {
-        $request = FollowRequest::where('user_id', $approverId)->where('follow_id', $userId)->firstOrFail();
-
-        $follow = UserController::createFollow($request->user, $request->requestedFollow, true);
-
-        if ($follow) {
-            $request->delete();
-        }
-        return $follow;
-    }
-
-    /**
-     * @param int $userId
-     * @param int $followerID
-     *
-     * @return FollowRequest|null
-     */
-    public static function rejectFollower(int $userId, int $followerID): ?FollowRequest {
-        $request = FollowRequest::where('user_id', $followerID)->where('follow_id', $userId)->firstOrFail();
-
-        $request->delete();
-        return $request;
-
-    }
 }
diff --git a/app/Models/Follow.php b/app/Models/Follow.php
index 94898d0ee..4a7dd8bd0 100644
--- a/app/Models/Follow.php
+++ b/app/Models/Follow.php
@@ -18,6 +18,10 @@ class Follow extends Model
     ];
 
     public function user(): BelongsTo {
-        return $this->belongsTo(User::class);
+        return $this->belongsTo(User::class, 'user_id', 'id');
+    }
+
+    public function following() {
+        return $this->belongsTo(User::class, 'follow_id', 'id');
     }
 }
diff --git a/app/Models/User.php b/app/Models/User.php
index 648b5c86d..a07b67a25 100644
--- a/app/Models/User.php
+++ b/app/Models/User.php
@@ -116,10 +116,20 @@ public function followRequests(): HasMany {
         return $this->hasMany(FollowRequest::class, 'follow_id', 'id');
     }
 
+    /**
+     * @deprecated
+     */
     public function followers(): HasMany {
         return $this->hasMany(Follow::class, 'follow_id', 'id');
     }
 
+    /**
+     * @deprecated
+     */
+    public function followings(): HasMany {
+        return $this->hasMany(Follow::class, 'user_id', 'id');
+    }
+
     public function sessions(): HasMany {
         return $this->hasMany(Session::class);
     }
@@ -135,6 +145,30 @@ public function getPointsAttribute(): int {
                            ->sum('points');
     }
 
+    /**
+     * @untested
+     * @todo test
+     */
+    public function userFollowings(): BelongsToMany {
+        return $this->belongsToMany(__CLASS__, 'follows', 'user_id', 'follow_id');
+    }
+
+    /**
+     * @untested
+     * @todo test
+     */
+    public function userFollowers(): BelongsToMany {
+        return $this->belongsToMany(__CLASS__, 'follows', 'follow_id', 'user_id');
+    }
+
+    /**
+     * @untested
+     * @todo test
+     */
+    public function userFollowRequests(): BelongsToMany {
+        return $this->belongsToMany(__CLASS__, 'follow_requests', 'follow_id', 'user_id');
+    }
+
     /**
      * @deprecated -> replaced by $user->can(...) / $user->cannot(...) / request()->user()->can(...) /
      *             request()->user()->cannot(...)
diff --git a/resources/components/FollowTable.vue b/resources/components/FollowTable.vue
new file mode 100644
index 000000000..2190c78c8
--- /dev/null
+++ b/resources/components/FollowTable.vue
@@ -0,0 +1,137 @@
+<template>
+    <table class="table table-striped table-hover table-sm mb-0" aria-describedby="describedBy">
+        <tbody>
+            <tr v-for="row in users" v-bind:key="row.id" style="vertical-align: middle">
+                <td>
+                    <div class="image-box pe-0 d-lg-flex" style="width: 4em; height: 4em;">
+                        <router-link :to="{name: 'profile', params: {username: row.username}}">
+                            <img :src="row.profilePicture" style="height: 4em;"
+                                 :alt="i18n.choice('_.user.profile-picture', 1, {username: row.username})">
+                        </router-link>
+                    </div>
+                </td>
+                <td>
+                    <router-link :to="{name: 'profile', params: {username: row.username}}">
+                        {{ row.displayName }}<br>
+                        <small>@{{ row.username }}</small>
+                    </router-link>
+                </td>
+                <td class="px-1">
+                    <span class="font-weight-bold">
+                                        <i aria-hidden="true" class="fa fa-route d-inline"></i>
+                                        <span class="sr-only-focusable">{{ i18n.get("_.leaderboard.distance") }}</span>
+                                        {{ row.trainDistance / 1000 }}
+                                    </span>
+                    <span class="small font-weight-lighter">km</span>
+                </td>
+                <td class="px-1">
+                    <span class="font-weight-bold ps-sm-2">
+                                        <i aria-hidden="true" class="fa fa-stopwatch d-inline"></i>
+                                        <span class="sr-only-focusable">{{ i18n.get("_.leaderboard.duration") }}</span>
+                                        {{ row.trainDuration.toFixed(0) }}
+                        <!-- ToDo: trainDuration in hours & minutes -->
+                                    </span>
+                    <span class="small font-weight-ligheer">min</span>
+                </td>
+                <td class="px-1">
+                    <span class="font-weight-bold ps-sm-2">
+                                        <i aria-hidden="true" class="fa fa-dice-d20 d-inline"></i>
+                                        <span class="sr-only-focusable">{{ i18n.get("_.leaderboard.points") }}</span>
+                                        {{ row.points }}
+                                    </span>
+                    <span
+                        class="small font-weight-lighter">{{ i18n.get("_.profile.points-abbr") }}</span>
+                </td>
+                <td class="pe-0 text-end" v-if="followers">
+                    <button type="submit" class="btn btn-sm btn-danger" data-mdb-toggle="tooltip"
+                            :title="i18n.get('_.settings.follower.delete')" @click="removeFollower(row)">
+                        <i class="fas fa-user-minus" aria-hidden="true"></i>
+
+                    </button>
+                </td>
+                <td class="pe-0" v-if="request">
+                        <button type="submit" class="btn btn-danger btn-sm"
+                                data-mdb-toggle="tooltip"
+                                data-mdb-placement="top"
+                                :title="i18n.get('_.settings.request.delete')"
+                                @click="rejectFollowRequest(row)">
+                            <i class="fas fa-user-times" aria-hidden="true"></i>
+                        </button>
+                </td>
+                <td class="ps-0" v-if="request">
+                        <button type="submit" class="btn btn-success btn-sm"
+                                data-mdb-toggle="tooltip"
+                                data-mdb-placement="top"
+                                :title="i18n.get('_.settings.request.accept')"
+                                @click="approveFollowRequest(row)">
+                            <i class="fas fa-user-check" aria-hidden="true"></i>
+                        </button>
+                </td>
+                <td class="px-0 text-end">
+                    <MuteButton :user="row"></MuteButton>
+                </td>
+                <td>
+                    <FollowButton :user="row"></FollowButton>
+                </td>
+            </tr>
+        </tbody>
+    </table>
+</template>
+
+<script>
+
+import MuteButton from "./MuteButton";
+import FollowButton from "./FollowButton";
+import User from "../js/ApiClient/User";
+
+export default {
+    name: "FollowTable",
+    inject: ["notyf"],
+    components: {FollowButton, MuteButton},
+    props: {
+        describedBy: null,
+        users: null,
+        followers: false,
+        request: false
+    },
+    methods: {
+        removeFollower(user) {
+            User.removeFollower(user.id)
+                .then(() => {
+                    const index = this.users.indexOf(user);
+                    this.users.splice(index, 1);
+                    this.notyf.success(this.i18n.get('_.settings.follower.delete-success'));
+                })
+                .catch((error) => {
+                    this.apiErrorHandler(error);
+                });
+        },
+        rejectFollowRequest(user) {
+            User.rejectFollowRequest(user.id)
+                .then(() => {
+                    const index = this.users.indexOf(user);
+                    this.users.splice(index, 1);
+                    this.notyf.success(this.i18n.get('_.settings.request.reject-success'));
+                })
+                .catch((error) => {
+                    this.apiErrorHandler(error);
+                });
+        },
+        approveFollowRequest(user) {
+            User.approveFollowRequest(user.id)
+                .then(() => {
+                    const index = this.users.indexOf(user);
+                    this.users.splice(index, 1);
+                    this.notyf.success(this.i18n.get('_.settings.request.accept-success'));
+                })
+                .catch((error) => {
+                    this.apiErrorHandler(error);
+                });
+        }
+    }
+};
+</script>
+
+<style scoped>
+
+</style>
diff --git a/resources/components/Settings/ProfileSettings.vue b/resources/components/Settings/ProfileSettings.vue
index b86d5aef1..4508f299c 100644
--- a/resources/components/Settings/ProfileSettings.vue
+++ b/resources/components/Settings/ProfileSettings.vue
@@ -41,7 +41,21 @@
                 i18n.get('_.settings.title-privacy')
             }}</h6>
 
+
         <div class="row">
+            <div class="col">
+                <label aria-label="visibilityDropdown" class="form-check-label">
+                    {{ i18n.get('_.menu.settings.myFollower') }}
+                </label>
+            </div>
+            <div class="col">
+                <router-link :to="{name: 'followers'}" class="btn btn-primary float-end">
+                    {{i18n.get('_.settings.follower.manage')}}
+                </router-link>
+            </div>
+        </div>
+
+        <div class="row mt-3 pt-3">
             <div class="col">
                 <label aria-label="visibilityDropdown" class="form-check-label">
                     {{ i18n.get('_.settings.visibility.default') }}
diff --git a/resources/components/views/Followers.vue b/resources/components/views/Followers.vue
new file mode 100644
index 000000000..e0602b23e
--- /dev/null
+++ b/resources/components/views/Followers.vue
@@ -0,0 +1,217 @@
+<template>
+    <LayoutBasicNoSidebar>
+        <div class="col-md-9 col-lg-9">
+            <div class="card">
+                <div class="card-header">
+                    <router-link :to="{name: 'settings'}" class="text-black-50">
+                        <i class="fas fa-arrow-left" aria-hidden="true"></i> &nbsp;
+                        {{ i18n.get("_.menu.settings") }}
+                    </router-link>
+                </div>
+                <div class="card-body p-0">
+                    <ul id="myTab" class="nav nav-tabs nav-fill" role="tablist">
+                        <li class="nav-item">
+                            <a id="followers-tab" aria-controls="home" aria-selected="true" class="nav-link active px-4"
+                               data-mdb-toggle="tab" href="#followers" role="tab">
+                                {{ i18n.get("_.menu.settings.myFollower") }}
+                            </a>
+                        </li>
+                        <li class="nav-item">
+                            <a id="requests-tab" aria-controls="profile" aria-selected="false" class="nav-link px-4"
+                               data-mdb-toggle="tab" href="#requests" role="tab">
+                                {{ i18n.get("_.menu.settings.follower-requests") }}
+                            </a>
+                        </li>
+                        <li class="nav-item">
+                            <a id="followings-tab" aria-controls="contact" aria-selected="false" class="nav-link px-4"
+                               data-mdb-toggle="tab" href="#followings" role="tab">
+                                {{ i18n.get("_.menu.settings.followings") }}
+                            </a>
+                        </li>
+                    </ul>
+                    <div class="tab-content">
+                        <div id="followers" class="tab-pane fade show active table-responsive"
+                             role="tabpanel">
+                            <FollowTable v-if="followers.length > 0" :users="followers" followers="true"></FollowTable>
+                            <p v-else class="m-3">
+                                <strong class="text-danger">
+                                    <i class="fas fa-users-slash" aria-hidden="true"></i>
+                                    {{ i18n.get("_.settings.follower.no-follower") }}
+                                </strong>
+                            </p>
+                            <div v-if="followersLinks && followersLinks.next && !followersLoading" class="text-center">
+                                <button aria-label="i18n.get('_.menu.show-more')"
+                                        class="btn btn-primary btn-lg btn-floating my-1"
+                                        @click.prevent="fetchMoreFollowers">
+                                    <i aria-hidden="true" class="fas fa-caret-down"></i>
+                                </button>
+                            </div>
+                            <spinner v-if="followersLoading"></spinner>
+                        </div>
+                        <div id="requests" class="tab-pane fade table-responsive" role="tabpanel">
+                            <FollowTable v-if="followRequests.length > 0" :users="followRequests" request="true"></FollowTable>
+                            <p v-else class="m-3">
+                                <strong class="text-danger">
+                                    <i class="fas fa-users-slash" aria-hidden="true"></i>
+                                    {{ i18n.get("_.settings.follower.no-requests") }}
+                                </strong>
+                            </p>
+                            <div v-if="followRequestsLinks && followRequestsLinks.next && !followRequestsLoading"
+                                 class="text-center">
+                                <button aria-label="i18n.get('_.menu.show-more')"
+                                        class="btn btn-primary btn-lg btn-floating my-1"
+                                        @click.prevent="fetchMoreFollowRequests">
+                                    <i aria-hidden="true" class="fas fa-caret-down"></i>
+                                </button>
+                            </div>
+                            <spinner v-if="followRequestsLoading"></spinner>
+                        </div>
+                        <div v-if="" id="followings"
+                             class="tab-pane fade table-responsive" role="tabpanel">
+                            <FollowTable v-if="followings.length > 0" :users="followings"></FollowTable>
+                            <p v-else class="m-3">
+                                <strong class="text-danger">
+                                    <i class="fas fa-users-slash" aria-hidden="true"></i>
+                                    {{ i18n.get("_.settings.follower.no-followings") }}
+                                </strong>
+                            </p>
+                            <div v-if="followingsLinks && followingsLinks.next && !followingsLoading"
+                                 class="text-center">
+                                <button aria-label="i18n.get('_.menu.show-more')"
+                                        class="btn btn-primary btn-lg btn-floating my-1"
+                                        @click.prevent="fetchMoreFollowings">
+                                    <i aria-hidden="true" class="fas fa-caret-down"></i>
+                                </button>
+                            </div>
+                            <spinner v-if="followingsLoading"></spinner>
+                        </div>
+                    </div>
+                </div>
+                <div class="card-footer text-muted">
+                </div>
+            </div>
+        </div>
+    </LayoutBasicNoSidebar>
+</template>
+
+<script>
+
+import LayoutBasic from "../layouts/Basic";
+import Spinner from "../Spinner";
+import LayoutBasicNoSidebar from "../layouts/BasicNoSidebar";
+import Settings from "../../js/ApiClient/Settings";
+import FollowTable from "../FollowTable";
+
+export default {
+    name: "Followers",
+    data() {
+        return {
+            followers: [],
+            followRequests: [],
+            followings: [],
+            followersLoading: true,
+            followRequestsLoading: true,
+            followingsLoading: true,
+            followersLinks: null,
+            followRequestsLinks: null,
+            followingsLinks: null
+        };
+    },
+    metaInfo() {
+        return {
+            title: this.i18n.get("_.menu.settings.myFollower")
+        };
+    },
+    components: {
+        FollowTable,
+        LayoutBasicNoSidebar,
+        Spinner,
+        LayoutBasic
+    },
+    methods: {
+        fetchData() {
+            Settings
+                .getFollowers()
+                .then((data) => {
+                    this.followersLoading = false;
+                    this.followers        = data.data;
+                    this.followersLinks   = data.links;
+                })
+                .catch((error) => {
+                    this.apiErrorHandler(error);
+                    this.followersLoading = false;
+                });
+
+            Settings
+                .getFollowings()
+                .then((data) => {
+                    this.followingsLoading = false;
+                    this.followings        = data.data;
+                    this.followingsLinks   = data.links;
+                })
+                .catch((error) => {
+                    this.apiErrorHandler(error);
+                    this.followingsLoading = false;
+                });
+
+            Settings
+                .getFollowRequests()
+                .then((data) => {
+                    this.followRequestsLoading = false;
+                    this.followRequests        = data.data;
+                    this.followRequestsLinks   = data.links;
+                })
+                .catch((error) => {
+                    this.apiErrorHandler(error);
+                    this.followRequestsLoading = false;
+                });
+        },
+        fetchMoreFollowers() {
+            this.followersLoading = true;
+            this.fetchMoreData(this.followersLinks.next)
+                .then((data) => {
+                    this.followers        = this.followers.concat(data.data);
+                    this.followersLinks   = data.links;
+                    this.followersLoading = false;
+                })
+                .catch((error) => {
+                    this.apiErrorHandler(error);
+                    this.followersLoading = false;
+                });
+        },
+        fetchMoreFollowings() {
+            this.followingsLoading = true;
+            this.fetchMoreData(this.followingsLinks.next)
+                .then((data) => {
+                    this.followings        = this.followings.concat(data.data);
+                    this.followingsLinks   = data.links;
+                    this.followingsLoading = false;
+                })
+                .catch((error) => {
+                    this.apiErrorHandler(error);
+                    this.followingsLoading = false;
+                });
+        },
+        fetchMoreFollowRequests() {
+            this.followRequestsLoading = true;
+            this.fetchMoreData(this.followRequestsLinks.next)
+                .then((data) => {
+                    this.followRequests        = this.followRequests.concat(data.data);
+                    this.followRequestsLinks   = data.links;
+                    this.followRequestsLoading = false;
+                })
+                .catch((error) => {
+                    this.apiErrorHandler(error);
+                    this.followRequestsLoading = false;
+                });
+        }
+    },
+    created() {
+        this.fetchData();
+    }
+};
+</script>
+
+<style scoped>
+
+</style>
diff --git a/resources/js/ApiClient/Settings.js b/resources/js/ApiClient/Settings.js
index ad5157d8f..28a3bb3c8 100644
--- a/resources/js/ApiClient/Settings.js
+++ b/resources/js/ApiClient/Settings.js
@@ -1,4 +1,4 @@
-import {deleteFromApi, getContent, postToApi, putToApi} from "./Helpers";
+import {deleteFromApi, getBody, getContent, postToApi, putToApi} from "./Helpers";
 
 export default class Settings {
     static getProfileSettings() {
@@ -64,4 +64,16 @@ export default class Settings {
     static deleteProfilePicture() {
         return deleteFromApi("/settings/profilePicture");
     }
+
+    static getFollowers() {
+        return getBody("/settings/followers");
+    }
+
+    static getFollowings() {
+        return getBody("/settings/followings");
+    }
+
+    static getFollowRequests() {
+        return getBody("/settings/follow-requests");
+    }
 }
diff --git a/resources/js/ApiClient/User.js b/resources/js/ApiClient/User.js
index b5996e66a..0ab06c922 100644
--- a/resources/js/ApiClient/User.js
+++ b/resources/js/ApiClient/User.js
@@ -1,4 +1,4 @@
-import {deleteFromApi, getBody, getContent, postToApi} from "./Helpers";
+import {deleteFromApi, getBody, getContent, postToApi, putToApi} from "./Helpers";
 
 export default class User {
     static getByUsername(username) {
@@ -17,6 +17,18 @@ export default class User {
         return deleteFromApi("/user/destroyFollow", {userId});
     }
 
+    static removeFollower(userId) {
+        return deleteFromApi("/user/removeFollower", {userId});
+    }
+
+    static rejectFollowRequest(userId) {
+        return deleteFromApi("/user/rejectFollowRequest", {userId});
+    }
+
+    static approveFollowRequest(userId) {
+        return putToApi("/user/approveFollowRequest", {userId});
+    }
+
     static mute(userId) {
         return postToApi("/user/createMute", {userId});
     }
diff --git a/resources/js/routes.js b/resources/js/routes.js
index 259310d73..4dd5b85be 100644
--- a/resources/js/routes.js
+++ b/resources/js/routes.js
@@ -15,6 +15,7 @@ import About from "../components/views/About";
 import Charts from "../components/views/Statistics";
 import SearchView from "../components/views/SearchView";
 import SettingsView from "../components/views/Settings";
+import Followers from "../components/views/Followers";
 
 Vue.use(VueRouter);
 
@@ -135,6 +136,14 @@ export const router = new VueRouter({
                 meta: {
                     auth: true
                 }
+            },
+            {
+                path: "/settings/followers",
+                component: Followers,
+                name: "followers",
+                meta: {
+                    auth: true
+                }
             }
         ],
     base: "/",
diff --git a/resources/lang/de.json b/resources/lang/de.json
index b309ae288..aa80745d3 100644
--- a/resources/lang/de.json
+++ b/resources/lang/de.json
@@ -95,6 +95,7 @@
     "user.remember-me": "Angemeldet bleiben",
     "user.reset-pw-link": "Wiederherstellungs-Link schicken",
     "user.username": "Nutzername",
+    "user.profile-picture": "Profilbild von @:username",
     "user.you": "Du",
     "user.home-set": "Dein Heimatbahnhof ist nun :Station.",
     "user.home-not-set": "Du hast noch keinen Heimatbahnhof festgelegt.",
@@ -231,6 +232,7 @@
     "menu.settings": "Einstellungen",
     "menu.settings.myFollower": "Meine Follower",
     "menu.settings.follower-requests": "Folgen-Anfragen",
+    "menu.settings.followings": "Folge ich",
     "menu.share": "Teilen",
     "menu.admin": "Admin-Panel",
     "menu.readmore": "Mehr lesen",
@@ -365,6 +367,8 @@
     "settings.create-ics-token-success": "Die Kalenderfreigabe wurde erstellt. Du kannst folgenden Link in einen Kalender einbinden, der das ICS-Format unterstützt: <a href=\":link\">:link</a>",
     "settings.revoke-ics-token-success": "Die Kalenderfreigabe wurde gelöscht.",
     "settings.follower.no-follower": "Du hast keine Follower.",
+    "settings.follower.no-requests": "Du hast keine Folgen-Anfragen.",
+    "settings.follower.no-followings": "Du folgst niemandem.",
     "settings.follower.manage": "Follower verwalten",
     "settings.follower.delete-success": "Du hast den Follower erfolgreich entfernt.",
     "settings.follower.delete": "Follower entfernen",
diff --git a/resources/lang/en.json b/resources/lang/en.json
index a89861350..1366a0cb6 100644
--- a/resources/lang/en.json
+++ b/resources/lang/en.json
@@ -52,6 +52,7 @@
     "user.remember-me": "Remember me",
     "user.reset-pw-link": "Send Password Reset Link",
     "user.username": "Username",
+    "user.profile-picture": "Profile picture of @:username",
     "user.you": "You",
     "user.home-set": "We set your home station to :Station.",
     "user.home-not-set": "You haven't set a home station yet.",
@@ -210,6 +211,7 @@
     "menu.settings": "Settings",
     "menu.settings.myFollower": "My followers",
     "menu.settings.follower-requests": "Follower requests",
+    "menu.settings.followings": "Following",
     "menu.share": "Share",
     "menu.admin": "Admin-Panel",
     "menu.readmore": "Read more",
@@ -343,6 +345,8 @@
     "settings.create-ics-token-success": "The calendar token has been created. You can embed it with the following link to every software which support ICS files: <a href=\":link\">:link</a>",
     "settings.revoke-ics-token-success": "The calendar token has been revoked.",
     "settings.follower.no-follower": "You don't have any followers.",
+    "settings.follower.no-requests": "You don't have any follow requests.",
+    "settings.follower.no-followings": "You don't follow anybody.",
     "settings.follower.manage": "Manage followers",
     "settings.follower.following-since": "Following since",
     "settings.follower.delete-success": "You successfully removed the follower.",
diff --git a/routes/api.php b/routes/api.php
index 08d6f4346..c2eaee090 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -13,6 +13,7 @@
 
 use App\Http\Controllers\API\v1\AuthController as v1Auth;
 use App\Http\Controllers\API\v1\EventController;
+use App\Http\Controllers\API\v1\FollowController;
 use App\Http\Controllers\API\v1\IcsController;
 use App\Http\Controllers\API\v1\LikesController;
 use App\Http\Controllers\API\v1\NotificationsController;
@@ -70,8 +71,11 @@
             Route::post('export', [StatisticsController::class, 'generateTravelExport']);
         });
         Route::group(['prefix' => 'user'], function() {
-            Route::post('createFollow', [UserController::class, 'createFollow']);
-            Route::delete('destroyFollow', [UserController::class, 'destroyFollow']);
+            Route::post('createFollow', [FollowController::class, 'createFollow']);
+            Route::delete('destroyFollow', [FollowController::class, 'destroyFollow']);
+            Route::delete('removeFollower', [FollowController::class, 'removeFollower']);
+            Route::delete('rejectFollowRequest', [FollowController::class, 'rejectFollowRequest']);
+            Route::put('approveFollowRequest', [FollowController::class, 'approveFollowRequest']);
             Route::post('createMute', [UserController::class, 'createMute']);
             Route::delete('destroyMute', [UserController::class, 'destroyMute']);
             Route::get('search/{query}', [UserController::class, 'search']);
@@ -93,6 +97,9 @@
             Route::get('tokens', [TokenController::class, 'index']);
             Route::delete('tokens', [TokenController::class, 'revokeAllTokens']);
             Route::delete('token', [TokenController::class, 'revokeToken']);
+            Route::get('followers', [FollowController::class, 'getFollowers']);
+            Route::get('follow-requests', [FollowController::class, 'getFollowRequests']);
+            Route::get('followings', [FollowController::class, 'getFollowings']);
         });
     });