Search code examples
reactjsgithubdeploymentgithub-pages

Website is not showing on GitHub Pages after deployment


This is my first time deploying onto GH Pages and it seemed like everything was right. It states "Your site is published at https://shayanvalaie.github.io/portfolio/" but after going to the address it gives me a getting started with react page.

After doing some research I found that it might be due to the fact that it is taking my master branch and the solution was to change to the gh-pages branch but after checking it seems I don't have a gh-pages branch.

This is my package.json

  "homepage": "https://shayanvalaie.github.io/portfolio/",
  "name": "portfolio",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.36",
    "@fortawesome/free-brands-svg-icons": "^5.15.4",
    "@fortawesome/free-solid-svg-icons": "^5.15.4",
    "@fortawesome/react-fontawesome": "^0.1.15",
    "@testing-library/jest-dom": "^5.14.1",
    "@testing-library/react": "^11.2.7",
    "@testing-library/user-event": "^12.8.3",
    "bootstrap": "^5.1.3",
    "emailjs-com": "^3.2.0",
    "gh-pages": "^3.2.3",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-hook-form": "^7.17.5",
    "react-particles-js": "^3.5.3",
    "react-scripts": "4.0.3",
    "react-typed": "^1.2.0",
    "tsparticles": "^1.36.0",
    "web-vitals": "^1.1.2"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-prettier": "^4.0.0",
    "prettier": "^2.4.1"
  }
}```


  

Solution

  • I found the solution. I was following a botched tutorial and it missed the step where I need to run "npm run deploy".