I'm aware that there is documentation, but I'm still confused on adding my own javascripts and CSS files.
If I want to load my own files, where do I add them? Do I need to create a new page under
XXXX.fandom.com/wiki/MediaWiki:XXXX.js
XXXX.fandom.com/wiki/MediaWiki:XXXX.css
Then what until they are approved?
For CSS, there is no need for them to be approved. You need to put them into wiki.fandom.com/wiki/MediaWiki:Wikia.css to get them showing up on your wiki.
For JavaScript, you need to wait for approval. You need to put your JS code into wiki.fandom.com/wiki/MediaWiki:Wikia.js to get them showing up on your wiki. If you're importing from the Dev wiki, though, you can check out your wiki's MediaWiki:ImportJS, which skips the review process since they are trusted scripts.
Yes, but the JS will still need to get reviewed, if it imports into the main wiki-wide JS page. ImportJS scripts are basically already separated out.
See Help:JavaScript review process for more info on the JS part. See Help:Including_additional_CSS_and_JS#CSS_imports for how to import CSS from separate pages.
But if I only use a JS for just one template, does it still need to be reviewed?
Yes. All JS applied site-wide, regardless of scope/action/intent, must be reviewed and approved by staff. No nexceptions. ImportJS appears to provide an exception but actually doesn't. While ImportJS itself is not reviewed, each script that is imported is.
