info perto
info perto

Reputation: 89

How do I publish my react app on github properly?

enter image description here

I am trying to publish my react app on github.Here are the steps that I have followed.

1-I have installed git on my windows.

2- In Visual Studios terminal I have written git init

3-Then I have created a repository on github called "cartdemo"

4-In my package.json I have changed homepage, made the private false and added "deploy": "gh-pages -d build

5- Again in VS terminal I have written git add .

6-git commit -m "Go Live"

7-git remote add origin https://github.com/rahman23/cartdemo.git

8-git push

Note: Here you can see the files https://github.com/rahman23/cartdemo

However when I hit the link https://rahman23.github.io/cartdemo/ I get a page where it is written

cartdemo

This project was bootstrapped with Create React App.

Available Scripts

In the project directory, you can run:

npm start

Runs the app in the development mode.

Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.

You will also see any lint errors in the console.

Where did I do wrong?

Upvotes: 1

Views: 2855

Answers (2)

Pascal
Pascal

Reputation: 11

First of all install gh-pages by runnung npm install gh-pages --save-dev or yarn install gh-pages --save-dev or brew install gh-pages --save-dev. Then open package.json file. Add these lines in the script

"predeploy": "npm run build" "deploy": "gh-pages -d build"

so that it looks like this;

"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" } ,

Then add this line at the "homepage": "https://github-user-name.github.io/repo-name", then create your build folder by running npm run buid or yarn run build or brew run build depending on the os you are using.

Then run npm run deploy or yarn run deploy or brew run deploy.

Go to github settings near the top of the bar

Make sure you select the branch you want to deploy from the drop down.

Make sure you have can see gh-pages selected and click save or leave it if it's already been selected. then go to 'view deployment' and there you go. Hurray now you know react!

Upvotes: 1

stever
stever

Reputation: 1241

In step 8, you need to tell git which repo and branch to push the project to. Since you added an origin, you would...

git push origin master 

Since the project has now been pushed, add this to your package.json file. "homepage" : "http://rahman23.github.io/cartdemo" then run: yarn build in the console, and try pushing it again...

Upvotes: 1

Related Questions