@dotfivesix
Posted
Hi Naufal.
Nice UI and styling, I honestly like your project. As far as your problem is concerned, you can use fetch like:
fetch("./data.json").then(res => res.json()).then(data => {
// use data here
});
Modifying data.json isn't great option because if .json data is large and complex, it wouldn't be effective and when connecting frontend with backend, you have to work using JSON so it's necessary to understand it.
Let me know if there is any issue or confusion. Happy Coding !
@DarkDev56 Hi DarkDev56, Thanks for your feedback and thanks for your appreciation to my project.
I just try to use fetch like your code, but when its running in normal browser not in the live server. The browser show error and it's said Cross-origin request rejected. And it's the same problem for me until now when import the JSON file to JS.
The alternate for my problem is copying the data from JSON and paste it with new file JS. Any alternate for this problem ?
@dotfivesix
Posted
@naufalf25 As far as I know, Cross-origin error comes when requests come from a different domain (than host).
Make sure the URL u put in fetch() is "./data.json"
or "./js/data.json"
something and not http://localhost:3000/data.json
(don't include domain), if it's like this, code will work in live-server but not when you open file directly/host it.
@DarkDev56 Alright, thanks for your solution. Its very helpful for me :D
@dotfivesix
Posted
@naufalf25 No problem, glad it helped :)