reactplay / docs Goto Github PK

Descrcibe the bug?

The web app should now have a linkedin link in the footer after the mergin of PR #38 but it is not so.

Steps to reproduce the bug?

Expected behavior

Desktop (Please provide your system information)

Mobile (Please provide your device information)

Screenshot / Screenshare

No response

Relevant log output

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Currently, we don't have a proper structure for docs content files and have some unwanted files, so we need to delete the unwanted files and create the proper structure.

Descrcibe the bug?

Path: How to guides -> How to create a play

On this page instead of an image it shows the code of the image. Here used markdown format and due to an unexpected space, the image code is delivered as a code snipped format. That's why it shows the code instead of the image.

Steps to reproduce the bug?

1. How to guides -> How to create a play
2. Remove space from here

npx create-react-play@latest -c <the_play_id>
`
    <p align="center">
    <img src="https://res.cloudinary.com/atapas/image/upload/v1675172352/ReactPlay/Screenshot_2023-01-31_at_7.06.07_PM_jhbcbl.png" alt="copy-command" />
    </p>

Expected behavior

It will be show an image instead of code

Desktop (Please provide your system information)

OS: Windows
Browser: Google chrome

Mobile (Please provide your device information)

No response

Screenshot / Screenshare

Problem:

After solve:

Relevant log output

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

In that project, if we add releases after changes it would be great.

Or if no just close this release option 😢

What about you?

Is your feature request related to a problem? Please describe.

As a user of ReactPlay, I would like to suggest the localization of the website in the Bangla language. By providing content in the native language of Bangla-speaking users, ReactPlay can greatly enhance the user experience. Users will feel more comfortable navigating the website, understanding instructions, and accessing features without any language barriers. It will make the website more accessible and user-friendly, attracting a wider audience.

Describe the solution you'd like.

I want to localize ReactPlay website in Bangla.

Describe alternatives you've considered.

Also, we can localize the ReactPlay website in the most engaged popular languages for better engagement with ReactPlay.

Screenshot / Screenshare

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Update README.md files to help contributors to know more about the repository and instructions to set it up.

Currently, there is no way to navigate to react play website from the doc site, so add the ReactPlay link to the doc site in the navbar.

Descrcibe the bug?

• The following options that are available on the header are viewable only on desktop screens.

Steps to reproduce the bug?

If you visit https://react-play-docs.netlify.app/ on your desktop, you can see these options.
However, if you view the same website using mobile devices, there is no way to access these links.

Expected behavior

• These options are to be made available in the side panel.

Desktop (Please provide your system information)

• We can access links to Blog, Guide, and ReactPlay on desktop
• We have the option to change the language

Mobile (Please provide your device information)

• These options are not available on mobile view

Screenshot / Screenshare

Relevant log output

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Visit https://react-play-docs.netlify.app/intro and an introduction to react play page will be open and need to improve that page by adding more details about react play.

Please refer these links to know more about react play

• https://github.com/reactplay/react-play#readme
• https://blog.reactplay.io/introducing-reactplay-learn-create-share-reactjs-projects

Create a doc page that talks about the database schema of the plays, users, and other entities in react play. also document how these entities are in a relationship with each other.

Descrcibe the bug?

In the APIs hook section of the docs, there is a typo/error in the Code snippet of useGitHub hook.

Steps to reproduce the bug?

const { data, error, isLoading } = useGitHub(username);

return (

Expected behavior

const { data, error, isLoading } = useGitHub(username);

return (

Desktop (Please provide your system information)

OS: Windows 10
Browser: Google Chrome

Mobile (Please provide your device information)

No response

Screenshot / Screenshare

Relevant log output

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Is your feature request related to a problem? Please describe.

In React-Play, we make use of JSON-GraphQL-parser to create GraphQL queries that are then passed as the payload to the GraohQL API.
We need to add the documentation on learning and understanding how to use the JSON-GraphQL-parser.

Describe the solution you'd like.

Migrate the documentation from https://github.com/koustov/json-graphql-parser/blob/main/README.md

Describe alternatives you've considered.

N/A

Screenshot / Screenshare

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Is your feature request related to a problem? Please describe.

Currently, there is no guide on how to style the play, so the creators just create the style files and add some generic class names and override the existing styling as well.

Describe the solution you'd like.

We should have a guide on "How to add styling to your play" where we should mention what to do and what not to do.
For Example:

• Class Names should start with the play name and in the kebab case
• Do not directly style the elements
• And more

Describe alternatives you've considered.

NA

Screenshot / Screenshare

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Is your feature request related to a problem? Please describe.

We need to create documentation containing the details of how anyone could become a maintainer of the ReactPlay open-source project.

Describe the solution you'd like.

It would be a guide under the "how to" section.

Describe alternatives you've considered.

Screenshot / Screenshare

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Change the placeholder text with ReactPlayIO and add the community, and blog links.

Is your feature request related to a problem? Please describe.

In the footer community section, we have Twitter and discord links, however, the LinkedIn link is missing, we should add the LinkedIn link.

Describe the solution you'd like.

Add the LinkedIn link in the footer community section.

Here is the LinkedIn link --> https://www.linkedin.com/company/reactplay/

Describe alternatives you've considered.

NA

Screenshot / Screenshare

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

I thought the present write-up about What is ReactPlay? could be improved to capture the essence of what ReactPlay is at its core.
With this issue, I seek to work on improving the write-up.

Create troubleshooting guides for the common problems that the community is facing.

For Example:

• npm install is not working, how to resolve this issue?
• my console is showing a bunch of errors and warnings, how to fix those?

1. Add issue templates
2. add contributions.md
3. add a code of conduct

Is your feature request related to a problem? Please describe.

The doc site should be mapped to docs.reactplay.io

Describe the solution you'd like.

• Create the subdomain and map in Netlify

Describe alternatives you've considered.

None

Screenshot / Screenshare

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Update the README with getting started with the project steps.

Is your feature request related to a problem? Please describe.

Currently we don’t have an OG image for doc site and because of that the gist of site is not looking good.

Describe the solution you'd like.

Creat an OG image for doc site.

Describe alternatives you've considered.

Na

Screenshot / Screenshare

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Is your feature request related to a problem? Please describe.

There are two newly added sections which are not been translated Bangla yet.

Describe the solution you'd like.

I wanna translate the newly added file into Bangla.

Describe alternatives you've considered.

Nothing else

Screenshot / Screenshare

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

there is a typo in the screenshot question in the above file. healps is the word.

The How to section should have documentation like:

• How ReactPlay uses Nhost as a backend. Here is the video that helps(https://www.youtube.com/watch?v=1qfDkmtuWqg)
• How to create a Play on ReactPlay? We have the md already?
• How not to override the styles of other plays while building a play?
• How to interact with ReactPlay data
• How authentication works on ReactPlay?

Whereas,

API Endpoints
Troubleshooting Guide
Database Schema should be outside of "How to Guide"

@Sachin-chaurasiya this issue is just to organize the "How to section". Please create issues for each of the elements mentioned above, if not created already.

In react play we are using the backend APIs with a custom react hook for fetching the plays and user's data. create a doc page and document about the API hook.

Descrcibe the bug?

change from "massage" to " message"

Steps to reproduce the bug?

go to Readme.md

Expected behavior

Desktop (Please provide your system information)

Mobile (Please provide your device information)

Screenshot / Screenshare

Relevant log output

-

Code of Conduct

• I agree to follow this project's Code of Conduct

Is your feature request related to a problem? Please describe.

I use dark mode in my browser because it's better for my eyes and websites with dark mode look quite attractive. However, it would be even nicer if a website enabled a mode by default based on the user's mode settings. This is what I think we should do here as well.

Describe the solution you'd like.

A CSS selector which looks after the default mode and changes the variable colours to darker shades, as stated on the data-theme selector. It may also require work in the JS selectors to ensure data-theme can be later switched accordingly.

Describe alternatives you've considered.

A JS script that changes the mode based on user settings.

Screenshot / Screenshare

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Descrcibe the bug?

The guides link in the footer is broken and redirects to https://react-play-docs.netlify.app/docs/intro ( this route does not exist).

Steps to reproduce the bug?

Expected behavior

It should redirect to https://react-play-docs.netlify.app/ instead if https://react-play-docs.netlify.app/docs/intro

Desktop (Please provide your system information)

OS: [e.g. iOS]
Browser [e.g. chrome]
Version [e.g. 113+]

Mobile (Please provide your device information)

No response

Screenshot / Screenshare

No response

Relevant log output

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Readme File doesn't have the link for original repo of reactplay, so If the user comes and forks this repo and try to run , it may not work as it's just a documentation.

My point is Update Readme File.

Is your feature request related to a problem? Please describe.

We are getting great contributions, however, one common question we get asked is "How to contribute".

Describe the solution you'd like.

Add a doc for "How to contribute", which provides step by step guide for contributing to this site.

Describe alternatives you've considered.

NA

Screenshot / Screenshare

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Doc site link --> https://react-play-docs.netlify.app/

If you visit the doc site the landing page is broken and it's showing a page not found like shown in the below image.

It should be linked to the /intro page, which means as soon as someone lands on the doc site they should see the below page.

Descrcibe the bug?

Sidebar -> How To Guides -> How To Create a Play -> Parameter Details

1. "Name" field description is not relatable to this field
2. Missing "Description" field

Steps to reproduce the bug?

Sidebar -> How To Guides -> How To Create a Play -> Parameter Details

1. Add a relatable description of "Name" field
2. Add "Description" field in second row after "Name" field

Expected behavior

Sidebar -> How To Guides -> How To Create a Play -> Parameter Details

1. Markdown code for "Name" filed to be replace.
   | Name | YES | Every play should have a name which is relatable with play idea. |
2. Markdown code for "Description" field to be create
   | Description | YES | It is a description of the play for users to understand it better. The maximum number of allowed characters is 1024. |

Desktop (Please provide your system information)

1. OS: Windows
2. Brower: Chrome

Mobile (Please provide your device information)

No response

Screenshot / Screenshare

No response

Relevant log output

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Descrcibe the bug?

Here it is in its current state: https://deploy-preview-34--react-play-docs.netlify.app/How-To-Guides/how-to-create-play

We need to port this content: https://github.com/reactplay/react-play/blob/main/CREATE-PLAY.md

Steps to reproduce the bug?

The content in the Create Play guide is not up-to-date.

Expected behavior

It should have this content: https://github.com/reactplay/react-play/blob/main/CREATE-PLAY.md

Desktop (Please provide your system information)

All

Mobile (Please provide your device information)

All

Screenshot / Screenshare

No response

Relevant log output

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Is your feature request related to a problem? Please describe.

Path: Contribution Guide -> Areas of Contribution
On that page, we need to add "Facebook" also as a social media contribution section along with Twitter and LinkedIn.

Describe the solution you'd like.

- Have interest in interacting with public, you are welcome to manage our social media handles like [Twitter](https://twitter.com/ReactPlayIO) and [LinkedIn](https://www.linkedin.com/company/reactplay/).
In this portion of code I would like to add Facebook Link also.

Describe alternatives you've considered.

Nothing else

Screenshot / Screenshare

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Descrcibe the bug?

Just change from "massage" to "message"

Steps to reproduce the bug?

Go to Readme.md file and make changes

Expected behavior

Desktop (Please provide your system information)

Mobile (Please provide your device information)

Screenshot / Screenshare

Relevant log output

-

Code of Conduct

• I agree to follow this project's Code of Conduct

Descrcibe the bug?

When too much cache gets collected in the ReactPlay website, it corrupts the site and the site does not opens

Steps to reproduce the bug?

1. Open DevTools on Chrome
2. Go to "Application"
3. Go to "Cache Storage" and open it
4. Clear all the Cache by right-clicking on it and select "Delete"

Expected behavior

After clearing the Cache, the website started working perfectly

Desktop (Please provide your system information)

Browser: Chrome

Mobile (Please provide your device information)

No response

Screenshot / Screenshare

No response

Relevant log output

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

Is your feature request related to a problem? Please describe.

I am frustrated when I do not find the required link. Say, for example, I know that a particular community has a discord server but it is difficult to find the link in most of the cases.

Describe the solution you'd like.

adding a discord server link in the navbar will help developers to jump right into the server.

Describe alternatives you've considered.

This would help beginners to redirect to the discord server instead of searching here and there for the link

Screenshot / Screenshare

No response

Additional context

No response

Code of Conduct

• I agree to follow this project's Code of Conduct