Skip to content

Commit

Permalink
Add basic docs
Browse files Browse the repository at this point in the history
  • Loading branch information
brampersandon committed Jun 9, 2019
1 parent 5e13527 commit f00a224
Show file tree
Hide file tree
Showing 3 changed files with 32 additions and 3 deletions.
4 changes: 2 additions & 2 deletions App.tsx
Expand Up @@ -2,7 +2,7 @@ import React from 'react';
import { KeyboardAvoidingView, StyleSheet, WebView, View } from 'react-native';

// Change this to the URL of your coder.com instance
const VSCODE_URL = "https://coder.com"
const CODER_URL = "https://coder.com"

// Change this to your VS Code top bar color
// (I use Solarized Light, I'm sorry (I'm not sorry))
Expand All @@ -13,7 +13,7 @@ export default function App() {
<View style={{width: "100%", height: "100%"}}>
<View style={{ backgroundColor: TOPBAR_COLOR, height: 20}}/>
<KeyboardAvoidingView style={{width: "100%", height: "100%"}} behavior={"padding"} enabled>
<WebView source={{ uri: VSCODE_URL }} style={styles.container} useWebKit={true} />
<WebView source={{ uri: CODER_URL }} style={styles.container} useWebKit={true} />
</KeyboardAvoidingView>
</View>
);
Expand Down
29 changes: 29 additions & 0 deletions README.md
@@ -0,0 +1,29 @@
# Run VS Code Remotely on iPad with Expo and Coder

## Getting Started

1. Set up a [Coder](https://coder.com) instance

- I recommend using [DigitalOcean](https://github.com/cdr/code-server/blob/master/doc/admin/install/digitalocean.md), but all the usual cloud provider suspects are supported.
- Set a strong password, and consider using [a network-level firewall](https://www.digitalocean.com/docs/networking/firewalls/quickstart/) in addition to your server's own software firewall to limit access to only IP addresses from which you'll be accessing it.
- I'll write up a little more about the process I've used to get set up, but feel free to ping me with questions at [@brandon_mn](https://twitter.com/brandon_mn).

At this point, you should be able to access the editor in Safari with a specific URL. Hold on to that URL, you'll need it in a sec.

2. Clone and build the Expo app

- Install [Expo Client](https://expo.io/tools#client) on your iPad
- Clone this repository with `git clone https://github.com/skylineproject/expo-vscode-ios`
- Log in to expo with `expo login`
- In `App.tsx`, replace the `CODER_URL` constant with the URL you saved at the end of step 1
- Deploy the app to your iPad with `expo publish`
- Launch the Expo app on your iPad, and you'll see "VS Code" listed there!

## Inspiration

This particular project was brought about by [Owen William's piece](https://twitter.com/ow/status/1136007778257002496) after WWDC about how the upcoming multitasking features in iPadOS will make it possible (even _enjoyable_!) for developers to work on the iPad. After a few idle hours of setup, I'm inclined to agree!

## Issues
- Slide Over/multitasking support (upstream w/ Expo Client)
- Copy/paste fails inconsistently (upstream w/ coder.com)
- You need to enter your Coder instance's password on every launch
2 changes: 1 addition & 1 deletion app.json
@@ -1,6 +1,6 @@
{
"expo": {
"name": "vscode",
"name": "vscode-ios",
"slug": "vscode-remote-ios",
"privacy": "unlisted",
"sdkVersion": "33.0.0",
Expand Down

0 comments on commit f00a224

Please sign in to comment.