Can't access my netlify site / netlify site won't load

oh my goodness - after all that troubleshooting and then you figured it out yourself! :tada: :tada: :tada:

1 Like

Thank you! To be honest though, you taught me a lot about how netlify works and the production build process. Thank-you so much for your help!

3 Likes

awesome. i’m glad that was helpful!!

2 Likes

I know this is resolved now, but just for the record, yarn build works fine too. You can use either Yarn or npm with Create React App :slight_smile:

Hey Perry,

I’ve just finished my first draft version of my Rmarkdown website where I used the Distill package in RStudio to create my website. I used Netlify to publish via GitHub. Is there a reason my site on page EDA is not working or not loading because the rest of the website pages works fine. Here is my website https://eragroforestry.netlify.app and this one has problems https://eragroforestry.netlify.app/eda

Hi @kamaulindhardt,

Have you checked the console?

There appears to be some errors which might be causing this.

1 Like

Hi @hrishikesh ,

Thank you for responding to my issue. I see :thinking: I am very new to the whole GitHub – Netlify deployment things… Could you elaborate a bit on how I can get a closer look at these errors? Which console?

All the best,
Kamau!

It’s the browser’s console, or developer tools/inspect element - whatever you’d call it. The errors reported there are usually thrown by the client-side JavaScript, however it might include some network errors like 404s too.

Alright Thanks!

Indeed I found this in Safari –> Develop –> Show JavaScript Console. Now could you maybe please tell me what I can do to get a better understanding of the errors and potentially fix the issues? By now I kinda get that the issue is not with Netlify but rather with the development of my site, right?

So, the home page is just showing some 404 errors for JS Source Maps - you could ignore those as it’s not going to cause any issues with the website.

However, if you go to the page that you say is not working, you’d see the errors I posted in my screenshot.

The way the console works is, it will show the error text and to the right, it shows the source of that error. In your case, the first error is being thrown by the eda page itself. If you click on that text to the right, you’d directly jump to the line that threw the error. From there, you’d have to figure out why your code won’t work.

For example, the second error in my screenshot above says it’s a JSON Parse error which would tell me that there’s something wrong with the JSON you’re asking your JavaScript to parse using JSON.parse(). When I click on that line to take me to the error, it says unexpected end-of-file. Double-check the JSON that you’re trying to parse.

Side note: The page eda weighs over 10 MB! This is going to affect the performance badly and you can see, the page loads very slowly. Not to mention, you’re losing 10 MB bandwidth for each page load.

1 Like

Thank you @hrishikesh. I appreciate your help.

Alright, I will just have to debug one by one. Yes indeed my site is very large. I also recieved warnings by GitHub when I push my changes to my repo. It is because I have included quite a lot of R code and data analysis froom rmarkdown. I definitely have to find a way around this, as this is currently not sustainable.

Might get back to you again, but this was very helpful.

Cheers,
Kamau

Hi @hrishikesh,

I have tried to add my website content one by one – for checking where the error issue arise. Now it loads properly, after a little while, however I still get these error messages. What do they actually mean? It does not really block the website but I am curious.

Thank you!



Hi @kamaulindhardt,

Great to see you got it up and running! :netliconfetti:

About your question, not all of them are errors. You can classify them as:

  1. Red Background: Error
  2. Yellow Background: Warning
  3. While Background: Logs

The errors in the first screenshot are serious and should be fixed. They are saying it’s Mixed Content as in, you’re tying to load content over http:// instead of https:// when the original website is using https://. It’s important to use the latter for improved security. It looks like you’re loading some fonts from Google, and so you should be able to simply change http:// to https://.

The error in the second screenshot about the Facebook URL is simply saying URL blocked by client - it could be blocked by your machine due to some ad blocker or firewall, etc - but it might be safe to ignore.

The warnings, are about Source Maps not being found and I’d ignore them - but there’s yet another way to remove them completely. You could stop generating source maps altogether or remove the last line from your JavaScripts about the source maps URLs, or disable loading of source maps in Chrome.

The logs on the other hand are something logged by your code (console.log()) or by the libraries you use. They’re useful for debugging, but you could get those off by removing the log statements from your code.

1 Like

Hi @hrishikesh ,

Again thanks for your help. Hope you enjoyed your weekend!

I have run into a number of other issues after making minor alterations to my website. And now it seems that there is some issues in one of my tables. But I dont get why as the table is from previous changes – and added a long time ago.

What is even weirder is that after re-loading the site a couple of times. It appears to wotk fine. Now giving me these messages:

Any explanations as to why I can re-load the page and suddenly things are “fine”?

The console in the first screenshot is again reporting a JSON error. Are you loading the JSON from some other API or something? Chances are, that it’s returning a malformed JSON from time to time - thus the error.

What does this JSON mean? Its a picture or what? I don’t get it… Is there a way I can identify where it is? @hrishikesh

Hi @kamaulindhardt,

JSON is JavaScript Object Notation. It’s a text-file format. I don’t know how your website is requesting it, or using it, etc. - that’s something you’d have to check your code for.

1 Like

Hi good day I deployed a pwa react app and I cant access the site… here is the link
My-app.

I followed the whole conversation on this thread and seems like things wont work in my case. Can you help me with the problem?

Hi @TezadaConnect,

Your website seems to be working fine.

maggiejprice.com works fine on me but most site that has a netlify.app is having some trouble. like this one https://maggiejprice.netlify.app/. Hope that netlify will fix this.