Page 1 of 1

How do I add the board in reversi tutorial?

Posted: 02 December 2025, 06:30
by kingdedede745
New developer here, I'm going through the tutorial at

https://en.doc.boardgamearena.com/Tutorial_reversi

When I get to the step about adding the board, it's not showing up. I have a jpeg image of the board in the img folder. Can anyone help?

https://imgur.com/a/qKhpyuw

In the pictures above, what I've added is circled in red.

Re: How do I add the board in reversi tutorial?

Posted: 02 December 2025, 09:22
by thoun
Have you tried Ctrl+F5 to force refresh of the img cache ?
If you open the DevTools network tab, what does it say for this image?

Re: How do I add the board in reversi tutorial?

Posted: 02 December 2025, 11:36
by AxeCrazy
did you also manually upload the pg to the server?
Since images are not automaitcally uploaded in vscode (at least, by default)

Re: How do I add the board in reversi tutorial?

Posted: 03 December 2025, 08:17
by kingdedede745
AxeCrazy wrote: 02 December 2025, 11:36 did you also manually upload the pg to the server?
Since images are not automaitcally uploaded in vscode (at least, by default)
I did not manually upload it, that was it! Thanks. I didn't know images were not automatically uploaded.
thoun wrote: 02 December 2025, 09:22 Have you tried Ctrl+F5 to force refresh of the img cache ?
If you open the DevTools network tab, what does it say for this image?
For my future reference, what is the DevTools network tab? I don't see anything like that anywhere.

Re: How do I add the board in reversi tutorial?

Posted: 03 December 2025, 15:40
by AxeCrazy
in chrome pressing F12 will bring up the devtools.
one of the tabs is named network.
In that you can see all data loded, filterable by type

Re: How do I add the board in reversi tutorial?

Posted: 03 December 2025, 21:09
by PanzerLeader
AxeCrazy wrote: 03 December 2025, 15:40 in chrome pressing F12 will bring up the devtools.
one of the tabs is named network.
In that you can see all data loded, filterable by type
For additional info, there is documentation at https://developer.chrome.com/docs/devtools/network. The Log Network Tab section on that page provides useful details for seeing what happened to resources that failed to load (e.g. File Not Found, Forbidden, etc). If you’re a web developer (on BGA or elsewhere), DevTools is your best friend to help you see behind the curtain, so to speak. For example, you can set breakpoints in JavaScript code (yours or someone else’s) and step through it one line at a time.

I’m just starting out as a BGA developer but have been a developer by day for 20+ years. BGA is a new frontier for me, and more exciting than creating Azure apps, website widgets and SQL stored procedures. Let the learning begin.