Skip to content

Commit e106975

Browse files
committed
feat: initial docs setup
1 parent 9de7a12 commit e106975

40 files changed

+8449
-1270
lines changed

blog/2019-05-28-first-blog-post.md

-12
This file was deleted.

blog/2019-05-29-long-blog-post.md

-44
This file was deleted.

blog/2021-08-01-mdx-blog-post.mdx

-20
This file was deleted.
Binary file not shown.

blog/2021-08-26-welcome/index.md

-25
This file was deleted.

blog/authors.yml

-17
This file was deleted.

docs/getting-started/_category_.json

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"label": "Getting Started",
3+
"position": 2,
4+
"link": {
5+
"type": "generated-index"
6+
},
7+
"collapsed": false
8+
}
9+
+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
---
2+
sidebar_position: 2
3+
---
4+
5+
# Create your first App
6+
7+
1. Make sure you have a [proper development environment setup](https://reactnative.dev/docs/environment-setup)
8+
2. Download the latest Xcode (at least 15.2).
9+
3. Install visionOS simulator runtime.
10+
4. Install the latest version of CMake (at least v3.28.0).
11+
5. Initialize the project using this command:
12+
13+
```sh
14+
npx @callstack/react-native-visionos@latest init YourApp
15+
```
16+
17+
6. Next, go to `YourApp/visionos` folder and run following commands to install Pods:
18+
19+
```sh
20+
bundle install
21+
bundle exec pod install
22+
```
23+
24+
7. Now you can run `yarn visionos`
25+
8. (Optional) you also can open project using Xcode (`xed YourApp/visionos/YourApp.xcworkspace`).
26+
27+
- Build the app by clicking the "Run" button in Xcode.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
# Platform Guidelines
2+
3+
We suggest you read [Human Interface Guidelines for visionOS](https://developer.apple.com/design/human-interface-guidelines/designing-for-visionos) when creating visionOS apps.
4+
5+
It's important not to cover the translucent background with a solid color, as it helps to ground apps and make them feel like part of the environment.

docs/intro.md

+12-33
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,26 @@
11
---
22
sidebar_position: 1
3+
slug: /
34
---
45

5-
# Tutorial Intro
6+
# Introduction
67

7-
Let's discover **Docusaurus in less than 5 minutes**.
8+
:::warning
89

9-
## Getting Started
10+
This project is still at an early stage of development and is not ready for production use.
1011

11-
Get started by **creating a new site**.
12+
:::
1213

13-
Or **try Docusaurus immediately** with **[docusaurus.new](https://docusaurus.new)**.
14+
> Learn once, write anywhere: Build spatial apps with React.
1415
15-
### What you'll need
16+
React Native visionOS allows you to write visionOS **apps with full support for platform SDK**. This is a full fork of the main repository with changes needed to support visionOS.
1617

17-
- [Node.js](https://nodejs.org/en/download/) version 18.0 or above:
18-
- When installing Node.js, you are recommended to check all checkboxes related to dependencies.
18+
![Welcome](../static/img/welcome-rn-visionos.png)
1919

20-
## Generate a new site
20+
## How is it different from running app in compatibility mode?
2121

22-
Generate a new Docusaurus site using the **classic template**.
22+
React Native visionOS unlocks full capabilities of the platform, giving your app transparent look that feels right at home next to other visionOS apps. It allows you to leverage the power of ImmersiveSpaces and multi-window apps.
2323

24-
The classic template will automatically be added to your project after you run the command:
24+
Side by side comparison of running the same app: React Native visionOS vs React Native iOS (Compatibility mode).
2525

26-
```bash
27-
npm init docusaurus@latest my-website classic
28-
```
29-
30-
You can type this command into Command Prompt, Powershell, Terminal, or any other integrated terminal of your code editor.
31-
32-
The command also installs all necessary dependencies you need to run Docusaurus.
33-
34-
## Start your site
35-
36-
Run the development server:
37-
38-
```bash
39-
cd my-website
40-
npm run start
41-
```
42-
43-
The `cd` command changes the directory you're working with. In order to work with your newly created Docusaurus site, you'll need to navigate the terminal there.
44-
45-
The `npm run start` command builds your website locally and serves it through a development server, ready for you to view at http://localhost:3000/.
46-
47-
Open `docs/intro.md` (this page) and edit some lines: the site **reloads automatically** and displays your changes.
26+
<video width="100%" controls src="https://github.com/callstack/react-native-visionos/assets/52801365/dd5d6351-3843-4f4a-ae67-541c068ac7be"/>

docs/tutorial-basics/_category_.json

-8
This file was deleted.

docs/tutorial-basics/congratulations.md

-23
This file was deleted.

docs/tutorial-basics/create-a-blog-post.md

-34
This file was deleted.

docs/tutorial-basics/create-a-document.md

-57
This file was deleted.

docs/tutorial-basics/create-a-page.md

-43
This file was deleted.

0 commit comments

Comments
 (0)