Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: add contributing docs page #6061

Merged
merged 32 commits into from
Jun 17, 2024
Merged
Changes from 1 commit
Commits
Show all changes
32 commits
Select commit Hold shift + click to select a range
6861652
chore: finish structure and contributing to docs section
maciekstosio May 13, 2024
f4a74a6
chore: finish structure and contributing to docs sections
maciekstosio May 13, 2024
da5a52a
chore: start progress on Contribute to code section
maciekstosio May 13, 2024
9ae7412
First draft of contributing guide
maciekstosio May 29, 2024
3babc27
Add discord contact information
maciekstosio Jun 3, 2024
203542d
Add link to contributing guide on outdated pages
maciekstosio Jun 3, 2024
7efd9a6
Change placment of discord contatct info
maciekstosio Jun 3, 2024
d02d821
Merge current main
kacperkapusciak Jun 7, 2024
8b9eb5e
Reformat contributing.mdx, fix typos
kacperkapusciak Jun 7, 2024
1dd801a
Rename docs compatibility info component, make it private
kacperkapusciak Jun 7, 2024
f4512bb
Draft documentation writing style guide
kacperkapusciak Jun 7, 2024
075dd2d
Stash work
kacperkapusciak Jun 7, 2024
f7fb0d2
Merge remote-tracking branch 'origin/main' into @maciekstosio/Contrib…
kacperkapusciak Jun 12, 2024
ec26fa5
fix merge conflict issues
kacperkapusciak Jun 12, 2024
53c9edb
Finish docs style guide
kacperkapusciak Jun 12, 2024
19fbd84
Update the guides for monorepo
kacperkapusciak Jun 12, 2024
dd2ddaa
Improve contributing
kacperkapusciak Jun 12, 2024
079fcd9
Improve contributing even more
kacperkapusciak Jun 13, 2024
3a19d0b
Merge current main
kacperkapusciak Jun 13, 2024
dc38a83
Moar changes
kacperkapusciak Jun 13, 2024
df09881
Unordered list should be unordered
kacperkapusciak Jun 13, 2024
cf7f155
Resolve merge conflict changes
kacperkapusciak Jun 13, 2024
edb2452
Moar merge conflict changes
kacperkapusciak Jun 13, 2024
f4f16ca
Merge current main again pls stop
kacperkapusciak Jun 13, 2024
6e8f8a9
Update docs structure
kacperkapusciak Jun 13, 2024
456d7a1
Apply suggestions from code review
kacperkapusciak Jun 13, 2024
7a16a71
chore: path changes after change to monorepo
maciekstosio Jun 13, 2024
5b0f1db
fix: fix typo
maciekstosio Jun 13, 2024
48019a8
chore: fix positive to negative sentence
maciekstosio Jun 14, 2024
0b194ed
fix: remove unnecessary import from example
maciekstosio Jun 14, 2024
6c61a81
chore: yarn format
maciekstosio Jun 14, 2024
c4287da
chore: remove project structure overview
maciekstosio Jun 17, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Next Next commit
chore: finish structure and contributing to docs section
  • Loading branch information
maciekstosio committed May 13, 2024
commit 6861652dc2adacb4bca0b2717f3baa381574845c
121 changes: 121 additions & 0 deletions docs/docs/guides/contributing.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,121 @@
---
id: contributing
title: Contributing
sidebar_label: Contributing
---

Thank you for your interest in contributing to Reanimated.




## Ways to Contribute

1. Replying and handling open issues -

// TODO: The most important is reproducible repo or example

2. Helping with documentation -

3. Reviewing pull requests -

4. Fixing bugs -

// TODO: Add good first issue label

### Repository overview



## Handling open issues

## Helping with documentation

One of many ways you can contribute to this project is by extending documentation. We try to keep it up to date, but there is still plenty room for improvement. It is also important to update the docs whenever you introduce changes to the API or you discover any inconsistency in current API or behavior. This is also one of the simplest way to contribute, as some of our docs are still in v2 format, so you can help us convert them to Reanimated 3 page structure.


The Reanimated documentation is hosted using docusaurus and GitHub Pages. The easiest way to start adding your changes it by clicking "Edit this page" at the bottom of each page.

### Editing source locally

If you want to introduce more complicated changes it is worth to edit it locally, this way you can utilize live preview to make sure everything will look as expected for the end users. To start please follow the steps below:

1. Read How to Open a Pull Request // TODO: link
2. Clone [react-native-reanimated](https://github.com/software-mansion/react-native-reanimated/)
3. `cd docs`
4. `yarn`
5. `yarn start`

This will start your local docusaurus server hosting documentation.

### Project structure

Here you can find the most important parts of the `react-native-reanimated/docs` project. Not all folders are listed, as most of them is not intended to be changed.

1. `docs/` - contains folder with md/mdx files, each folder is a section in the side navigation, and each file is documentation page
2. `src/examples` - contains examples that are later presented in the documentation
3. `src/components` - contains components used to make the pages interactive
4. `static/recordings` - containts video recordings of the examples

### Documentation page structure

It is important to keep the page structure consistant, this help developers easly navigate and quickly find what they are looking for. In the v3 of documentation, we assume given structure:

1. `Introduction` - short introduction what given feature does.
2. `Reference` - simplest possible usage showcase and type definitions, make sure that example code runs when someone copies it to quickly prototype.
3. `Arguments` - details about the arguments that given method accepts.
4. `Returns` - details of retunred values.
5. `Example` - video, gif or interacive demo with source code. It is good practice to provide resoruces in both light and dark mode.
6. `Remarks` - make sure to highlight everything that might not be obvious i.e. platform specififc quirks, compatibility issues, additional setup required.
7. `Platform compatibility` - information about platforms that given feature supports.

The structure may vary depending on given feature. If the one above doesn't seem to be good fit for you, try to find similar feature and see how it is documented.

### Embeding examples

We try to make the examples as easy for the users as it gets. This is why good, interactive examples are crucial. To create great examples you can use `InteractiveExample` component, it takse `src` prop that expects source of a component that you can declare in `src/examples` and a`component` that showcase given code.

#### Example with a video

```javascript
import useBaseUrl from '@docusaurus/useBaseUrl';
import AnimatedKeyboardSrc from '!!raw-loader!@site/src/examples/AnimatedKeyboard';

<InteractiveExample
src={AnimatedKeyboardSrc}
component={
<ThemedVideo
center
width={300}
sources={{
light: '/recordings/useAnimatedKeyboard_light.mov',
dark: '/recordings/useAnimatedKeyboard_dark.mov',
}}
/>
}
/>
```
#### Example with an interactive component

```javascript
import DecayTrain from '@site/src/examples/DecayTrain';
import DecayTrainSrc from '!!raw-loader!@site/src/examples/DecayTrain';

<InteractiveExample
src={DecayTrainSrc}
component={<DecayTrain />}
label="Grab and drag the train"
/>
```

## Reviewing pull requests

## Fixing bugs

## Additional materials

### How to Open a Pull Request



See you on GitHub! 🎉