I Can't access my GitHub (raw.githubusercontent.com) files

Question

When I try to Open My GitHub Raw file in Chrome Browser or Microsoft Edge. I Can't Open that URL.

https://raw.githubusercontent.com/imhardikdesai/JSON-Data/main/Hardik-Desai-Portfolio/project.json I got this Error When I Opend in Browser

Console Error

import React, { useState, useEffect } from "react";
import { Container, Row, Col } from "react-bootstrap";
import ProjectCard from "./ProjectCards";
import Particle from "../Particle";

function Projects() {

  const [project, setProject] = useState([])

  const fetchProject = async () => {
    const url = 'https://raw.githubusercontent.com/imhardikdesai/JSON-Data/main/Hardik-Desai-Portfolio/project.json';
    let data = await fetch(url);
    let myProjects = await data.json();
    setProject(myProjects.projects);
  }

  useEffect(() => {
    fetchProject();
  });

  return (
    <Container fluid className="project-section">
      <Particle />
      <Container>
        <h1 className="project-heading">
          My Recent <strong className="purple">Works </strong>
        </h1>
        <p style={{ color: "white" }}>
          Here are a few projects I've worked on recently.
        </p>
        <Row style={{ justifyContent: "center", paddingBottom: "10px" }}>

          {project.map((element) => {
            return <Col md={4} className="project-card" key={element.imgurl}>
              <ProjectCard
                imgPath={element.imgurl}
                isBlog={false}
                title={element.title}
                description={element.description}
                ghLink={element.sourceLink}
                badge={element.badge}
                demoLink={element.liveDemoLink}
              />
            </Col>
          })}

          {/* <Col md={4} className="project-card">
            <ProjectCard
              imgPath={bitsOfCode}
              isBlog={false}
              title="Bits-0f-C0de"
              description="My personal blog page build with Next.js and Tailwind Css which takes the content from makdown files and renders it using Next.js. Supports dark mode and easy to write blogs using markdown."
              ghLink="https://github.com/soumyajit4419/Bits-0f-C0de"
              demoLink="https://blogs.soumya-jit.tech/"
            />
          </Col> */}
        </Row>

      </Container>
    </Container>
  );
}

export default Projects;

But I am able to open this URL in My Mobile Browser.

I try to open my GitHub JSON file in raw content, so I can use that file as a Fetch API in my Projects

JSON File Url :-

https://raw.githubusercontent.com/imhardikdesai/JSON-Data/main/Hardik-Desai-Portfolio/project.json

Answer 1

Try changing your dns server to something like cloudflare, google rather than the isp provided dns. Cloudflare (1.1.1.1, 1.0.0.1) google dns (8.8.8.8, 8.8.4.4)

You can follow this guide to change your dns server https://developers.google.com/speed/public-dns/docs/using#change_your_dns_servers_settings