Search code examples
githubgithub-pages

GitHub page shows readme file instead of index.html but works only if mentioned full path to html file

I am new to this and I would really need some help. I am trying to deploy my GitHub page from my GitHub repository. I have set the gh-pages branch as my default, I put the code in there.

The code is in here: https://github.com/MelisaBogdan/melisabogdan.github.io

I tried to check if the website is visible with this link https://melisabogdan.github.io but all I see is the readme file. BUT I can perfectly see it by mentioning the folders https://melisabogdan.github.io/root/index.html

I know that many people managed to have their website visible without mentioning the full path ( by simply typing https://melisabogdan.github.io). Is there anything I can do? I would really appreciate some help I tried what some other people suggested....

Solution

  • Since this is a NodeJS based site, there are many things that you need to do. Do the following steps to see your portfolio at https://melisabogdan.github.io/ . Basically you need to setup a GitHub action in your repository which runs the NodeJS code & then puts the static HTML/CSS files in your gh-pages branch.

    1. Change your default branch to master by going to your_repo > settings > Branches (on left tab) > Default branch
    2. Create a folder .github (include that dot) in the master branch
      • create a folder workflows within this folder
      • create a file deploy.yml inside workflows folder
    3. Put the following code in deploy.yml
    name: Build and Deploy
on:
  push:
    branches:
      - master
jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout 🛎️
        uses: actions/[email protected]
        with:
          persist-credentials: false 

      - name: Install and Build 🔧
        run: |
          npm install
          npm run build

      - name: Deploy 🚀
        uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.GITHUB_TOKEN }}
          publish_dir: ./dist
    1. So finally the folder structure should be like: melisabogdan.github.io/.github/workflows/deploy.yml
    2. Now commit these files to GitHub
    3. Now if you go to the actions tab in your repo, should see an action running. It will take 2-3 mins & then finally, you should be able to see your site at https://melisabogdan.github.io/