diff --git a/public/docs-static/img/get-started/android-tv/change-server.png b/public/docs-static/img/get-started/android-tv/change-server.png new file mode 100644 index 00000000..ed2ab292 Binary files /dev/null and b/public/docs-static/img/get-started/android-tv/change-server.png differ diff --git a/public/docs-static/img/get-started/android-tv/main-menu-change-server.png b/public/docs-static/img/get-started/android-tv/main-menu-change-server.png new file mode 100644 index 00000000..66551eb6 Binary files /dev/null and b/public/docs-static/img/get-started/android-tv/main-menu-change-server.png differ diff --git a/public/docs-static/img/get-started/android-tv/main-screen.png b/public/docs-static/img/get-started/android-tv/main-screen.png new file mode 100644 index 00000000..a5cac45d Binary files /dev/null and b/public/docs-static/img/get-started/android-tv/main-screen.png differ diff --git a/public/docs-static/img/get-started/tvos/authentication-screen.png b/public/docs-static/img/get-started/tvos/authentication-screen.png new file mode 100644 index 00000000..23e3b7fb Binary files /dev/null and b/public/docs-static/img/get-started/tvos/authentication-screen.png differ diff --git a/public/docs-static/img/get-started/tvos/confirm-add-vpn-config.png b/public/docs-static/img/get-started/tvos/confirm-add-vpn-config.png new file mode 100644 index 00000000..9b5e578a Binary files /dev/null and b/public/docs-static/img/get-started/tvos/confirm-add-vpn-config.png differ diff --git a/public/docs-static/img/get-started/tvos/confirm-change-server.png b/public/docs-static/img/get-started/tvos/confirm-change-server.png new file mode 100644 index 00000000..a7e618e5 Binary files /dev/null and b/public/docs-static/img/get-started/tvos/confirm-change-server.png differ diff --git a/public/docs-static/img/get-started/tvos/main-screen-connected.png b/public/docs-static/img/get-started/tvos/main-screen-connected.png new file mode 100644 index 00000000..894357b2 Binary files /dev/null and b/public/docs-static/img/get-started/tvos/main-screen-connected.png differ diff --git a/src/components/NavigationDocs.jsx b/src/components/NavigationDocs.jsx index 02413906..528b2f5f 100644 --- a/src/components/NavigationDocs.jsx +++ b/src/components/NavigationDocs.jsx @@ -38,7 +38,9 @@ export const docsNavigation = [ { title: 'MacOS', href: '/get-started/install/macos' }, { title: 'Docker', href: '/get-started/install/docker' }, { title: 'iOS', href: '/get-started/install/ios' }, + { title: 'tvOS', href: '/get-started/install/tvos'}, { title: 'Android', href: '/get-started/install/android' }, + { title: 'Android TV', href: '/get-started/install/android-tv'} ], }, { diff --git a/src/pages/get-started/install/android-tv.mdx b/src/pages/get-started/install/android-tv.mdx new file mode 100644 index 00000000..7023d648 --- /dev/null +++ b/src/pages/get-started/install/android-tv.mdx @@ -0,0 +1,86 @@ +import {Note} from "@/components/mdx"; + +# Install NetBird on an Android TV + +The Android TV app supports devices running Android 8.0 or later. + + + Android TV support is currently in beta. + + +## Where to Download + +NetBird has an official Android application that you can download at Google Play Store: + +

+ + playstore + + +

+ +APK releases are also available to install directly on your Android device via the [NetBird Android GitHub repository](https://github.com/netbirdio/android-client/releases). + +## Configure Netbird on Android TV + +### First Launch + +Upon first launch, NetBird will inform you that it's using the default managemet server. + +firstinstall + +Select 'Continue' to ackownledge and you'll be greeted with the app's main screen. + +android-tv-main-screen + +### Management Server Configuration + + + This step only applies to self-hosted users, or cloud users enrolling the device with a setup key. If you're a cloud user and are _not_ enrolling the device with a setup key, you can safely skip to [Connecting to Your Network](#connecting-to-your-network) + + +Select the hamburger menu on the top left of the main screen (or hold the left directional button) and navigate to the 'Change Server' menu. + +android-tv-main-menu + +Changing servers erases the device's current NetBird config, so you'll need to confirm the action before proceeding: + +confirm-erase-cponfig + +Enter your management server endpoint. For cloud users, this is `https://api.netbird.io:443`. For self-hosted users, it's usually `https://your_management_server_url:443`, but you can refer to your management.json configuration file if you're unsure. + +If enrolling the device with a setup key, select '+ Add this device with a setup key' and enter your setup key. Select 'change' to apply your new management server config, and if successful you'll see the following: + +serverchanged + +You're now ready to connect to your Netbird network! + +#### Connecting to Your Network + +Select the NetBird logo button to connect. The app will request permission to create a VPN connection: + +vpnconnectionrequest + +Select 'OK'. If you didn't enter a setup key in the 'Change Server' menu, then you'll need to authenticate with your SSO provider. NetBird will open a browser window where you'll be instructed to sign in to your SSO provider. + +After logging in, NetBird will confirm your authentication. Once you close the browser window, your device should be connected! + +#### Authenticating + + + For self-hosted users _not_ enrolling the device with a setup key, Device Authentication needs to be enabled in the management server config. + + +Since Android TV doesn't ship with a built-in browser, and entering credentials with a remote may be less than ideal, the TV client uses a slightly different authentication flow to the mobile app. If you're not using a setup key, then after you grant the app permission +to create a VPN connection, you'll be presented a QR code and device ID: + +tvssoqr + +Scan the QR code with your phone and you'll be able to sign in to your SSO provider there. If asked to confirm your device code, confirm that the code underneath the QR code matches the one presented by your SSO provider. Once you've completed +the SSO flow, the QR code dialog in the NetBird app will automatically dismiss itself, and your device should now be connected! + +## What's next? +- Manage your device's [access](/manage/access-control/manage-network-access) to the network +- Use your device for [remote access access to your home network](/manage/networks/homelab/access-home-network) +- Use your device as an [exit node](/manage/network-routes/configuring-default-routes-for-internet-traffic#make-the-peer-an-exit-node-routing-peer) + diff --git a/src/pages/get-started/install/android.mdx b/src/pages/get-started/install/android.mdx index ecbe4cae..b2c9eb64 100644 --- a/src/pages/get-started/install/android.mdx +++ b/src/pages/get-started/install/android.mdx @@ -2,11 +2,7 @@ import {Note} from "@/components/mdx"; # Install NetBird on an Android -The Android supports mobile devices, tablets and Android TV devices running Android 8.0 or later. - - - Android TV support is currently in beta. - +The Android supports mobile devices, tablets and [Android TV](android-tv) devices running Android 8.0 or later. ## Where to Download @@ -14,7 +10,7 @@ NetBird has an official Android application that you can download at Google Play

- playstore + playstore

@@ -36,10 +32,10 @@ Select 'Continue' to ackownledge and you'll be greeted with the app's main scree ### Management Server Configuration - This step only applies to self-hosted users, or cloud users enrolling the device with a setup key. If you're a cloud user and are _not_ enrolling the device with a setup key, you can safely skip to . + This step only applies to self-hosted users, or cloud users enrolling the device with a setup key. If you're a cloud user and are _not_ enrolling the device with a setup key, you can safely skip to [Connecting to Your Network](#connecting-to-your-network) -Select the hamburger menu on the top left of the main screen (or hold the left directional button on Android TV) and navigate to the 'Change Server' menu. +Select the hamburger menu on the top left of the main screen and navigate to the 'Change Server' menu. changeserver @@ -63,17 +59,10 @@ Select the NetBird logo button to connect. The app will request permission to cr Select 'OK'. If you didn't enter a setup key in the 'Change Server' menu, then you'll need to authenticate with your SSO provider. NetBird will open a browser window where you'll be instructed to sign in to your SSO provider. -After logging in, NetBird will confirm your authentication. Once you close the browser window, your device should be connected! +After logging in, NetBird will confirm your authentication. Once you close the browser window, your device should be connected! -#### Authenticating on Android TV - -Since Android TV doesn't ship with a built-in browser, and entering credentials with a remote may be less than ideal, the TV client uses a slightly different authentication flow. If you're not using a setup key, then after you grant the app permission -to create a VPN connection, you'll be presented a QR code and device ID: - -tvssoqr - -Scan the QR code with your phone and you'll be able to sign in to your SSO provider there. If asked to confirm your device code, confirm that the code underneath the QR code matches the one presented by your SSO provider. Once you've completed -the SSO flow, the QR code dialog in the NetBird app will automatically dismiss itself, and your device should now be connected! +## What's next? +- Configure the device's [group & policy](example.com) memberships diff --git a/src/pages/get-started/install/tvos.mdx b/src/pages/get-started/install/tvos.mdx new file mode 100644 index 00000000..f3884e1d --- /dev/null +++ b/src/pages/get-started/install/tvos.mdx @@ -0,0 +1,58 @@ +import {Note} from "@/components/mdx"; + +# tvOS (Apple TV) + +The tvOS app supports all Apple TV devices running tvOS 17.0 or later. It's available to download in the Apple TV app store. + + + tvOS support is currently in beta. + + +## Configure NetBird on tvOS + +### First Launch + +tvos-confirm-add-vpn-config + +Upon first launch, NetBird will request permission to create a new VPN configuration. Select 'Allow' to continue. + +### Management Server Configuration + + + This step only applies to self-hosted users, or cloud users enrolling the device with a setup key. If you're a cloud user and are _not_ enrolling the device with a setup key, you can safely skip to [Connecting & Authenticating](#connecting-and-authenticating) + + +By default, the app is configured to connect to NetBird's cloud management server. If you're a self-hosted user, or you'd like to enroll the device with a setyo key, you'll need to +change the management server settings. + +Navigate to **'Settings > Change Server'**, and the app will warn you that changing management server settings will erase your current config and disconnect if a connection is currently active: + +tvos-confirm-change-server + +After confirming, you'll be presented with a dialog to enter your management server URL. Cloud users who want to enroll the device with a setup key should enter the URL For cloud users, this is `https://api.netbird.io:443`. +For self-hosted users, it's usually `https://your_management_server_url:443`, but you can refer to your management.json configuration file if you're unsure. + +If enrolling the device with a setup key, select '+ Add this device with a setup key' and enter your setup key. Select 'Change' to apply your new management server config. NetBird will run a brief verification step +on the details you've entered, after which you can move on to connecting. + +### Connecting & Authenticating + +On the main 'Connection' screen, select the 'Connect' button to initiate a connection to your NetBird network. + + + For self-hosted users _not_ enrolling the device with a setup key, Device Authentication needs to be enabled in the management server config. + + +If you're not using a setup key, you'll be presented a QR code and device ID: + +tvos-authentication + +Scan the QR code with a mobile device and you'll be able to sign in to your SSO provider there. If asked to confirm your device code, confirm that the code underneath the QR code matches the one presented by your SSO provider. Once you've completed +the SSO flow, after a few seconds the authentication dialog in the NetBird app will automatically dismiss itself. Select the 'Connect' button once more, and your device should now be connected! + +tvos-main-screen-connected + +## What's next? +- Manage your device's [access](/manage/access-control/manage-network-access) to the network +- Use your device for [remote access access to your home network](/manage/networks/homelab/access-home-network) +- Use your device as an [exit node](/manage/network-routes/configuring-default-routes-for-internet-traffic#make-the-peer-an-exit-node-routing-peer) diff --git a/src/styles/tailwind.css b/src/styles/tailwind.css index d65d7559..b5ec025b 100644 --- a/src/styles/tailwind.css +++ b/src/styles/tailwind.css @@ -72,7 +72,7 @@ box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); border-radius: 4px; overflow: hidden; - width: 40%; + width: 50%; } .imagewrapper-big {