reactjsgithubhttpshostingdomain-name

Hosting a webpage on github


i'm trying to host a website on github and it keeps showing this error :

"Unavailable for your site because your domain is not properly configured to support HTTPS(coursera-confusion.com) — Troubleshooting custom domains HTTPS provides a layer of encryption that prevents others from snooping on or tampering with traffic to your site. When HTTPS is enforced, your site will only be served over HTTPS. Learn more. "

this is my first time hosting a web repo on github.please help.


Solution

  • Using github to deploy your website

    The deploying process is the following: (Try to use VSCode)

    Consider that your files are present inside the 'project' folder

    i) Create a new folder 'build' inside your main 'project' folder.

    ii) Move your website data in 'built' folder. Inside the 'build' folder all your website data will be present.(images, index.html , .css, .js, or any reactjs files)

    iii) Traverse to the main 'project' folder through cmd and type 'npm init' command in VsCode Terminal to initialize pacakge.json file inside your main 'project' folder.(Ensure that Node.js is installed before using node package manager(npm))

    iv) Go to package.json file and use npm i gh-pages command to install gh-pages, which will be added as a dependancy in package.json file.

    v) Your github repo link is present as value of homepage key in package.json file. homepage : "https://github.com/username/project"

    vi) Create a script Replace "test": "echo \"Error: no test specified\" && exit 1"', with "deploy" : "gh-pages -d build"

    vii) Push all this to github (Add .gitignore file so that node modules are not pushed to github)

    git init

    git add .

    git commit -m "deploy"

    git remote add project "https://username.github.io/project"

    git push -u project master

    viii) Through cmd run your project now by using this command npm run deploy (Should display "Published" after you run the project)

    ix) Go to Github repo that you have created for your project and check, there must be a new branch 'gh-pages' added with your master branch.

    x) Now from the settings of your repository, select gh-pages branch as the source of your github pages.

    And finally, your site is ready to be published at https://username.github.io/project/. Wait for 5-10 mins and then check it.