Switch private API keys and URLs to .env files

[fstk5]

New dependencies

• craco: Allows adding to hidden pre-configured webpack.config.js files.
• dotenv-webpack: Substitution for dotenv which was requiring multiple other dependencies.

Why were they used?

• craco: The project's webpack.config.js file allowing to edit hidden or pre-configured webpack configuration files, and craco allows owerwriting or adding to those hidden files. In this case, it was used to export dotenv-webpack and dotenv to be imported into src/firebaseConfig.js to allow process.env variables.
• dotenv-webpack: I decided to use dotenv-webpack over dotenv, since the latter would have required multiple other dependencies to work.

Are they necessary?

• craco: When testing both dotenv-webpack and dotenv, they both required edits to webpack.config.js to export either dotenv's dependencies, since there was a breaking change in webpack version 5, or dotenv-webpack's dotenv overwrite.
• dotenv-webpack: dotenv-webpack could be replaced by dotenv, however it would require a few more libraries and a bit more tweaking, so I opted for dotenv-webpack for less dependencies. If anyone wants to take the time to switch to standard dotenv, go ahead.

Testing
After running the app with the changes, there were 2 warnings and no errors in the log output. Firefox DevTools console reported 3 errors, however they were unrelated to dotenv-webpack, craco, or any other changes to the code.

Warnings

• 'Conflicting values for process.env,' however the website still pulls environment variables from the local .env file.
• 1 other warning in a child process.

fstk5/ScoutingWebsite
Firefox DevTools Console

Output of npm start

Patribots4738/ScoutingWebsite
Firefox DevTools Console

Output of npm start

also this is my first time making a pull request i think this is everything? mb if there's smth i missed
also i didnt use ai, this is how i write (it honestly looks like ai wrote it to me)

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
scouting-website	Error			Sep 20, 2025 8:25pm

[GalexY727]

It should be noted that dotenv is primarily used for backend and dotenv-webpack is for frontend, for the most part. So it was the right choice, just for a little bit of a different reason

[GalexY727]

And u really knocked this pr out of the park in terms of documentation and explanations. Great work!