Where to include web browser API JavaScript files (Tailwind light mode)
Answered
Arboreal ant posted this in #help-forum
Arboreal antOP
I've just been researching how to implement light and dark mode in Tailwind -> https://tailwindcss.com/docs/dark-mode
I'm a little bit confused about where I should place the JS file.
I'm using TS and know that to interact with the browser the file needs to be a JS file. I'm thinking I should place it directly in the public folder (within the root directory).
Is this correct?
Once I've established where to keep these kinds of scripts I'll probs have one small follow up question.
Thanks for your help!
I'm a little bit confused about where I should place the JS file.
I'm using TS and know that to interact with the browser the file needs to be a JS file. I'm thinking I should place it directly in the public folder (within the root directory).
Is this correct?
Once I've established where to keep these kinds of scripts I'll probs have one small follow up question.
Thanks for your help!
Answered by joulev
i would recommend to just use an [existing solution](https://github.com/pacocoursey/next-themes). but if you want to implement it yourself, it's best to [inline the script](https://nextjs.org/docs/app/building-your-application/optimizing/scripts#inline-scripts) as the browser doesn't have to spend time downloading another file before being able to run theme logic
2 Replies
@Arboreal ant I've just been researching how to implement light and dark mode in Tailwind -> https://tailwindcss.com/docs/dark-mode
I'm a little bit confused about where I should place the JS file.
I'm using TS and know that to interact with the browser the file needs to be a JS file. I'm thinking I should place it directly in the public folder (within the root directory).
Is this correct?
Once I've established where to keep these kinds of scripts I'll probs have one small follow up question.
Thanks for your help!
i would recommend to just use an [existing solution](https://github.com/pacocoursey/next-themes). but if you want to implement it yourself, it's best to [inline the script](https://nextjs.org/docs/app/building-your-application/optimizing/scripts#inline-scripts) as the browser doesn't have to spend time downloading another file before being able to run theme logic
Answer
Arboreal antOP
Thanks for your comment, I went down the existing solution path later on. I've just come from Astro, which is very different, so I'm a bit disorientated.