Developer guide

Hello, I’d like to contribute but I’m quite lost in the source code. Is there any developer guide, maybe class diagrams / sequence diagrams for reference?


I think that there is not. I certainly haven’t seen that sort of thing, or any reference to it.

Feel free to ask questions here, it’s probably the best place to ask.

The OGS client is “laid out” like a normal React App, so if you don’t have any expeience of React, learning “Hello World” of React will definitely help.

If you do have React experience, and have more detailed questions, ask away…


Yeah pretty much all of us just learnt by making tweaks first then stepping it up but if you’re stuck on anything definitely ask and someone will help you out.


There is a contributing guide, but that’s basically just where to get set up. What area of the site are you looking at modifying? Maybe we can help illuminate that area.

Quick overview

Contributions are going to be confined to the src folder 90% of the time.

There are three major subfolders:

The views folder is where you will find many of the page layouts for the site. For example, the User folder dictates the style and layout for a user’s profile page. The Overview folder dictates the style and layout of the homepage.

The components folder contains many React Components that are used across the site. For example, the Player folder holds the code for the usernames that you can click on and see a player card. Chat is another component: you might see this component show up in groups pages, tournaments pages etc.

Finally, the lib folder is for a lot of the pure TS that gets used in various places. No React or JSX in this folder. For example, the translation functions _() and pgettext() live in translate.ts. Another important function is the glicko rating-to-rank conversion that lives in rank_utils.ts.

This is by no means a comprehensive overview, so please ask specific questions if you’d like us to go into detail on a certain aspect of the code (e.g. “What is Goban?” or “How do I make a new URL?” or “How do I save settings?”)


Great, and I thought it was TypeScript XD so this is why I got stuck trying to modify Goban…

It’s react and typescript, mostly. :slightly_smiling_face:

To be clear - React is the framework, and most of it is coded in Typescript on that framework (just clarifying that React and Typescript are like Apples and Tables, in case Bhyddens observation was taken to imply equivalence (which he didn’t mean, but it could read that way)).


Thanks for clarifying, I knew they were different but didn’t know the specific words to define that, and was secretly hoping you would expand on my comment :wink: just wanted to jump in early with “it’s not one or the other but both”

Don’t forget about GitHub - online-go/goban: A JavaScript library for exploring and playing the game of Go
It’s for contributors to lose all hope.


Yeah I think starting on the UI is probably best :wink:

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.